Skip to content
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

Update "javascript:" handling; esp. SVG animation and MathML href. #212

Merged
merged 5 commits into from
Jan 10, 2025

Conversation

otherdaniel
Copy link
Collaborator

@otherdaniel otherdaniel commented Mar 28, 2024

  • Add SVG & to list of javascript:-attributes.
  • Add a list for SVG animations.
  • Minor edits when using those lists.

Preview | Diff

Copy link
Collaborator

@annevk annevk left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@cure53 do you know why DOMPurify bans all SVG animation? Do you know other maintainers we can reach out to?

index.bs Outdated
1. If the [=animating URL attributes list=] [=SanitizerConfig/contains=]
«[|elementName|, |attrName|]» and |attr|'s
[=get an attribute value|value=] [=string/is=] "`href`" or
"`xlink:href`":
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We should double check that xlink:href is actually meaningful as it supposedly only works when xmlns puts xlink in scope which is never the case in HTML.

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

xlink:href works in HTML regardless of namespace declarations. https://html.spec.whatwg.org/multipage/parsing.html#adjust-foreign-attributes

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@zcorpan that is xlink:href as an attribute, but not as an attribute value of these SVG attributes.

Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, I see. Still, xmlns:xlink is also an adjusted attribute.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good point, so it should work when xmlns:xlink is also specified. In which case we want to always ban xlink:href as is suggested here. (Having tests for all these combinations would be good though.)

I guess the other piece of feedback I forgot to note down here is that we should make sure we have the same processing model as these attributes have today, which regards to splitting on whitespace and such.

@securityMB
Copy link

@cure53 do you know why DOMPurify bans all SVG animation? Do you know other maintainers we can reach out to?

I believe the reason is that you can use SVG animation to animate href attribute which can lead to XSS.

For example:

<svg>
<animate xlink:href=#x 
         attributeName=href 
         values=javascript:alert(1) />
<a id=x>
  <text x=10 y=10>
    Click me
  </text>
</a>

@annevk
Copy link
Collaborator

annevk commented Apr 3, 2024

@securityMB thanks for weighing in! This PR attempts to tackle that in a more specific way, allowing generic animation features to continue to work. We are wondering if that is good enough or if we'll run into other trouble.

@lukewarlow
Copy link
Contributor

Trusted types covers the SVGAnimatedString IDL type, which covers you updating an SVGScriptElement hrefs baseVal, and it also includes the javascript: url pre-navigation handling for when a javascript URL is defined in markup and navigated to.

