diff --git a/src/sandbox/patchers/__tests__/css.test.ts b/src/sandbox/patchers/__tests__/css.test.ts index 7f5a657..1fdb5a9 100644 --- a/src/sandbox/patchers/__tests__/css.test.ts +++ b/src/sandbox/patchers/__tests__/css.test.ts @@ -301,6 +301,35 @@ test('should not transform @font-face', () => { expect(removeWs(styleNode.textContent)).toBe(removeWs(expectValue)); }); +test('should not transform style that has already been transform [1]', async () => { + const actualValue = '.react15-main {display: flex;}'; + const expectValue = 'div[data-qiankun="react15"] .react15-main {display: flex;}'; + + const styleNode = fakeStyleNode(''); + CSSProcessor.process(styleNode, 'div[data-qiankun="react15"]'); + + const textNode = document.createTextNode(actualValue); + styleNode.appendChild(textNode); + + await sleep(10); + + CSSProcessor.process(styleNode, 'div[data-qiankun="react15"]'); + + expect(removeWs(styleNode.textContent)).toBe(removeWs(expectValue)); +}); + +test('should not transform style that has already been transform [2]', async () => { + const actualValue = '.react15-main {display: flex;}'; + const expectValue = 'div[data-qiankun="react15"] .react15-main {display: flex;}'; + + const styleNode = fakeStyleNode(actualValue); + CSSProcessor.process(styleNode, 'div[data-qiankun="react15"]'); + + CSSProcessor.process(styleNode, 'div[data-qiankun="react15"]'); + + expect(removeWs(styleNode.textContent)).toBe(removeWs(expectValue)); +}); + // jest cannot handle @page directive correctly test.skip('should not transform @page', () => { const actualValue = '@page {margin: 1cm;}'; diff --git a/src/sandbox/patchers/css.ts b/src/sandbox/patchers/css.ts index 1bcbbc9..3423149 100644 --- a/src/sandbox/patchers/css.ts +++ b/src/sandbox/patchers/css.ts @@ -41,6 +41,10 @@ export class ScopedCSS { } process(styleNode: HTMLStyleElement, prefix: string = '') { + if (ScopedCSS.ModifiedTag in styleNode) { + return; + } + if (styleNode.textContent !== '') { const textNode = document.createTextNode(styleNode.textContent || ''); this.swapNode.appendChild(textNode); @@ -52,6 +56,7 @@ export class ScopedCSS { // cleanup this.swapNode.removeChild(textNode); + (styleNode as any)[ScopedCSS.ModifiedTag] = true; return; }