Skip to content

Commit

Permalink
test: fix
Browse files Browse the repository at this point in the history
  • Loading branch information
alexander-akait committed Apr 8, 2024
1 parent 977bb71 commit 7ec1120
Show file tree
Hide file tree
Showing 7 changed files with 213 additions and 102 deletions.
108 changes: 12 additions & 96 deletions test/__snapshots__/esModule-option.test.js.snap

Large diffs are not rendered by default.

170 changes: 169 additions & 1 deletion test/__snapshots__/loader.test.js.snap
Original file line number Diff line number Diff line change
Expand Up @@ -923,6 +923,118 @@ exports[`loader should work when the "injectType" option is "styleTag": errors 1
exports[`loader should work when the "injectType" option is "styleTag": warnings 1`] = `[]`;
exports[`loader should work with css modules when the "injectType" option is "autoStyleTag": DOM 1`] = `
"<!DOCTYPE html><html><head>
<title>style-loader test</title>
<style id="existing-style">.existing { color: yellow }</style>
<style>.css-modules-local-scoped-className_B_X8gxt {
background: red;
}
</style><style>.css-modules-myClassName_ll2xYwU {
background: red;
}
.css-modules-myComposingClass__qO4CWd {
color: blue;
}
</style></head>
<body>
<h1>Body</h1>
<div class="target"></div>
<iframe class="iframeTarget"></iframe>
<div class="css-modules-myClassName_ll2xYwU">Water</div><div class="css-modules-myComposingClass__qO4CWd css-modules-local-scoped-className_B_X8gxt">Ground</div></body></html>"
`;
exports[`loader should work with css modules when the "injectType" option is "autoStyleTag": errors 1`] = `[]`;
exports[`loader should work with css modules when the "injectType" option is "autoStyleTag": warnings 1`] = `[]`;
exports[`loader should work with css modules when the "injectType" option is "lazyAutoStyleTag": DOM 1`] = `
"<!DOCTYPE html><html><head>
<title>style-loader test</title>
<style id="existing-style">.existing { color: yellow }</style>
<style>.css-modules-local-scoped-className_B_X8gxt {
background: red;
}
</style><style>.css-modules-myClassName_ll2xYwU {
background: red;
}
.css-modules-myComposingClass__qO4CWd {
color: blue;
}
</style></head>
<body>
<h1>Body</h1>
<div class="target"></div>
<iframe class="iframeTarget"></iframe>
<div class="css-modules-myClassName_ll2xYwU">Water</div><div class="css-modules-myComposingClass__qO4CWd css-modules-local-scoped-className_B_X8gxt">Ground</div></body></html>"
`;
exports[`loader should work with css modules when the "injectType" option is "lazyAutoStyleTag": errors 1`] = `[]`;
exports[`loader should work with css modules when the "injectType" option is "lazyAutoStyleTag": warnings 1`] = `[]`;
exports[`loader should work with css modules when the "injectType" option is "lazySingletonStyleTag": DOM 1`] = `
"<!DOCTYPE html><html><head>
<title>style-loader test</title>
<style id="existing-style">.existing { color: yellow }</style>
<style>.css-modules-local-scoped-className_B_X8gxt {
background: red;
}
.css-modules-myClassName_ll2xYwU {
background: red;
}
.css-modules-myComposingClass__qO4CWd {
color: blue;
}
</style></head>
<body>
<h1>Body</h1>
<div class="target"></div>
<iframe class="iframeTarget"></iframe>
<div class="css-modules-myClassName_ll2xYwU">Water</div><div class="css-modules-myComposingClass__qO4CWd css-modules-local-scoped-className_B_X8gxt">Ground</div></body></html>"
`;
exports[`loader should work with css modules when the "injectType" option is "lazySingletonStyleTag": errors 1`] = `[]`;
exports[`loader should work with css modules when the "injectType" option is "lazySingletonStyleTag": warnings 1`] = `[]`;
exports[`loader should work with css modules when the "injectType" option is "lazyStyleTag": DOM 1`] = `
"<!DOCTYPE html><html><head>
<title>style-loader test</title>
<style id="existing-style">.existing { color: yellow }</style>
<style>.css-modules-local-scoped-className_B_X8gxt {
background: red;
}
</style><style>.css-modules-myClassName_ll2xYwU {
background: red;
}
.css-modules-myComposingClass__qO4CWd {
color: blue;
}
</style></head>
<body>
<h1>Body</h1>
<div class="target"></div>
<iframe class="iframeTarget"></iframe>
<div class="css-modules-myClassName_ll2xYwU">Water</div><div class="css-modules-myComposingClass__qO4CWd css-modules-local-scoped-className_B_X8gxt">Ground</div></body></html>"
`;
exports[`loader should work with css modules when the "injectType" option is "lazyStyleTag": errors 1`] = `[]`;
exports[`loader should work with css modules when the "injectType" option is "lazyStyleTag": warnings 1`] = `[]`;
exports[`loader should work with css modules when the "injectType" option is "linkTag": DOM 1`] = `
"<!DOCTYPE html><html><head>
<title>style-loader test</title>
Expand All @@ -934,13 +1046,69 @@ exports[`loader should work with css modules when the "injectType" option is "li
<iframe class="iframeTarget"></iframe>
<div class="undefined">Water</div><div class="undefined">Ground</div></body></html>"
<div>Water</div><div>Ground</div></body></html>"
`;
exports[`loader should work with css modules when the "injectType" option is "linkTag": errors 1`] = `[]`;
exports[`loader should work with css modules when the "injectType" option is "linkTag": warnings 1`] = `[]`;
exports[`loader should work with css modules when the "injectType" option is "singletonStyleTag": DOM 1`] = `
"<!DOCTYPE html><html><head>
<title>style-loader test</title>
<style id="existing-style">.existing { color: yellow }</style>
<style>.css-modules-local-scoped-className_B_X8gxt {
background: red;
}
.css-modules-myClassName_ll2xYwU {
background: red;
}
.css-modules-myComposingClass__qO4CWd {
color: blue;
}
</style></head>
<body>
<h1>Body</h1>
<div class="target"></div>
<iframe class="iframeTarget"></iframe>
<div class="css-modules-myClassName_ll2xYwU">Water</div><div class="css-modules-myComposingClass__qO4CWd css-modules-local-scoped-className_B_X8gxt">Ground</div></body></html>"
`;
exports[`loader should work with css modules when the "injectType" option is "singletonStyleTag": errors 1`] = `[]`;
exports[`loader should work with css modules when the "injectType" option is "singletonStyleTag": warnings 1`] = `[]`;
exports[`loader should work with css modules when the "injectType" option is "styleTag": DOM 1`] = `
"<!DOCTYPE html><html><head>
<title>style-loader test</title>
<style id="existing-style">.existing { color: yellow }</style>
<style>.css-modules-local-scoped-className_B_X8gxt {
background: red;
}
</style><style>.css-modules-myClassName_ll2xYwU {
background: red;
}
.css-modules-myComposingClass__qO4CWd {
color: blue;
}
</style></head>
<body>
<h1>Body</h1>
<div class="target"></div>
<iframe class="iframeTarget"></iframe>
<div class="css-modules-myClassName_ll2xYwU">Water</div><div class="css-modules-myComposingClass__qO4CWd css-modules-local-scoped-className_B_X8gxt">Ground</div></body></html>"
`;
exports[`loader should work with css modules when the "injectType" option is "styleTag": errors 1`] = `[]`;
exports[`loader should work with css modules when the "injectType" option is "styleTag": warnings 1`] = `[]`;
exports[`loader should work: DOM 1`] = `
"<!DOCTYPE html><html><head>
<title>style-loader test</title>
Expand Down
9 changes: 9 additions & 0 deletions test/esModule-option.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -96,6 +96,15 @@ describe('"esModule" option', () => {
{},
{
module: {
parser: {
javascript: {
exportsPresence:
esModuleValue.cssLoader.modules &&
esModuleValue.cssLoader.modules.exportOnlyLocals
? false
: "error",
},
},
rules: [
{
test: /\.css$/i,
Expand Down
15 changes: 15 additions & 0 deletions test/fixtures/css-modules-link.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
import './css-modules.css';

const node1 = document.createElement("DIV");
const textNode1 = document.createTextNode("Water");

node1.appendChild(textNode1);

document.body.appendChild(node1);

const node2 = document.createElement("DIV");
const textNode2 = document.createTextNode("Ground");

node2.appendChild(textNode2);

document.body.appendChild(node2);
2 changes: 1 addition & 1 deletion test/fixtures/css-modules.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import styles from './css-modules.css';
import * as styles from './css-modules.css';

const node1 = document.createElement("DIV");
const textNode1 = document.createTextNode("Water");
Expand Down
6 changes: 3 additions & 3 deletions test/fixtures/lazy-css-modules.js
Original file line number Diff line number Diff line change
@@ -1,19 +1,19 @@
import styles from './css-modules.css';
import styles, { myClassName, myComposingClass } from './css-modules.css';

styles.use();

const node1 = document.createElement("DIV");
const textNode1 = document.createTextNode("Water");

node1.appendChild(textNode1);
node1.className = styles.locals.myClassName;
node1.className = myClassName;

document.body.appendChild(node1);

const node2 = document.createElement("DIV");
const textNode2 = document.createTextNode("Ground");

node2.appendChild(textNode2);
node2.className = styles.locals.myComposingClass;
node2.className = myComposingClass;

document.body.appendChild(node2);
5 changes: 4 additions & 1 deletion test/loader.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,10 @@ describe("loader", () => {
it(`should work with css modules when the "injectType" option is "${injectType}"`, async () => {
expect.assertions(3);

const entry = getEntryByInjectType("css-modules.js", injectType);
const entry = getEntryByInjectType(
injectType === "linkTag" ? "css-modules-link.js" : "css-modules.js",
injectType,
);
const compiler = getCompiler(
entry,
{},
Expand Down

0 comments on commit 7ec1120

Please sign in to comment.