Use the response URL as the base URL for CSS and XSLT stylesheets
On the web, URLs are usually relative to the document's base URL. That means, if the page is
/hello/
and contains
<img src="world.jpg">
, the image is loaded from
/hello/world.jpg
.
There are a couple of exceptions to this, the most common of which is CSS. Within stylesheets, URLs (e.g. for background images) are relative to the stylesheet's "response URL".
The "response" distinction is important. If the page contains
<link rel="stylesheet" href="/styles.css">
, and
/styles.css
redirects to
/foo/styles.css
, URLs in the stylesheet will be relative to
/foo/styles.css
. In this case the request URL is different to the response URL, and it's the response URL that's used as the base URL.
With a service worker in the middle, Chrome didn't handle this correctly. It would use the request URL as the base URL for CSS. This is fixed in Chrome 73. Chrome will correctly use the response URL.
This change applies to the following resource types:
XHR: Use the response URL for responseURL and documents
XHR's responseURL property should provide the URL of the response.
In many cases, the request and response URLs are the same, but service workers can choose to return a response from elsewhere. Redirects also cause the request and response URLs to be different.
If the XHR request was intercepted by a service worker, Chrome would incorrectly set responseURL to the request URL.
This is fixed in Chrome 73. Chrome will correctly set responseURL to the response URL.