fix(playground): guard runner against markup break-out#1705
Open
caugner wants to merge 2 commits into
Open
Conversation
Contributor
|
b720866 was deployed to: https://fred-pr1705.review.mdn.allizom.net/ |
caugner
commented
Jul 17, 2026
caugner
force-pushed
the
1440-playground-detect-swallowed-script
branch
from
July 17, 2026 14:25
24b04be to
9623022
Compare
caugner
changed the title
An unclosed or malformed tag in the HTML input (e.g. `<o`) is parsed such that the following `<script>` element becomes attributes of the open tag, leaving the user's JavaScript source rendered as visible text instead of executing, with no indication of why. Add `id="mdn-play-js"` to the JS `<script>` and a post-rendering check in the runner document that verifies it parsed as an `HTMLScriptElement`. When it did not, emit a `console.warn` pointing the user at the malformed tag. The check queries `script#mdn-play-js` specifically, so user HTML reusing the id cannot trigger a false warning.
User CSS containing `</style` or user JS containing `</script` (for example inside a string) terminated the runner's `<style>` / `<script>` element early, corrupting the page and allowing arbitrary markup to be injected after it. Escape those sequences by inserting a backslash (`<\/style`, `<\/script`), which stops the HTML parser from ending the element while remaining equivalent inside CSS/JS strings, template literals, and regexes.
caugner
force-pushed
the
1440-playground-detect-swallowed-script
branch
from
July 17, 2026 14:49
9623022 to
4f7eb53
Compare
caugner
marked this pull request as ready for review
July 17, 2026 14:51
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
(⚠️ Mirrored to mdn/dex#435. ⚠️ )
Description
Harden the Playground runner content assembly (
vendor/yari/libs/play/index.js) against malformed input:idto the JS<script>and a post-render check that warns (viaconsole.warn) when it did not parse as anHTMLScriptElement. The check queriesscript#mdn-play-jsspecifically, so user HTML reusing the id cannot trigger a false warning.</style/</scriptin user CSS/JS (<\/style,<\/script) so they can no longer terminate the element early.Adds unit tests (
test/unit/play/runner.test.js) covering the escaping, case preservation, the swallow-detection marker, and the known<!--<script>limitation.Motivation
<ois parsed so the following<script>becomes attributes of the open tag, and the user's JS renders as visible text instead of running, with no hint why (When<ocharacters in Playground HTML input causes entire JavaScript input to show up in HTML preview #1440).</style/</script(e.g. inside a string) terminated the element early, corrupting the page and injecting stray markup.Additional details
The escaping is behavior-preserving (
\/resolves to/in CSS/JS strings, templates, and regexes; already-escaped sequences are untouched).This file is mirrored in
mdn/dex(cloud-function/src/internal/play/index.js), which serves the runner in deployed/review environments, so the fix is only observable outside local dev once mdn/dex#435 lands.Related issues and pull requests
Fixes #1440.