Fix SVG id collisions by using random UUIDs instead of element IDs

[FelixTJDietrich]

Checklist

• I documented the TypeScript code using JSDoc style.
• I added multiple screenshots/screencasts of my UI changes
• I translated all the newly inserted strings into German and English

Motivation and Context

In ls1intum/Artemis#8823 some markers are missing from the solution diagram.

References for this issue:
https://stackoverflow.com/questions/37000385/multiple-svg-with-same-ids
https://stackoverflow.com/questions/54349169/svg-marker-disappears-when-svg-with-identical-definition-is-hidden

Description

To prevent such id collisions on the same page in the future, I changed it to use a random UUID instead of the element.id.

Steps for Testing

Check if the <marker> elements have now a random uuid, by exporting multiple times.

Test Coverage

File	Branch	Line

no change

Screenshots

no change

[farisd16]

Code looks good to me, also tested and it worked as expected

[matthiaslehnertum]

@FelixTJDietrich Could you update the snapshots here so the tests go through?

[FelixTJDietrich]

I will update the code soon to use one global random uuid for the diagram if none is specified. I want to use a fixed id for the snaps so they become stable.