Предварительная загрузка rel в теге ссылки не работает для теневых компонентов ⇐ CSS

[Anonymous]

Я загрузил тег ссылки предварительной загрузки в заголовок.
А затем отрисовал теневой компонент (welcome-comp) с тем же тегом ссылки href внутри него. Проблема в том, что ресурс тега ссылки по-прежнему загружается снова. нажмите кнопку, чтобы снова отобразить компонент, но ресурс загружается снова. Он отлично работает для нетеневых компонентов.
HTML:

Код: Выделить всё

Demo


class WelcomeComp extends HTMLElement {
connectedCallback() {
this.attachShadow({ mode: 'open' });
let link = document.createElement('link');
link.href = 'style.css';
link.rel = 'stylesheet';
this.shadowRoot.appendChild(link);

let content = document.createElement('div');
content.setAttribute('class', 'cls');
content.setAttribute('id', 'cls');
content.innerHTML = 'welcome here! check network tab new request triggered';
this.shadowRoot.appendChild(content);
}
}
customElements.define('welcome-comp', WelcomeComp);







render new component

css:

Код: Выделить всё

.cls{color:red}

Эта проблема возникает только в браузерах на базе Chrome, нормально работает в браузерах Mozilla и Safari.

Подробнее здесь: https://stackoverflow.com/questions/791 ... components