-
-
Notifications
You must be signed in to change notification settings - Fork 3.5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix(): svg parsing logic with use and style #10050
fix(): svg parsing logic with use and style #10050
Conversation
Review or Edit in CodeSandboxOpen the branch in Web Editor • VS Code • Insiders |
Did you find this priority described somewhere or you just checked how a browser behave? |
src/parser/parseUseDirectives.ts
Outdated
const mergedStyles = Object.keys(styleRecord).reduce( | ||
(a, v) => a + v + ':' + styleRecord[v] + ';', | ||
'' | ||
); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Could this be:
const mergedStyles = Object.keys(styleRecord).reduce( | |
(a, v) => a + v + ':' + styleRecord[v] + ';', | |
'' | |
); | |
const mergedStyles = Object.entries(styleRecord).map(entry => entry.join(':')).join(';'); |
?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
That’s easier to interpret than what I made. Pushed.
I tested the browser and tried different settings. The three tests I came up with show how they acted in chrome. The SVG docs were not clear about how this case should be handled from what I saw. |
Firefox, Safari and Chrome behave the same. Same for attributes. |
Description
style tags between a path and use tag don't seem to work properly compared to Chrome. In Chrome, when both have a style, the path has priority but merges with the use tag where they do not share styles. Previously, fabric would take the use tag's style wholesale. This PR merges the two when both exist and tests were added to verify the both case and cases where only one has a style.
Closes #9840