Skip to content

Commit 3963c0b

Browse files
authoredJul 20, 2021
fix: added the insert option when it is a module to addBuildDependency (#527)
1 parent 6e70da0 commit 3963c0b

File tree

3 files changed

+137
-0
lines changed

3 files changed

+137
-0
lines changed
 

‎src/utils.js

+2
Original file line numberDiff line numberDiff line change
@@ -132,6 +132,8 @@ function getImportInsertBySelectorCode(
132132
if (insertType === "module-path") {
133133
const modulePath = stringifyRequest(loaderContext, `${options.insert}`);
134134

135+
loaderContext.addBuildDependency(options.insert);
136+
135137
return esModule
136138
? `import insertFn from ${modulePath};`
137139
: `var insertFn = require(${modulePath});`;

‎test/__snapshots__/insert-option.test.js.snap

+114
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,119 @@
11
// Jest Snapshot v1, https://goo.gl/fbAQLP
22

3+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "lazySingletonStyleTag" and insert is object: DOM 1`] = `
4+
"<!DOCTYPE html><html><head><style>body {
5+
color: red;
6+
}
7+
h1 {
8+
color: blue;
9+
}
10+
</style>
11+
<title>style-loader test</title>
12+
<style id=\\"existing-style\\">.existing { color: yellow }</style>
13+
</head>
14+
<body>
15+
<h1>Body</h1>
16+
<div class=\\"target\\"></div>
17+
<iframe class=\\"iframeTarget\\"></iframe>
18+
19+
20+
</body></html>"
21+
`;
22+
23+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "lazySingletonStyleTag" and insert is object: errors 1`] = `Array []`;
24+
25+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "lazySingletonStyleTag" and insert is object: warnings 1`] = `Array []`;
26+
27+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "lazyStyleTag" and insert is object: DOM 1`] = `
28+
"<!DOCTYPE html><html><head><style>body {
29+
color: red;
30+
}
31+
</style><style>h1 {
32+
color: blue;
33+
}
34+
</style>
35+
<title>style-loader test</title>
36+
<style id=\\"existing-style\\">.existing { color: yellow }</style>
37+
</head>
38+
<body>
39+
<h1>Body</h1>
40+
<div class=\\"target\\"></div>
41+
<iframe class=\\"iframeTarget\\"></iframe>
42+
43+
44+
</body></html>"
45+
`;
46+
47+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "lazyStyleTag" and insert is object: errors 1`] = `Array []`;
48+
49+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "lazyStyleTag" and insert is object: warnings 1`] = `Array []`;
50+
51+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "linkTag" and insert is object: DOM 1`] = `
52+
"<!DOCTYPE html><html><head><link rel=\\"stylesheet\\" href=\\"style.css\\"><link rel=\\"stylesheet\\" href=\\"style-other.css\\">
53+
<title>style-loader test</title>
54+
<style id=\\"existing-style\\">.existing { color: yellow }</style>
55+
</head>
56+
<body>
57+
<h1>Body</h1>
58+
<div class=\\"target\\"></div>
59+
<iframe class=\\"iframeTarget\\"></iframe>
60+
61+
62+
</body></html>"
63+
`;
64+
65+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "linkTag" and insert is object: errors 1`] = `Array []`;
66+
67+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "linkTag" and insert is object: warnings 1`] = `Array []`;
68+
69+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "singletonStyleTag" and insert is object: DOM 1`] = `
70+
"<!DOCTYPE html><html><head><style>body {
71+
color: red;
72+
}
73+
h1 {
74+
color: blue;
75+
}
76+
</style>
77+
<title>style-loader test</title>
78+
<style id=\\"existing-style\\">.existing { color: yellow }</style>
79+
</head>
80+
<body>
81+
<h1>Body</h1>
82+
<div class=\\"target\\"></div>
83+
<iframe class=\\"iframeTarget\\"></iframe>
84+
85+
86+
</body></html>"
87+
`;
88+
89+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "singletonStyleTag" and insert is object: errors 1`] = `Array []`;
90+
91+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "singletonStyleTag" and insert is object: warnings 1`] = `Array []`;
92+
93+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "styleTag" and insert is object: DOM 1`] = `
94+
"<!DOCTYPE html><html><head><style>body {
95+
color: red;
96+
}
97+
</style><style>h1 {
98+
color: blue;
99+
}
100+
</style>
101+
<title>style-loader test</title>
102+
<style id=\\"existing-style\\">.existing { color: yellow }</style>
103+
</head>
104+
<body>
105+
<h1>Body</h1>
106+
<div class=\\"target\\"></div>
107+
<iframe class=\\"iframeTarget\\"></iframe>
108+
109+
110+
</body></html>"
111+
`;
112+
113+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "styleTag" and insert is object: errors 1`] = `Array []`;
114+
115+
exports[`"insert" option should insert function added to buildDependencies when the "injectType" option is "styleTag" and insert is object: warnings 1`] = `Array []`;
116+
3117
exports[`"insert" option should insert styles into "body" bottom when the "injectType" option is "lazySingletonStyleTag": DOM 1`] = `
4118
"<!DOCTYPE html><html><head>
5119
<title>style-loader test</title>

‎test/insert-option.test.js

+21
Original file line numberDiff line numberDiff line change
@@ -154,6 +154,27 @@ describe('"insert" option', () => {
154154
expect(getErrors(stats)).toMatchSnapshot("errors");
155155
});
156156

157+
it(`should insert function added to buildDependencies when the "injectType" option is "${injectType}" and insert is object`, async () => {
158+
expect.assertions(4);
159+
160+
const insertFn = require.resolve("./fixtures/insertFn.js");
161+
const entry = getEntryByInjectType("simple.js", injectType);
162+
const compiler = getCompiler(entry, {
163+
injectType,
164+
insert: insertFn,
165+
});
166+
const stats = await compile(compiler);
167+
const { buildDependencies } = stats.compilation;
168+
169+
runInJsDom("main.bundle.js", compiler, stats, (dom) => {
170+
expect(dom.serialize()).toMatchSnapshot("DOM");
171+
});
172+
173+
expect(buildDependencies.has(insertFn)).toBe(true);
174+
expect(getWarnings(stats)).toMatchSnapshot("warnings");
175+
expect(getErrors(stats)).toMatchSnapshot("errors");
176+
});
177+
157178
it(`should insert styles into before "#existing-style" id when the "injectType" option is "${injectType}"`, async () => {
158179
expect.assertions(3);
159180

0 commit comments

Comments
 (0)
Please sign in to comment.