Skip to content

[css-images] [css-values] Fetch algorithms require a style sheet, which may not exist #12065

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.

Sign up for GitHub

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

Jump to bottom
Closed
AtkinsSJ opened this issue Apr 10, 2025 · 4 comments · Fixed by #12261
Closed

[css-images] [css-values] Fetch algorithms require a style sheet, which may not exist #12065

AtkinsSJ opened this issue Apr 10, 2025 · 4 comments · Fixed by #12261
Assignees
@noamr

Comments

@AtkinsSJ
Copy link
Contributor

"fetch a style resource" and thus "fetch an external image for a stylesheet" require a non-null CSSStyleSheet. However, there may not be such a sheet. Specifically, presentational hints and style attributes.

For example:

<body background="image.png">

Here the background attribute sets background-image:

When a body element has a background attribute set to a non-empty value [...] the user agent is expected to treat the attribute as a presentational hint setting the element's 'background-image' property to the return value.
https://html.spec.whatwg.org/multipage/rendering.html#the-page:attr-background

As another example, inline styles:

">
<div style="background-image: url('image.png')">

As far as I'm aware, neither of these have a CSSStyleSheet object associated with them. Seems like we should probably fall back to using the Document's base URL in these cases.
@weinig
Copy link
Contributor

weinig commented Apr 15, 2025

cc @fantasai, @tabatkins, @noamr, @annevk

@noamr
Copy link
Collaborator

noamr commented Apr 17, 2025

We should pass either a sheet or an element here.
Happy to work on a PR once #12074 is merged.

@trflynn89
Copy link

Just wanted to point out another issue with the style sheet assumption here:

https://www.w3.org/TR/css-values-4/#fetch-a-style-resource

  1. If sheet’s origin-clean flag is set, set req’s initiator type to "css". [CSSOM]

If we don't have a style sheet, we still have to set an initiator type here. Otherwise, a PerformanceResourceTiming timing event won't be fired for this fetch request (the event is gated by spec prose which states "If fetchParams’s request’s initiator type is not null" in the fetch finale).

WPT has a test which relies on this behavior.

@noamr
Copy link
Collaborator

noamr commented May 12, 2025

Just wanted to point out another issue with the style sheet assumption here:

https://www.w3.org/TR/css-values-4/#fetch-a-style-resource

  1. If sheet’s origin-clean flag is set, set req’s initiator type to "css". [CSSOM]

If we don't have a style sheet, we still have to set an initiator type here. Otherwise, a PerformanceResourceTiming timing event won't be fired for this fetch request (the event is gated by spec prose which states "If fetchParams’s request’s initiator type is not null" in the fetch finale).

WPT has a test which relies on this behavior.

This was the original purpose of this line, to avoid exposing what resources external no-cors CSS downloads.

noamr added a commit to noamr/csswg-drafts that referenced this issue Jun 2, 2025
@noamr
[css-vlaues-4] [css-cascade-4] [css-color-5] [css-fonts-4] [css-image…
2366187 
…s-4] [css-shapes-2] Clean up fetching

This fixes a few cases around fetching external URLs for style resources:
- The base URL is the sheet's base URL if exists, otherwise the sheet's location, otherwise the document
  base URL.
- The algorithm can take either a rule or declaration block, and derive the correct stylesheet and base
  URL from that.
  Updated the calling sites to take that onto account.

- Removed redundant URL parsing in "@import".

Closes w3c#12065
Closes w3c#12068
Closes w3c#12086
Closes w3c#12147
@noamr noamr mentioned this issue Jun 2, 2025
Merged
noamr added a commit that referenced this issue Jun 3, 2025
@noamr
[css-values-4] [css-cascade-4] [css-color-5] [css-fonts-4] [css-image…
034a433 
…s-4] [css-shapes-2] Clean up fetching (#12261)

* [css-vlaues-4] [css-cascade-4] [css-color-5] [css-fonts-4] [css-images-4] [css-shapes-2] Clean up fetching

This fixes a few cases around fetching external URLs for style resources:
- The base URL is the sheet's base URL if exists, otherwise the sheet's location, otherwise the document
  base URL.
- The algorithm can take either a rule or declaration block, and derive the correct stylesheet and base
  URL from that.
  Updated the calling sites to take that onto account.

- Removed redundant URL parsing in "@import".

Closes #12065
Closes #12068
Closes #12086
Closes #12147

* Extract the computed absolute URL to a separate algo

* A few fixes

* nit
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@noamr noamr

Labels
None yet
Projects
None yet
Milestone
No milestone
4 participants
@noamr @AtkinsSJ @weinig @trflynn89