app/lib/enhance-loader.mjs

Functions

None: it only declares types or values.

Imports

It imports app/lib/enhance-url.mjs. Imported by app/root.tsx, workers/csp.mjs.

Source

1/*
2 * The one inline script a public page runs. <Enhance module> renders an inert
3 * `<template data-enhance="/assets/x-HASH.js">` marker; this script, rendered once at the end of
4 * <body> by app/root.tsx, turns every marker into a module script. The policy allows it by its
5 * sha256 (workers/csp.mjs hashes THIS constant), and 'self' allows the same-origin bundles it
6 * inserts, so a cached public page carries no nonce at all.
7 *
8 * Firefox and Safari do not match hashes against external scripts, which is why the bundles are
9 * inserted by a hashed inline script instead of carrying hashes themselves.
10 *
11 * THE TEXT IS THE HASH: any edit here changes the policy, and the gates recompute it from this
12 * string. It must never contain `<`, so React can render it raw and the bytes stay identical.
13 *
14 * - Deduplicated by resolved URL, in document order, like the parser-inserted tags it replaces.
15 * - `async = false` keeps that order: a dynamic module script is otherwise run as it arrives.
16 * - Only the rule in app/lib/enhance-url.mjs, which the palette trigger applies too: resolved
17 *   against the page, same origin, and a normalized path under `/assets/`, so a marker
18 *   smuggled into a page cannot borrow the trust and `..` cannot climb out.
19 *   test/enhance-loader.test.mjs runs this text and the palette's rule over the same cases.
20 * - A refused marker is skipped, and one error naming every refusal is thrown after the loop, so
21 *   later bundles still load and the refusal still reaches the console.
22 * - Document methods are taken from `Document.prototype`, because a named element such as
23 *   `<img name="querySelectorAll">` shadows the ones on `document` itself.
24 */
25
26import { ENHANCE_URL_PREFIX } from "./enhance-url.mjs";
27
28export { ENHANCE_URL_PREFIX };
29
30export const ENHANCE_LOADER =
31  '{const d=document,P=Document.prototype,h=P.querySelector.call(d,"head"),seen=new Set,bad=[];' +
32  'for(const t of P.querySelectorAll.call(d,"template[data-enhance]")){' +
33  'const r=t.getAttribute("data-enhance");let u;try{u=new URL(r,location.href)}catch{}' +
34  `if(!u||u.origin!==location.origin||!u.pathname.startsWith("${ENHANCE_URL_PREFIX}")){bad.push(r);continue}` +
35  "if(seen.has(u.href))continue;seen.add(u.href);" +
36  'const s=P.createElement.call(d,"script");s.type="module";s.async=false;s.src=u.href;h.appendChild(s)}' +
37  'if(bad.length)throw new Error("enhance: refused "+bad.join(", "))}';