guawazi/qiankun-fit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

🐛 lazy init ScopedCSS to support referenced by html head script block (#923)

Browse Source
This commit is contained in:
Kuitos 2020-09-11 18:41:19 +08:00 committed by GitHub
parent 447454f97c
commit 55513f0e3a
2 changed files with 23 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
src/sandbox/patchers/__tests__/css.test.ts
View File

@ -3,9 +3,19 @@
* @since 2020-04-19 * @since 2020-04-19
*/ */
import { processor as CSSProcessor } from '../css'; import { ScopedCSS } from '../css';
import { sleep } from '../../../utils'; import { sleep } from '../../../utils';
let CSSProcessor: ScopedCSS;
beforeAll(() => {
CSSProcessor = new ScopedCSS();
});
afterAll(() => {
// @ts-ignore
CSSProcessor = null;
});
const fakeStyleNode = (css: string) => { const fakeStyleNode = (css: string) => {
const styleNode = document.createElement('style'); const styleNode = document.createElement('style');
const textNode = document.createTextNode(css); const textNode = document.createTextNode(css);

17
src/sandbox/patchers/css.ts
View File

@ -22,7 +22,7 @@ const arrayify = <T>(list: CSSRuleList | any[]) => {
return [].slice.call(list, 0) as T[]; return [].slice.call(list, 0) as T[];
}; };
class ScopedCSS { export class ScopedCSS {
private static ModifiedTag = 'Symbol(style-modified-qiankun)'; private static ModifiedTag = 'Symbol(style-modified-qiankun)';
private sheet: StyleSheet; private sheet: StyleSheet;
@ -174,10 +174,19 @@ class ScopedCSS {
} }
} }
const processor = new ScopedCSS(); let processor: ScopedCSS;
export const QiankunCSSRewriteAttr = 'data-qiankun'; export const QiankunCSSRewriteAttr = 'data-qiankun';
const process = (appWrapper: HTMLElement, stylesheetElement: HTMLStyleElement | HTMLLinkElement, appName: string) => { export const process = (
appWrapper: HTMLElement,
stylesheetElement: HTMLStyleElement | HTMLLinkElement,
appName: string,
) => {
// lazy singleton pattern
if (!processor) {
processor = new ScopedCSS();
}
if (stylesheetElement.tagName === 'LINK') { if (stylesheetElement.tagName === 'LINK') {
console.warn('Feature: sandbox.experimentalStyleIsolation is not support for link element yet.'); console.warn('Feature: sandbox.experimentalStyleIsolation is not support for link element yet.');
} }
@ -194,5 +203,3 @@ const process = (appWrapper: HTMLElement, stylesheetElement: HTMLStyleElement |
processor.process(stylesheetElement, prefix); processor.process(stylesheetElement, prefix);
} }
}; };
export { process, processor };