CSS variables in partial URLs are resolving to the current domain instead of the stylesheet's domain

• Component: CSS
• Status: RESOLVED DUPLICATE

[David Mahaffy]

When using CSS variables to populate URLs with relative paths (i.e. "/myapp/gifs/happy.gif") and linking the stylesheet from a subdomain, WebKit is resolving the partial URL to the parent domain instead of the subdomain.

Per the W3 spec, the partial URL should be resolved according to the location of the stylesheet:
https://www.w3.org/TR/CSS1/#url

For example, if the stylesheet is located on www.mysite.com but it's being linked by a page in www.subsite.mysite.com, and the partial URL is "/myapp/gifs/happy.gif" I would expect the URL to resolve to "www.mysite.com/myapp/gifs/happy.gif" but WebKit is resolving it as "www.subsite.mysite.com/myapp/gifs.happy.gif"

An example page demonstrating this behavior:
https://qa.ea.financial-net.com/cssVarTest.html

The image appears correctly when opened in Chrome, Firefox, Brave, Opera, Edge on Windows or Android, but Safari does not display the image because the stylesheet and graphic are both on the qa.financial-net.com domain but WebKit is trying to pull the graphic from the qa.ea.financial-net.com domain.

[Darin Adler]

Seems like this is a duplicate of bug 230243, which was fixed in September, likely to late to be in Safari 15. I’ll check when I get a chance.

[Darin Adler]

Yes, verified this is a duplicate.

*** This bug has been marked as a duplicate of bug 230243 ***