Skip to content

[css-values-5] allow attr() to be used for URLs #12340

Open
@miragecraft

Description

@miragecraft

I've been waiting for attr() to be made available outside of content, but was dismayed to discover you are not allowed to use it for URLs because this is exactly what I wanted to use it for.

I believe this cripples attr()'s utility and I do not agree with the security threat justification.

First of all, the reasoning given is that it risks leaking data via dynamically constructing URLs, but CSS does not allow dynamic URLs anyhow, because you cannot use variables inside url().

The "dynamic" example given in MDN is entirely static:

<!-- This won't work! -->
<span data-icon="https://example.org/icons/question-mark.svg">help</span>
span[data-icon] {
  background-image: url(attr(data-icon));
}

How is this a security risk if the attribute already include the entirety of the URL?

If attacks already have access to the HTML to create the entire URL, they don't need to use attr().

Secondly, even if there is plans to allow dynamic URL construction in the future, you can apply CORS same-origin restrictions to the attr()-tainted value instead of disallowing its use entirely.

For the above reasons, I'm advocating for the removal or modification of this restriction as it stands.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions