Skip to content

Commit

Permalink
fix: add nonce if __webpack_nonce__ has been defined
Browse files Browse the repository at this point in the history
  • Loading branch information
PepeBotella25 authored Feb 27, 2024
1 parent 878822b commit c7f0aee
Show file tree
Hide file tree
Showing 5 changed files with 118 additions and 0 deletions.
5 changes: 5 additions & 0 deletions src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -899,6 +899,11 @@ class MiniCssExtractPlugin {
this.runtimeOptions.linkType
)};`
: "",
`if (${RuntimeGlobals.scriptNonce}) {`,
Template.indent(
`linkTag.nonce = ${RuntimeGlobals.scriptNonce};`
),
"}",
`var onLinkComplete = ${runtimeTemplate.basicFunction("event", [
"// avoid mem leaks.",
"linkTag.onerror = linkTag.onload = null;",
Expand Down
37 changes: 37 additions & 0 deletions test/__snapshots__/nonce.test.js.snap
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`nonce should work when __webpack_nonce__ is defined: DOM 1`] = `
"<!DOCTYPE html><html><head>
<title>style-loader test</title>
<style id=\\"existing-style\\">.existing { color: yellow }</style>
<link rel=\\"stylesheet\\" type=\\"text/css\\" nonce=\\"THE_NONCE\\" href=\\"simple.css\\"><script charset=\\"utf-8\\" nonce=\\"THE_NONCE\\" src=\\"simple.bundle.js\\"></script></head>
<body>
<h1>Body</h1>
<div class=\\"target\\"></div>
<iframe class=\\"iframeTarget\\"></iframe>
</body></html>"
`;
exports[`nonce should work when __webpack_nonce__ is defined: errors 1`] = `Array []`;
exports[`nonce should work when __webpack_nonce__ is defined: warnings 1`] = `Array []`;
exports[`nonce should work when __webpack_nonce__ is not defined: DOM 1`] = `
"<!DOCTYPE html><html><head>
<title>style-loader test</title>
<style id=\\"existing-style\\">.existing { color: yellow }</style>
<link rel=\\"stylesheet\\" type=\\"text/css\\" href=\\"simple.css\\"><script charset=\\"utf-8\\" src=\\"simple.bundle.js\\"></script></head>
<body>
<h1>Body</h1>
<div class=\\"target\\"></div>
<iframe class=\\"iframeTarget\\"></iframe>
</body></html>"
`;
exports[`nonce should work when __webpack_nonce__ is not defined: errors 1`] = `Array []`;
exports[`nonce should work when __webpack_nonce__ is not defined: warnings 1`] = `Array []`;
2 changes: 2 additions & 0 deletions test/fixtures/no-nonce.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
/* eslint-disable-next-line no-unused-expressions */
import(/* webpackChunkName: "simple" */ './simple.css');
4 changes: 4 additions & 0 deletions test/fixtures/nonce.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
__webpack_nonce__ = 'THE_NONCE';

/* eslint-disable-next-line no-unused-expressions */
import(/* webpackChunkName: "simple" */ './simple.css');
70 changes: 70 additions & 0 deletions test/nonce.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,70 @@
/* eslint-env browser */
import path from "path";

import MiniCssExtractPlugin from "../src";

import {
compile,
getCompiler,
getErrors,
getWarnings,
runInJsDom,
} from "./helpers/index";

describe("nonce", () => {
it(`should work when __webpack_nonce__ is not defined`, async () => {
const compiler = getCompiler(
"no-nonce.js",
{},
{
mode: "none",
output: {
publicPath: "",
path: path.resolve(__dirname, "../outputs"),
filename: "[name].bundle.js",
},
plugins: [
new MiniCssExtractPlugin({
filename: "[name].css",
}),
],
}
);
const stats = await compile(compiler);

runInJsDom("main.bundle.js", compiler, stats, (dom) => {
expect(dom.serialize()).toMatchSnapshot("DOM");
});

expect(getWarnings(stats)).toMatchSnapshot("warnings");
expect(getErrors(stats)).toMatchSnapshot("errors");
});

it(`should work when __webpack_nonce__ is defined`, async () => {
const compiler = getCompiler(
"nonce.js",
{},
{
mode: "none",
output: {
publicPath: "",
path: path.resolve(__dirname, "../outputs"),
filename: "[name].bundle.js",
},
plugins: [
new MiniCssExtractPlugin({
filename: "[name].css",
}),
],
}
);
const stats = await compile(compiler);

runInJsDom("main.bundle.js", compiler, stats, (dom) => {
expect(dom.serialize()).toMatchSnapshot("DOM");
});

expect(getWarnings(stats)).toMatchSnapshot("warnings");
expect(getErrors(stats)).toMatchSnapshot("errors");
});
});

0 comments on commit c7f0aee

Please sign in to comment.