Closed busynest closed 2 years ago
CSSResultArray loads all non lazy-loaded Modular styles into primary HTML Document's <head> tag. This causes glitches to show CSS crossed out in the Inspector, but actually takes first order and overrides.
<head>
Document Structure:
HTML: <application-shell>
<application-shell>
doc 1: CSS Modules Document
export const _colours : CSSResult = css` :host { color: green; } `; export const _appShell : CSSResult = css` :host { color: blue; } `; export const _homePage : CSSResult = css` :host { color: red; } `;
doc 2: application-shell static get styles():CSSResultArray { return [ _colours, _appShell ...
static get styles():CSSResultArray { return [ _colours, _appShell ...
doc 3: home-page static get styles():CSSResultArray { return [ _colours, _homePage ...
static get styles():CSSResultArray { return [ _colours, _homePage ...
I expected my <head> to be clean and isolated from Modules.
A similar
Description
CSSResultArray loads all non lazy-loaded Modular styles into primary HTML Document's
<head>
tag. This causes glitches to show CSS crossed out in the Inspector, but actually takes first order and overrides.Steps to Reproduce
Document Structure:
HTML:
<application-shell>
doc 1: CSS Modules Document
doc 2: application-shell
static get styles():CSSResultArray { return [ _colours, _appShell ...
doc 3: home-page
static get styles():CSSResultArray { return [ _colours, _homePage ...
Expected Results
I expected my
<head>
to be clean and isolated from Modules.A similar