[nextjs] Fix nonce issues (#45794)

Janpot · web-flow · commit 841398466467 · 2025-04-03T10:22:47.000+02:00
diff --git a/packages/mui-material-nextjs/src/v13-pagesRouter/createCache.ts b/packages/mui-material-nextjs/src/v13-pagesRouter/createCache.ts
@@ -1,11 +1,11 @@
-import createCache from '@emotion/cache';
+import createCache, { Options } from '@emotion/cache';
 
 const isBrowser = typeof document !== 'undefined';
 
 // On the client side, Create a meta tag at the top of the <head> and set it as insertionPoint.
 // This assures that MUI styles are loaded first.
 // It allows developers to easily override MUI styles with other styling solutions, like CSS modules.
-export default function createEmotionCache() {
+export default function createEmotionCache(options?: Partial<Options>) {
   let insertionPoint;
 
   if (isBrowser) {
@@ -15,5 +15,5 @@ export default function createEmotionCache() {
     insertionPoint = emotionInsertionPoint ?? undefined;
   }
 
-  return createCache({ key: 'mui', insertionPoint });
+  return createCache({ key: 'mui', insertionPoint, ...options });
 }
diff --git a/packages/mui-material-nextjs/src/v13-pagesRouter/index.ts b/packages/mui-material-nextjs/src/v13-pagesRouter/index.ts
@@ -1,2 +1,3 @@
 export * from './pagesRouterV13Document';
 export * from './pagesRouterV13App';
+export { default as createEmotionCache } from './createCache';
diff --git a/packages/mui-material-nextjs/src/v13-pagesRouter/pagesRouterV13Document.tsx b/packages/mui-material-nextjs/src/v13-pagesRouter/pagesRouterV13Document.tsx
@@ -102,14 +102,17 @@ export async function documentGetInitialProps(
         const { styles } = extractCriticalToChunks(initialProps.html);
         return {
           ...initialProps,
-          emotionStyleTags: styles.map((style) => (
-            <style
-              data-emotion={`${style.key} ${style.ids.join(' ')}`}
-              key={style.key}
-              // eslint-disable-next-line react/no-danger
-              dangerouslySetInnerHTML={{ __html: style.css }}
-            />
-          )),
+          emotionStyleTags: styles.map((style) =>
+            style.css.trim() ? (
+              <style
+                data-emotion={`${style.key} ${style.ids.join(' ')}`}
+                key={style.key}
+                // eslint-disable-next-line react/no-danger
+                dangerouslySetInnerHTML={{ __html: style.css }}
+                nonce={cache.nonce}
+              />
+            ) : null,
+          ),
         };
       },
     },

Original file line number	Diff line number	Diff line change
`@@ -1,2 +1,3 @@`
`1`	`1`	`export * from './pagesRouterV13Document';`
`2`	`2`	`export * from './pagesRouterV13App';`
	`3`	`+export { default as createEmotionCache } from './createCache';`