diff --git a/change/@griffel-core/warn-duplicate-rehydration-styles-20260620155350.json b/change/@griffel-core/warn-duplicate-rehydration-styles-20260620155350.json new file mode 100644 index 000000000..3f1bfe025 --- /dev/null +++ b/change/@griffel-core/warn-duplicate-rehydration-styles-20260620155350.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "Warn in development when duplicate CSS rules are found during rehydration — a signal that server-rendered styles were flushed into the HTML more than once (e.g. the Next.js App Router calling renderToStyleElements on every flush without clearing the renderer)", + "packageName": "@griffel/core", + "email": "vaclav.dvorak@ysoft.com", + "dependentChangeType": "patch" +} diff --git a/packages/core/src/renderer/rehydrateRendererCache.test.ts b/packages/core/src/renderer/rehydrateRendererCache.test.ts index 37855a730..570192b63 100644 --- a/packages/core/src/renderer/rehydrateRendererCache.test.ts +++ b/packages/core/src/renderer/rehydrateRendererCache.test.ts @@ -1,4 +1,4 @@ -import { afterEach, beforeEach, describe, expect, it } from 'vitest'; +import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'; import { DATA_BUCKET_ATTR, DATA_PRIORITY_ATTR } from '../constants.js'; import type { GriffelRenderer } from '../types.js'; import { createDOMRenderer } from './createDOMRenderer.js'; @@ -105,4 +105,52 @@ describe('rehydrateRendererCache', () => { } `); }); + + it('warns in development when the same rule is rehydrated from multiple