User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36 Steps to reproduce: Insert an <link rel="stylesheet" href="..."> in to a shadow tree. Actual results: <link> is completely ignored. Expected results: stylesheet should be downloaded and applied to the current shadow tree. Chromium has implemented this a long time ago: https://bugs.chromium.org/p/chromium/issues/detail?id=630141 Also see: https://github.com/w3c/webcomponents/issues/530

Hello xlas1, Please provide an example for us to confirm the issue. Can you give us or create a detailed test case? Thank you!

``` var div = document.body.appendChild(document.createElement("div")) var root = div.attachShadow({ mode:"open" }) var link = document.createElement("link") link.rel = "stylesheet" link.href = "https://whatever.domain/a.css" root.appendChild(link) ``` In this piece of code, the stylesheet should be downloaded and applied only to the shadow tree. The actual result is that the link tag is ignored, the stylesheet is not even downloaded.

I have tested this piece of code on different browsers to see what errors it returns: Windows 10: * Nightly v63.0a1: "Content Security Policy: The page’s settings blocked the loading of a resource at https://whatever.domain/a.css (“style-src”)." * Beta v62.0b7: "TypeError: div.attachShadow is not a function[Learn More]" (with reference link to: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Not_a_function) * Release v61.0.1: "TypeError: div.attachShadow is not a function[Learn More]" (the same as above) * Chrome V67.0.3396.99: "Refused to load the stylesheet 'https://whatever.domain/a.css' because it violates the following Content Security Policy directive: "style-src 'self' 'unsafe-inline'"." * Edge 41.16299.492.0: "Object doesn't support property or method 'attachShadow' SCRIPT438: Object doesn't support property or method 'attachShadow' eval code (1) (1,1)" Mac OS X: * Nightly v63.0a1: "Content Security Policy: The page’s settings blocked the loading of a resource at https://whatever.domain/a.css (“style-src”)." * Beta v62.0b7: "TypeError: div.attachShadow is not a function[Learn More]" (with reference link to: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Errors/Not_a_function) * Release v61.0.1: "TypeError: div.attachShadow is not a function[Learn More]" (the same as above) * Safari 11.0.3: "Refused to load https://whatever.domain/a.css because it does not appear in the style-src directive of the Content Security Policy." It appears to be a content security related issue. I'll set this issue's component as Core: Security and I'll let the developers decide whether this is a valid issue or not. Thank you for your contribution!

I’m sorry but you completely misinterpreted my example. You should have use a stylesheet that meant to be able to acces by content security policy, I put that url just as an example, you should not have copied exactly. Now your comment and categorization of this bug is totally misleading!

With stable Firefox, and Shadow DOM enabled in about:config, link is not working at all. But according to the error message in Nightly, at least it’s trying to downloading the stylesheet, but it’s failing due to 1) I guess you load the html with file:// protocol which triggered CSR error 2) The url is just an example, it really should be a real url to a really exist stylesheet

I'm sorry I misinterpreted your guidance. Please provide a test case with detailed steps to reproduce. I'll do my best to confirm your issue and set it's component correctly. You'll have to indulge my relatively low technical skill. Thank you!

I added an example: https://codesandbox.io/s/10m8x1lrq4 Firefox 65 behaves like chrome.