diff --git a/lib/web/JsonpMainTemplatePlugin.js b/lib/web/JsonpMainTemplatePlugin.js index e843a270a44..018d2147b09 100644 --- a/lib/web/JsonpMainTemplatePlugin.js +++ b/lib/web/JsonpMainTemplatePlugin.js @@ -154,15 +154,21 @@ class JsonpMainTemplatePlugin { : "", "script.charset = 'utf-8';", `script.timeout = ${chunkLoadTimeout / 1000};`, - crossOriginLoading - ? `script.crossOrigin = ${JSON.stringify(crossOriginLoading)};` - : "", `if (${mainTemplate.requireFn}.nc) {`, Template.indent( `script.setAttribute("nonce", ${mainTemplate.requireFn}.nc);` ), "}", "script.src = jsonpScriptSrc(chunkId);", + crossOriginLoading + ? Template.asString([ + "if (script.src.indexOf(window.location.origin + '/') !== 0) {", + Template.indent( + `script.crossOrigin = ${JSON.stringify(crossOriginLoading)};` + ), + "}" + ]) + : "", "onScriptComplete = function (event) {", Template.indent([ "// avoid mem leaks in IE.", @@ -208,9 +214,6 @@ class JsonpMainTemplatePlugin { ? `link.type = ${JSON.stringify(jsonpScriptType)};` : "", "link.charset = 'utf-8';", - crossOriginLoading - ? `link.crossOrigin = ${JSON.stringify(crossOriginLoading)};` - : "", `if (${mainTemplate.requireFn}.nc) {`, Template.indent( `link.setAttribute("nonce", ${mainTemplate.requireFn}.nc);` @@ -218,7 +221,16 @@ class JsonpMainTemplatePlugin { "}", 'link.rel = "preload";', 'link.as = "script";', - "link.href = jsonpScriptSrc(chunkId);" + "link.href = jsonpScriptSrc(chunkId);", + crossOriginLoading + ? Template.asString([ + "if (link.href.indexOf(window.location.origin + '/') !== 0) {", + Template.indent( + `link.crossOrigin = ${JSON.stringify(crossOriginLoading)};` + ), + "}" + ]) + : "" ]); } ); diff --git a/test/ConfigTestCases.test.js b/test/ConfigTestCases.test.js index 4f3808341bd..4923509f2dd 100644 --- a/test/ConfigTestCases.test.js +++ b/test/ConfigTestCases.test.js @@ -178,7 +178,14 @@ describe("ConfigTestCases", () => { expect: expect, setTimeout: setTimeout, clearTimeout: clearTimeout, - document: new FakeDocument() + document: new FakeDocument(), + location: { + href: "https://test.cases/path/index.html", + origin: "https://test.cases", + toString() { + return "https://test.cases/path/index.html"; + } + } }; function _require(currentDirectory, module) { diff --git a/test/__snapshots__/StatsTestCases.test.js.snap b/test/__snapshots__/StatsTestCases.test.js.snap index cfbd4c713f2..734d96e63c9 100644 --- a/test/__snapshots__/StatsTestCases.test.js.snap +++ b/test/__snapshots__/StatsTestCases.test.js.snap @@ -1767,7 +1767,7 @@ exports[`StatsTestCases should print correct stats for preload 1`] = ` normal.js 130 bytes 1 [emitted] normal preloaded2.js 127 bytes 2 [emitted] preloaded2 preloaded3.js 130 bytes 3 [emitted] preloaded3 - main.js 9.87 KiB 4 [emitted] main + main.js 9.86 KiB 4 [emitted] main inner.js 136 bytes 5 [emitted] inner inner2.js 201 bytes 6 [emitted] inner2 Entrypoint main = main.js (preload: preloaded2.js preloaded.js preloaded3.js) diff --git a/test/configCases/crossorigin/set-crossorigin/empty.js b/test/configCases/crossorigin/set-crossorigin/empty.js new file mode 100644 index 00000000000..e69de29bb2d diff --git a/test/configCases/crossorigin/set-crossorigin/index.js b/test/configCases/crossorigin/set-crossorigin/index.js new file mode 100644 index 00000000000..6330978d157 --- /dev/null +++ b/test/configCases/crossorigin/set-crossorigin/index.js @@ -0,0 +1,67 @@ +it("should load script without crossorigin attribute (default)", function() { + const promise = import("./empty?a" /* webpackChunkName: "crossorigin-default" */); + + var script = document.head._children.pop(); + __non_webpack_require__("./crossorigin-default.web.js"); + expect(script.src).toBe("https://test.cases/path/crossorigin-default.web.js"); + expect(script.crossOrigin).toBe(undefined); + + return promise; +}); + +it("should load script without crossorigin attribute (relative)", function() { + var originalValue = __webpack_public_path__; + __webpack_public_path__ = "../"; + const promise = import("./empty?b" /* webpackChunkName: "crossorigin-relative" */); + __webpack_public_path__ = originalValue; + + var script = document.head._children.pop(); + __non_webpack_require__("./crossorigin-relative.web.js"); + expect(script.src).toBe("https://test.cases/crossorigin-relative.web.js"); + expect(script.crossOrigin).toBe(undefined); + + return promise; +}); + +it("should load script without crossorigin attribute (server relative)", function() { + var originalValue = __webpack_public_path__; + __webpack_public_path__ = "/server/"; + const promise = import("./empty?c" /* webpackChunkName: "crossorigin-server-relative" */); + __webpack_public_path__ = originalValue; + + var script = document.head._children.pop(); + __non_webpack_require__("./crossorigin-server-relative.web.js"); + expect(script.src).toBe("https://test.cases/server/crossorigin-server-relative.web.js"); + expect(script.crossOrigin).toBe(undefined); + + return promise; +}); + +it("should load script without crossorigin attribute (same origin)", function() { + var originalValue = __webpack_public_path__; + __webpack_public_path__ = "https://test.cases/"; + const promise = import("./empty?d" /* webpackChunkName: "crossorigin-same-origin" */); + __webpack_public_path__ = originalValue; + + var script = document.head._children.pop(); + __non_webpack_require__("./crossorigin-same-origin.web.js"); + expect(script.src).toBe("https://test.cases/crossorigin-same-origin.web.js"); + expect(script.crossOrigin).toBe(undefined); + + return promise; +}); + +it("should load script with crossorigin attribute anonymous (different origin)", function() { + var originalValue = __webpack_public_path__; + __webpack_public_path__ = "https://example.com/"; + const promise = import("./empty?e" /* webpackChunkName: "crossorigin-different-origin" */); + __webpack_public_path__ = originalValue; + + + var script = document.head._children.pop(); + __non_webpack_require__("./crossorigin-different-origin.web.js"); + expect(script.src).toBe("https://example.com/crossorigin-different-origin.web.js"); + expect(script.crossOrigin).toBe("anonymous"); + + return promise; +}); diff --git a/test/configCases/crossorigin/set-crossorigin/webpack.config.js b/test/configCases/crossorigin/set-crossorigin/webpack.config.js new file mode 100644 index 00000000000..68eeb96a523 --- /dev/null +++ b/test/configCases/crossorigin/set-crossorigin/webpack.config.js @@ -0,0 +1,13 @@ +module.exports = { + target: "web", + output: { + chunkFilename: "[name].web.js", + crossOriginLoading: "anonymous" + }, + performance: { + hints: false + }, + optimization: { + minimize: false + } +}; diff --git a/test/configCases/split-chunks/runtime-chunk/a.js b/test/configCases/split-chunks/runtime-chunk/a.js index e135684891b..fcae9162325 100644 --- a/test/configCases/split-chunks/runtime-chunk/a.js +++ b/test/configCases/split-chunks/runtime-chunk/a.js @@ -2,7 +2,7 @@ it("should be able to load the split chunk on demand", () => { const promise = import(/* webpackChunkName: "shared" */ "./shared"); const script = document.head._children[0]; - expect(script.src).toBe("dep~b~shared.js"); + expect(script.src).toBe("https://test.cases/path/dep~b~shared.js"); __non_webpack_require__("./dep~b~shared.js"); diff --git a/test/configCases/web/prefetch-preload/index.js b/test/configCases/web/prefetch-preload/index.js index 2d393f55a6b..dec98a7ccf4 100644 --- a/test/configCases/web/prefetch-preload/index.js +++ b/test/configCases/web/prefetch-preload/index.js @@ -10,11 +10,11 @@ beforeEach(() => { afterEach(() => { __webpack_nonce__ = oldNonce; __webpack_public_path__ = oldPublicPath; -}) +}); it("should prefetch and preload child chunks on chunk load", () => { __webpack_nonce__ = "nonce"; - __webpack_public_path__ = "/public/path/"; + __webpack_public_path__ = "https://example.com/public/path/"; let link, script; diff --git a/test/helpers/FakeDocument.js b/test/helpers/FakeDocument.js index 0c9d80de06f..680c5157640 100644 --- a/test/helpers/FakeDocument.js +++ b/test/helpers/FakeDocument.js @@ -20,6 +20,8 @@ class FakeElement { this._type = type; this._children = []; this._attributes = Object.create(null); + this._src = undefined; + this._href = undefined; } appendChild(node) { @@ -33,4 +35,40 @@ class FakeElement { getAttribute(name) { return this._attributes[name]; } + + _toRealUrl(value) { + if (/^\//.test(value)) { + return `https://test.cases${value}`; + } else if (/^\.\.\//.test(value)) { + return `https://test.cases${value.substr(2)}`; + } else if (/^\.\//.test(value)) { + return `https://test.cases/path${value.substr(1)}`; + } else if (/^\w+:\/\//.test(value)) { + return value; + } else if (/^\/\//.test(value)) { + return `https:${value}`; + } else { + return `https://test.cases/path/${value}`; + } + } + + set src(value) { + if (this._type === "script") { + this._src = this._toRealUrl(value); + } + } + + get src() { + return this._src; + } + + set href(value) { + if (this._type === "link") { + this._href = this._toRealUrl(value); + } + } + + get href() { + return this._href; + } }