Wood page: absolute asset paths so the clean URL /showcase/wood is styled

public/showcase/wood/index.html

@@ -8,8 +8,8 @@
 <link rel="preconnect" href="https://fonts.googleapis.com">
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
 <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,700;9..144,800&family=Hanken+Grotesk:wght@400;500;700&display=swap">
-<!-- wood.css is real CSS built from static.dssl (textures baked in), so the page is styled before any script runs -->
-<link rel="stylesheet" href="wood.css">
+<!-- absolute paths, so the page works at /showcase/wood and /showcase/wood/index.html alike. wood.css is real CSS built from static.dssl (textures baked in), so the page is styled before any script runs -->
+<link rel="stylesheet" href="/showcase/wood/wood.css">
 </head>
 <body>
 <a class="skip" href="#main">Skip to the guide</a>
@@ -172,7 +172,7 @@
 })();
 </script>
 <script type="module" src="/dssl/boot.js"></script>
-<link rel="stylesheet/dssl" href="tokens.dssl">
-<link rel="stylesheet/dssl" href="live.dssl">
+<link rel="stylesheet/dssl" href="/showcase/wood/tokens.dssl">
+<link rel="stylesheet/dssl" href="/showcase/wood/live.dssl">
 </body>
 </html>

scripts/test-v0100.mjs

@@ -296,6 +296,7 @@ await withBrowser(async ({ open, errors }) => {
 await withBrowser(async ({ open }) => {
   const p = await open('/showcase/wood/index.html');
   await p.waitForFunction('window.DSSL'); await p.waitForTimeout(800);
+  ok('every file the page links to is an absolute path, so the clean URL /showcase/wood works too', !/(href|src)="(?!https?:|\/|#|data:)[^"]+\.(css|dssl|js)"/.test(readFileSync(new URL('../public/showcase/wood/index.html', import.meta.url), 'utf8')));
   ok('and none on a 390px phone', !(await p.evaluate(() => document.documentElement.scrollWidth > innerWidth)));
 }, { viewport: { width: 390, height: 844 } });