Skip to content

website: warn when JS is disabled that the console won't open - #32

Merged
okcodes merged 2 commits into
mainfrom
website-noscript-warning
Sep 6, 2026
Merged

okcodes merged 2 commits into
mainfrom
website-noscript-warning

Conversation

@okcodes

@okcodes okcodes commented Sep 6, 2026 •

Copy link
Copy Markdown
Contributor

Summary

  • Adds a <noscript> banner above the nav that tells visitors with JS disabled the live console demo won't open (the rest of the page still works, per the prerendering in website: prerender to static HTML for no-JS crawlers/agents #31).
  • Styled to match the existing design language: dark background, amber warning accent (distinct from the site's cyan brand color, so it reads as a notice), centered text, same max-w-6xl content width as the nav.
  • Lives in index.html, outside the React tree, on purpose — a <noscript> wrapping JSX children in a hydrated React app is unreliable (React's hydration reconciliation ends up creating the children as real DOM nodes even with JS enabled, since React doesn't respect the HTML parser's noscript-content-as-text behavior). Keeping it as plain HTML sidesteps that entirely: React never touches it, and the browser's native noscript handling does the hiding.

Test plan

  • Built the site and confirmed the amber Tailwind utility classes (bg-amber-400, border-amber-400, text-amber-200) made it into the compiled CSS — confirms Tailwind's content scan covers index.html.
  • Loaded the built site in a browser with JS enabled — banner is correctly hidden, no console errors.
  • pnpm run typecheck and pnpm run lint (oxlint, repo-wide) pass with no new warnings.
  • Reviewer: disable JavaScript in a browser and load the deployed/preview site to see the banner render.

🤖 Generated with Claude Code

okcodes and others added 2 commits September 6, 2026 06:56
Adds a <noscript> banner above the nav, styled to match the site (dark
theme, amber warning accent). It lives in index.html outside the React
tree entirely, so it's immune to the React+noscript hydration bug where
reconciliation ends up rendering noscript children even with JS enabled.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
@okcodes
okcodes merged commit 08dc191 into main Sep 6, 2026
2 checks passed
@okcodes
okcodes deleted the website-noscript-warning branch September 6, 2026 13:38

This branch was previously deployed

1 inactive deployment
github-pages — 3f422d80 Deployed Sep 6, 2026 by okcodes via deploy-website #4
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant