runScripts() — astro Function Reference

Architecture documentation for the runScripts() function in router.ts from the astro codebase.

Function typescript CoreAstro RenderingEngine called by 1

Entity Profile

CoreAstro→ RenderingEngine→ runScripts() — astro Function Reference

Dependency Diagram

graph TD
  fa3e9103_6d44_552d_0306_d692069ae5ed["runScripts()"]
  2b5c33e2_176e_e839_f05f_7f10493f4f74["router.ts"]
  fa3e9103_6d44_552d_0306_d692069ae5ed -->|defined in| 2b5c33e2_176e_e839_f05f_7f10493f4f74
  6b23b6bb_d4a4_83cb_3896_2e31c0316793["transition()"]
  6b23b6bb_d4a4_83cb_3896_2e31c0316793 -->|calls| fa3e9103_6d44_552d_0306_d692069ae5ed
  style fa3e9103_6d44_552d_0306_d692069ae5ed fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/astro/src/transitions/router.ts lines 132–170

function runScripts() {
	let wait = Promise.resolve();
	let needsWaitForInlineModuleScript = false;
	// The original code made the assumption that all inline scripts are directly executed when inserted into the DOM.
	// This is not true for inline module scripts, which are deferred but still executed in order.
	// inline module scripts can not be awaited for with onload.
	// Thus to be able to wait for the execution of all scripts, we make sure that the last inline module script
	// is always followed by an external module script
	for (const script of document.getElementsByTagName('script')) {
		script.dataset.astroExec === undefined &&
			script.getAttribute('type') === 'module' &&
			(needsWaitForInlineModuleScript = script.getAttribute('src') === null);
	}
	needsWaitForInlineModuleScript &&
		document.body.insertAdjacentHTML(
			'beforeend',
			`<script type="module" src="data:application/javascript,"/>`,
		);

	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;
		const newScript = document.createElement('script');
		newScript.innerHTML = script.innerHTML;
		for (const attr of script.attributes) {
			if (attr.name === 'src') {
				const p = new Promise((r) => {
					newScript.onload = newScript.onerror = r;
				});
				wait = wait.then(() => p as any);
			}
			newScript.setAttribute(attr.name, attr.value);
		}
		newScript.dataset.astroExec = '';
		script.replaceWith(newScript);
	}
	return wait;
}