So I think if sanitizer is stripping the javascript: value for href (and probably it's xlink variant?) from any markup via the safe sync, along with probably stripping out the script element from SVG entirely (aka follow the same model as happens with HTML), that should be sufficient?

@annevk
Copy link
Collaborator

annevk commented Apr 3, 2024

@lukewarlow no, see the example above: #212 (comment). We cannot rely on the navigation check Trusted Types has here. We need something along the lines of this PR or ban SVG animation entirely, but that seems less well founded.

@lukewarlow
Copy link
Contributor

Sorry to clarify I didn't mean to rely on TT for anything I was just providing context on what TT does for this area.

@otherdaniel
Copy link
Collaborator Author

otherdaniel commented Apr 8, 2024

I wrote a test to figure out what browsers will actually do...

  • Animating "href" to a javascript:-url is implemented by all browsers.
  • Chrome & Safari, but not Firefox, will animate "xlink:href", but only if there's an explicit xmlns:xlink declaration.
  • There seems to be no pre-processing (like strippping whitespace) involved. I couldn't get " href " to animate.

(Source is here and there.)


[Edit: In HTML documents, Chrome & Safari will animate "xlink:href", but only if there's an explicit xmlns:xlink declaration. They will not animate another prefix, even with a declaration. In XML documents, both will animate whatever prefix has the proper xmlns: declaration, e.g. bla:href with an xmlns:bla=.... It seems FF will not animate any name with any namespace prefix in any document mode.]

@otherdaniel otherdaniel force-pushed the navigating-url-attributes branch from f8f8ef2 to 7b5fe3f Compare April 9, 2024 16:06
@otherdaniel
Copy link
Collaborator Author

The current version now does this:

  • Remove the following attributes, if their value has a `javascript:' prefix:
    • <a href>
    • <area href>
    • <form action>
    • <input formaction>
    • <button formaction>
    • <a href> (SVG namespace)
    • <a xlink:href> (SVG namespace)
    • href in any element in the MathML namespace
  • Remove attributeName attribute, if its value is href or xlink:href from:
    • <animate attributeName> (SVG namespace; also all below)
    • <animateMotion attributeName> (as above)
    • <animateTransform attributeName> (as above)
    • <set attributeName> (as above)

I think this covers all cases we have discovered.

Presently, this just non-chalantly states the algorithm. Should I add a note and/or appendix that explains how we got there, in case someone else wants to understand what the point is?

index.bs Outdated Show resolved Hide resolved
index.bs Outdated

</div>

<div class=note>
<span class=marker>Note:</span> Current browsers support `javascript` URLs
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I would make this javascript: URLs throughout (including the :), including in definitions. I think that's more consistent with how we approach this elsewhere.

index.bs Outdated Show resolved Hide resolved
Copy link
Collaborator

@annevk annevk left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think this looks good now, modulo nits. It's unfortunate we have to invoke the URL parser though, but I guess so be it. We never said that safe was going to be cheap.

index.bs Outdated Show resolved Hide resolved
index.bs Outdated Show resolved Hide resolved
index.bs Outdated Show resolved Hide resolved
@otherdaniel otherdaniel force-pushed the navigating-url-attributes branch from fa31d18 to 65b8fee Compare April 17, 2024 09:34
@otherdaniel
Copy link
Collaborator Author

In the meeting, we had briefly discussed what the support for MathML + href + javascript: was. It seems there's already WPT tests for this: https://wpt.fyi/results/mathml/relations/html5-tree?label=master&label=experimental&aligned&q=mathml%2Frelations%2Fhtml5-tree%2Fhref-click

href-click-003.tentative.html tests navigating to a javascript:-url.

@otherdaniel otherdaniel force-pushed the navigating-url-attributes branch from 3bc2e48 to 252a614 Compare January 8, 2025 17:57
@otherdaniel
Copy link
Collaborator Author

Since this PR was quasi-abandoned, I've rebased and (partially) re-written it. Also, instead of the usual chronological commit history, this is now seperated out in semantically meaninfgul, seperate commits, that can also be reviewed seperately.

  1. A handful of editorial changes that are likely uncontroversial. Mainly, moving if-then clauses with tiny then actions into a single line.
  2. Complete hte list of built-in navigating URL attributes.
  3. Handle SVG animation of navigating attributes.
  4. Handle MathML xlink:href support.
  5. Add an explanatory note.

@otherdaniel otherdaniel force-pushed the navigating-url-attributes branch from 252a614 to 7de7d50 Compare January 8, 2025 18:08
index.bs Outdated Show resolved Hide resolved
@otherdaniel otherdaniel force-pushed the navigating-url-attributes branch from 7de7d50 to 26f83ee Compare January 9, 2025 10:31
@otherdaniel otherdaniel changed the title Adapt "funky elements handling" to include SVG. Update "javascript:" handling; esp. SVG animation and MathML href. Jan 9, 2025
Copy link
Collaborator

@annevk annevk left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me modulo some nits.

index.bs Outdated Show resolved Hide resolved
index.bs Outdated Show resolved Hide resolved
index.bs Outdated Show resolved Hide resolved
index.bs Outdated Show resolved Hide resolved
@otherdaniel otherdaniel force-pushed the navigating-url-attributes branch from 26f83ee to 7134494 Compare January 10, 2025 14:32
@otherdaniel otherdaniel merged commit 52b4880 into WICG:main Jan 10, 2025
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants