Skip to content

Commit

Permalink
Merge pull request #308 from codegouvfr/no_script_when_only_light
Browse files Browse the repository at this point in the history
No script when only light
  • Loading branch information
garronej authored Sep 17, 2024
2 parents bb2e83e + 74a2e6a commit a9ecdd1
Show file tree
Hide file tree
Showing 2 changed files with 52 additions and 42 deletions.
44 changes: 24 additions & 20 deletions src/next-appdir/DsfrHead.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -94,26 +94,30 @@ export function DsfrHead(props: DsfrHeadProps) {
<link rel="shortcut icon" href={getAssetUrl(FaviconIco)} type="image/x-icon" />
</>
)}
<script
suppressHydrationWarning
nonce={nonce}
dangerouslySetInnerHTML={{
"__html": getScriptToRunAsap({
defaultColorScheme,
nonce,
trustedTypesPolicyName
})
}}
/>
{nonce !== undefined && (
<script
suppressHydrationWarning
key="nonce-setter"
nonce={nonce}
dangerouslySetInnerHTML={{
__html: `window.ssrNonce = "${nonce}";`
}}
/>
{defaultColorScheme !== "light" && (
<>
<script
suppressHydrationWarning
nonce={nonce}
dangerouslySetInnerHTML={{
"__html": getScriptToRunAsap({
defaultColorScheme,
nonce,
trustedTypesPolicyName
})
}}
/>
{nonce !== undefined && (
<script
suppressHydrationWarning
key="nonce-setter"
nonce={nonce}
dangerouslySetInnerHTML={{
__html: `window.ssrNonce = "${nonce}";`
}}
/>
)}
</>
)}
</>
);
Expand Down
50 changes: 28 additions & 22 deletions src/next-pagesdir.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -199,31 +199,37 @@ export function createNextDsfrIntegrationApi(
/>
</>
)}
{!isBrowser && ( //NOTE: On browser we handle this manually
{defaultColorScheme !== "light" && (
<>
<style id={rootColorSchemeStyleTagId}>{`:root { color-scheme: ${
isDark ? "dark" : "light"
}; }`}</style>
<meta
name="theme-color"
content={
fr.colors.getHex({ isDark }).decisions.background.default
.grey.default
}
/>
{!isBrowser && ( //NOTE: On browser we handle this manually
<>
<style
id={rootColorSchemeStyleTagId}
>{`:root { color-scheme: ${
isDark ? "dark" : "light"
}; }`}</style>
<meta
name="theme-color"
content={
fr.colors.getHex({ isDark }).decisions.background
.default.grey.default
}
/>
</>
)}
{isProduction && !isBrowser && (
<script
dangerouslySetInnerHTML={{
"__html": getScriptToRunAsap({
defaultColorScheme,
trustedTypesPolicyName,
"nonce": undefined
})
}}
/>
)}
</>
)}
{isProduction && !isBrowser && (
<script
dangerouslySetInnerHTML={{
"__html": getScriptToRunAsap({
defaultColorScheme,
trustedTypesPolicyName,
"nonce": undefined
})
}}
/>
)}
</Head>
{isBrowser ? (
<App {...(props as any)} />
Expand Down

0 comments on commit a9ecdd1

Please sign in to comment.