[Float][Fizz] add crossOrigin support for preloading bootstrap scripts and bootstrap modules (#26942)

gnoff · web-flow · commit a7bf5ba614c6 · 2023-06-13T13:59:45.000-07:00
The recently merged support for crossorigin in bootstrap scripts did not implement the functionality for preloading. This adds it see #26844
diff --git a/packages/react-dom-bindings/src/server/ReactFizzConfigDOM.js b/packages/react-dom-bindings/src/server/ReactFizzConfigDOM.js
@@ -281,7 +281,7 @@ export function createResponseState(
           ? 'use-credentials'
           : '';
 
-      preloadBootstrapScript(resources, src, nonce, integrity);
+      preloadBootstrapScript(resources, src, nonce, integrity, crossOrigin);
 
       bootstrapChunks.push(
         startScriptSrc,
@@ -322,7 +322,7 @@ export function createResponseState(
           ? 'use-credentials'
           : '';
 
-      preloadBootstrapModule(resources, src, nonce, integrity);
+      preloadBootstrapModule(resources, src, nonce, integrity, crossOrigin);
 
       bootstrapChunks.push(
         startModuleSrc,
@@ -5425,6 +5425,7 @@ function preloadBootstrapScript(
   src: string,
   nonce: ?string,
   integrity: ?string,
+  crossOrigin: ?string,
 ): void {
   const key = getResourceKey('script', src);
   if (__DEV__) {
@@ -5444,6 +5445,7 @@ function preloadBootstrapScript(
     as: 'script',
     nonce,
     integrity,
+    crossOrigin,
   };
   const resource: PreloadResource = {
     type: 'preload',
@@ -5465,6 +5467,7 @@ function preloadBootstrapModule(
   src: string,
   nonce: ?string,
   integrity: ?string,
+  crossOrigin: ?string,
 ): void {
   const key = getResourceKey('script', src);
   if (__DEV__) {
@@ -5483,6 +5486,7 @@ function preloadBootstrapModule(
     href: src,
     nonce,
     integrity,
+    crossOrigin,
   };
   const resource: PreloadResource = {
     type: 'preload',
diff --git a/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js b/packages/react-dom/src/__tests__/ReactDOMFizzServer-test.js
@@ -3865,7 +3865,19 @@ describe('ReactDOMFizzServer', () => {
 
     expect(getVisibleChildren(document)).toEqual(
       <html>
-        <head />
+        <head>
+          <link rel="preload" href="foo" as="script" />
+          <link rel="preload" href="bar" as="script" />
+          <link rel="preload" href="baz" as="script" crossorigin="" />
+          <link rel="preload" href="qux" as="script" crossorigin="" />
+          <link rel="modulepreload" href="quux" />
+          <link rel="modulepreload" href="corge" />
+          <link
+            rel="modulepreload"
+            href="grault"
+            crossorigin="use-credentials"
+          />
+        </head>
         <body>
           <div>hello world</div>
         </body>
