New issue
Advanced search Search tips

Issue 825172 link

Starred by 1 user

Issue metadata

Status: WontFix
Owner: ----
Closed: Mar 2018
Components:
EstimatedDays: ----
NextAction: ----
OS: Windows
Pri: 2
Type: Bug



Sign in to add a comment

link.crossorigin doesn't work

Reported by k...@luminance.org, Mar 23 2018

Issue description

UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:60.0) Gecko/20100101 Firefox/60.0

Steps to reproduce the problem:
var e = document.createElement("link");
e.rel = "preload"; e.as = "fetch"; e.crossorigin = "anonymous"; e.href = "about:blank"; e

What is the expected behavior?
<link rel="preload" as="fetch" crossorigin="anonymous" href="about:blank">

What went wrong?
<link rel="preload" as="fetch" href="about:blank">

Chrome's DOM api silently discards the crossorigin attribute. This results in fetch preloads silently failing, they never work and there is no diagnostic information to explain it.

Did this work before? No 

Does this work in other browsers? No
 Firefox behaves the same way. I believe this is incorrect and it is not specified anywhere in developer guides (like Google Developers) or in the spec, as far as I can tell.

Chrome version: 65.0.3325.181 (Official Build) (64-bit) (cohort: Stable)  Channel: stable
OS Version: 10.0
Flash Version: 

Because preload is ignored, each XHR eats a sequential round-trip to the disk cache process. For the pages I'm dealing with that's 10-60ms per page load.

If you generate a bunch of preload links using a div and innerHTML, the preload functions correctly once you insert the div into the document.head.

P.S. the successfully preloaded XHRs disappear entirely from the network timeline, which kind of makes this hard to debug if you don't know what you're looking for. I'm not convinced that the preloaded assets are actually hitting the in-process memory cache, because the page load times have not improved... but they're not showing up in the timeline and the 'asset was preloaded without being used' warnings are gone, so the preload is working.
 

Comment 1 by woxxom@gmail.com, Mar 23 2018

The observed behavior is correct and matches the spec.
Unlike HTML, DOM interface is case-sensitive and defines crossOrigin attribute with an uppercase O:
https://html.spec.whatwg.org/#the-link-element

Comment 2 by k...@luminance.org, Mar 23 2018

Thanks for the citation, I see. Is there some reason why 'x.crossorigin' can't work given that the camel case variant never appears in documentation or in most other spec text? I guess I can imagine an obscure scenario where it breaks existing software, but it seems worthwhile to just make it work.

Comment 3 by woxxom@gmail.com, Mar 23 2018

There is only one DOM spec (many editions though) and it defines the attribute as crossOrigin.
You can try urging the other documentation resources to fix their info.
BTW it's not the only attribute that uses camelCase in DOM and lowercase in HTML.

Comment 4 by tkent@chromium.org, Mar 26 2018

Components: -Blink>DOM Blink>HTML>Link
Status: WontFix (was: Unconfirmed)

Comment 5 by tkent@chromium.org, Mar 26 2018

Summary: link.crossorigin doesn't work (was: link rel="preload" as="fetch is unusably broken via the DOM API)

Sign in to add a comment