From d1043f067e6949db47f5decbeb46b30e1b2515ba Mon Sep 17 00:00:00 2001 From: BigSimmo <87357024+BigSimmo@users.noreply.github.com> Date: Fri, 24 Jul 2026 12:35:59 +0800 Subject: [PATCH 01/16] Fix React hydration mismatches and add Playwright safeguards --- .../restrict-suppress-hydration-warning.mjs | 34 +++++++++++++++++++ eslint.config.mjs | 9 +++++ src/app/layout.tsx | 12 ++++--- src/components/ClinicalDashboard.tsx | 13 +++---- src/components/DocumentViewer.tsx | 20 +++++++---- .../clinical-dashboard/answer-status.tsx | 12 +++---- .../clinical-dashboard/use-hide-on-scroll.ts | 9 +++-- .../use-sidebar-collapsed.ts | 11 +++--- .../differentials/diagnosis-map-panel.tsx | 11 +++--- src/components/pwa-lifecycle.tsx | 9 +++-- src/lib/client-store-factory.ts | 32 +++++++++++++++++ src/lib/use-client-time.ts | 22 ++++++++++++ tests/ui-hydration.spec.ts | 32 +++++++++++++++++ 13 files changed, 180 insertions(+), 46 deletions(-) create mode 100644 eslint-rules/restrict-suppress-hydration-warning.mjs create mode 100644 src/lib/client-store-factory.ts create mode 100644 src/lib/use-client-time.ts create mode 100644 tests/ui-hydration.spec.ts diff --git a/eslint-rules/restrict-suppress-hydration-warning.mjs b/eslint-rules/restrict-suppress-hydration-warning.mjs new file mode 100644 index 000000000..d3aa0c1f5 --- /dev/null +++ b/eslint-rules/restrict-suppress-hydration-warning.mjs @@ -0,0 +1,34 @@ +/** + * @type {import('eslint').Rule.RuleModule} + */ +export default { + meta: { + type: "problem", + docs: { + description: "Restrict suppressHydrationWarning to and tags only", + category: "Possible Errors", + recommended: true, + }, + schema: [], + }, + create(context) { + return { + JSXAttribute(node) { + if (node.name.name === "suppressHydrationWarning") { + const parentElement = node.parent; // JSXOpeningElement + if (parentElement && parentElement.name) { + const tagName = parentElement.name.name; + // The audit explicitly requested banning it on elements other than html and body. + // We also allow script since it's required for nonce mismatch bypass in layout.tsx. + if (tagName !== "html" && tagName !== "body" && tagName !== "script") { + context.report({ + node, + message: "suppressHydrationWarning is only allowed on , , and