fix: <Script> with beforeInteractive strategy ignores additional attributes in App Router

packages/next/src/client/script.tsx

@@ -334,7 +334,7 @@ function Script(props: ScriptProps): JSX.Element | null {
             dangerouslySetInnerHTML={{
               __html: `(self.__next_s=self.__next_s||[]).push(${JSON.stringify([
                 0,
-                { ...restProps },
+                { ...restProps, id },
               ])})`,
             }}
           />
@@ -353,6 +353,7 @@ function Script(props: ScriptProps): JSX.Element | null {
             dangerouslySetInnerHTML={{
               __html: `(self.__next_s=self.__next_s||[]).push(${JSON.stringify([
                 src,
+                { ...restProps, id },
               ])})`,
             }}
           />

test/e2e/app-dir/app/app/script/page.js

@@ -33,6 +33,22 @@ export default function Page() {
         `,
         }}
       />
+      <Script
+        strategy="beforeInteractive"
+        src="/noop-test.js"
+        id="script-with-src-noop-test"
+        data-extra-prop="script-with-src"
+      />
+      <Script
+        strategy="beforeInteractive"
+        dangerouslySetInnerHTML={{
+          __html: `
+        console.log('noop-test-dangerouslySetInnerHTML')
+        `,
+        }}
+        id="script-without-src-noop-test-dangerouslySetInnerHTML"
+        data-extra-prop="script-without-src"
+      />
     </div>
   )
 }

test/e2e/app-dir/app/index.test.ts

@@ -1751,6 +1751,26 @@ createNextDescribe(
             return 'yes'
           }, 'yes')
         })
+
+        it('should pass on extra props for beforeInteractive scripts with a src prop', async () => {
+          const browser = await next.browser('/script')
+
+          const foundProps = await browser.eval(
+            `document.querySelector('#script-with-src-noop-test').getAttribute('data-extra-prop')`
+          )
+
+          expect(foundProps).toBe('script-with-src')
+        })
+
+        it('should pass on extra props for beforeInteractive scripts without a src prop', async () => {
+          const browser = await next.browser('/script')
+
+          const foundProps = await browser.eval(
+            `document.querySelector('#script-without-src-noop-test-dangerouslySetInnerHTML').getAttribute('data-extra-prop')`
+          )
+
+          expect(foundProps).toBe('script-without-src')
+        })
       }
 
       it('should insert preload tags for beforeInteractive and afterInteractive scripts', async () => {

test/e2e/app-dir/app/public/noop-test.js

@@ -0,0 +1 @@
+console.log('test-noop')