Skip to content

Escape bootstrapScriptContent for javascript embedding into HTML - #24385

Merged
gnoff merged 5 commits into
react:mainfrom
gnoff:fizz-escape-script
Apr 16, 2022
Merged

Escape bootstrapScriptContent for javascript embedding into HTML#24385
gnoff merged 5 commits into
react:mainfrom
gnoff:fizz-escape-script

Conversation

@gnoff

Copy link
Copy Markdown
Collaborator

The previous escape was for Text into HTML and breaks script contents. The new escaping ensures that the script contents cannot prematurely close the host script tag by escaping script open and close string sequences using a unicode escape substitution.

closes: #23063

@sizebot

sizebot commented Apr 15, 2022

Copy link
Copy Markdown

Comparing: 726ba80...b8e4253

Critical size changes

Includes critical production bundles, as well as any change greater than 2%:

Name+/-BaseCurrent+/- gzipBase gzipCurrent gzip
oss-stable/react-dom/cjs/react-dom.production.min.js=131.43 kB131.43 kB=42.06 kB42.05 kB
oss-experimental/react-dom/cjs/react-dom.production.min.js=136.70 kB136.70 kB=43.64 kB43.64 kB
facebook-www/ReactDOM-prod.classic.js=435.12 kB435.12 kB=79.88 kB79.88 kB
facebook-www/ReactDOM-prod.modern.js=420.12 kB420.12 kB=77.51 kB77.51 kB
facebook-www/ReactDOMForked-prod.classic.js=435.12 kB435.12 kB=79.88 kB79.88 kB

Significant size changes

Includes any change greater than 0.2%:

Expand to show
Name+/-BaseCurrent+/- gzipBase gzipCurrent gzip
oss-stable-semver/react-dom/umd/react-dom-server.browser.production.min.js+0.32%33.65 kB33.76 kB+0.50%11.57 kB11.62 kB
oss-stable/react-dom/umd/react-dom-server.browser.production.min.js+0.32%33.65 kB33.76 kB+0.50%11.57 kB11.62 kB
oss-stable-semver/react-dom/cjs/react-dom-server.browser.production.min.js+0.32%33.52 kB33.63 kB+0.52%11.44 kB11.50 kB
oss-stable/react-dom/cjs/react-dom-server.browser.production.min.js+0.32%33.52 kB33.63 kB+0.52%11.44 kB11.50 kB
oss-experimental/react-dom/umd/react-dom-server.browser.production.min.js+0.31%34.05 kB34.16 kB+0.53%11.70 kB11.76 kB
oss-experimental/react-dom/cjs/react-dom-server.browser.production.min.js+0.31%33.92 kB34.03 kB+0.49%11.58 kB11.63 kB
oss-stable-semver/react-dom/cjs/react-dom-server.node.production.min.js+0.29%36.79 kB36.90 kB+0.42%12.49 kB12.54 kB
oss-stable/react-dom/cjs/react-dom-server.node.production.min.js+0.29%36.79 kB36.90 kB+0.42%12.49 kB12.54 kB
oss-experimental/react-dom/cjs/react-dom-server.node.production.min.js+0.28%37.25 kB37.35 kB+0.43%12.66 kB12.71 kB
facebook-www/ReactDOMServerStreaming-prod.modern.js+0.24%77.43 kB77.61 kB+0.55%16.42 kB16.51 kB

Generated by 🚫 dangerJS against b8e4253

@gnoff
gnoff requested a review from sebmarkbageApril 15, 2022 18:41
Comment threadpackages/react-dom/src/server/escapeScriptForBrowser.js Outdated

@sebmarkbagesebmarkbage left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some nits but the essence looks good.

Comment threadpackages/react-dom/src/server/escapeScriptForBrowser.js Outdated

const scriptRegex = /(<\/|<)(s)(cript)/gi;
const scriptReplacer = (match, prefix, s, suffix) =>
`${prefix}${substitutions[s]}${suffix}`;

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's make this an inline condition instead of going through a whole hidden class check and fake-map look up.

@sebmarkbagesebmarkbageApr 16, 2022

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I meant s === 's' ? '\\u0073' : '\\u0053'

Copy link
Copy Markdown
CollaboratorAuthor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍

Comment threadpackages/react-dom/src/__tests__/escapeScriptForBrowser-test.js Outdated
Comment threadpackages/react-dom/src/__tests__/escapeScriptForBrowser-test.js Outdated
@gnoff
gnoffforce-pushed the fizz-escape-script branch from 5a3e000 to 7dd5cc7CompareApril 15, 2022 22:20
@gnoff
gnoff requested a review from sebmarkbageApril 15, 2022 22:21
The previous escape was for Text into HTML and breaks script contents. The new escaping ensures that the script contents cannot prematurely close the host script tag by escaping script open and close string sequences using a unicode escape substitution.
@gnoff
gnoffforce-pushed the fizz-escape-script branch from 7dd5cc7 to 11c06bfCompareApril 15, 2022 22:23
the escaping of this function does is tailored to the specific use case of how bootstrapScriptContent is currently set up and having it be a module suggests it is meant for a more general than it has been considered for.
Additionally the tests were redone to focus on practical implications for what is and is not escaped
@gnoff
gnoffforce-pushed the fizz-escape-script branch from 11c06bf to 52786bfCompareApril 15, 2022 22:28
@gnoff
gnoff merged commit d40dc73 into react:mainApr 16, 2022
@gnoff
gnoff deleted the fizz-escape-script branch April 16, 2022 17:47
const scriptReplacer = (match, prefix, s, suffix) =>
`${prefix}${s === 's' ? '\\u0073' : '\\u0053'}${suffix}`;

function escapeBootstrapScriptContent(scriptText) {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Maybe a leave a comment with the rationale and clarifying that this only works if the whole content is encoded and if it's an actual JS script tag, and doesn't work for attributes or CSS.

@sebmarkbagesebmarkbage left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

lgtm

This was referenced Nov 8, 2024
mrizwanashiq pushed a commit to mrizwanashiq/react that referenced this pull request Jun 25, 2026
…ct#24385)
The previous escape was for Text into HTML and breaks script contents. The new escaping ensures that the script contents cannot prematurely close the host script tag by escaping script open and close string sequences using a unicode escape substitution.
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

React 18: bootstrapScriptContent escapes HTML so quotes can’t be used

4 participants

@gnoff@sizebot@sebmarkbage@facebook-github-bot