diff --git a/src/StyleContext.tsx b/src/StyleContext.tsx index 8bf5eb07..b1fef2ce 100644 --- a/src/StyleContext.tsx +++ b/src/StyleContext.tsx @@ -14,6 +14,7 @@ export function createCache() { const styles = document.body.querySelectorAll(`style[${ATTR_MARK}]`); Array.from(styles).forEach((style) => { + (style as any)[CSS_IN_JS_INSTANCE] ??= CSS_IN_JS_INSTANCE_ID; document.head.appendChild(style); }); @@ -23,7 +24,9 @@ export function createCache() { (style) => { const hash = style.getAttribute(ATTR_MARK)!; if (styleHash[hash]) { - style.parentNode?.removeChild(style); + if ((style as any)[CSS_IN_JS_INSTANCE] === CSS_IN_JS_INSTANCE_ID) { + style.parentNode?.removeChild(style); + } } else { styleHash[hash] = true; } diff --git a/tests/server.spec.tsx b/tests/server.spec.tsx index ee60c4fc..eda291d5 100644 --- a/tests/server.spec.tsx +++ b/tests/server.spec.tsx @@ -12,6 +12,11 @@ import { import type { CSSInterpolation } from '../src'; // eslint-disable-next-line @typescript-eslint/no-unused-vars import canUseDom from 'rc-util/lib/Dom/canUseDom'; +import { + CSS_IN_JS_INSTANCE, + CSS_IN_JS_INSTANCE_ID, + ATTR_MARK, +} from '../src/StyleContext'; interface DesignToken { primaryColor: string; @@ -192,6 +197,11 @@ describe('SSR', () => { // Patch to header expect(document.head.querySelectorAll('style')).toHaveLength(1); + expect( + (document.head.querySelector(`style[${ATTR_MARK}]`) as any)[ + CSS_IN_JS_INSTANCE + ], + ).toBe(CSS_IN_JS_INSTANCE_ID); expect(errorSpy).not.toHaveBeenCalled(); });