Ensure router only targets scripts for execution (#12177)

* Ensure router only targets scripts for execution

* Add a test

* Move the test up to the file that's testing

* remove extra prop

* just see if tests pass

* use local file

* smaller file

* use getElementsByTagName again

Author: matthewp

.changeset/nervous-peaches-sort.md

@@ -0,0 +1,7 @@
+---
+'astro': patch
+---
+
+Ensure we target scripts for execution in the router
+
+Using `document.scripts` is unsafe because if the application has a `name="scripts"` this will shadow the built-in `document.scripts`. Fix is to use `getElementsByTagName` to ensure we're only grabbing real scripts.

packages/astro/e2e/fixtures/view-transitions/src/assets/astro-build.mp4

@@ -1,3 +1,6 @@
-<video controls="" autoplay="" name="media" transition:persist transition:name="video" autoplay>
-	<source src="https://ia804502.us.archive.org/33/items/GoldenGa1939_3/GoldenGa1939_3_512kb.mp4" type="video/mp4">
+---
+import vidUrl from '../assets/astro-build.mp4';
+---
+<video controls="" autoplay="" transition:persist transition:name="video" autoplay>
+	<source src={vidUrl} type="video/mp4">
 </video>

packages/astro/e2e/fixtures/view-transitions/src/components/Video.astro

@@ -20,4 +20,7 @@ import Layout from '../components/Layout.astro';
 	</custom-a>
 
 	<div id="test">test content</div>
+
+	<!-- This ensures we're correctly grabbing just scripts for execution -->
+	<div name="scripts"></div>
 </Layout>

packages/astro/e2e/fixtures/view-transitions/src/pages/one.astro

@@ -134,7 +134,7 @@ export function getFallback(): Fallback {
 
 function runScripts() {
 	let wait = Promise.resolve();
-	for (const script of Array.from(document.scripts)) {
+	for (const script of document.getElementsByTagName('script')) {
 		if (script.dataset.astroExec === '') continue;
 		const type = script.getAttribute('type');
 		if (type && type !== 'module' && type !== 'text/javascript') continue;
@@ -643,7 +643,7 @@ if (inBrowser) {
 			);
 		}
 	}
-	for (const script of document.scripts) {
+	for (const script of document.getElementsByTagName('script')) {
 		script.dataset.astroExec = '';
 	}
 }