Add tests for :global and :local shorthand selectors.

madyankin · Feb 23, 2022 · a400e14 · a400e14
1 parent 3c8ba0c
commit a400e14
Show file tree

Hide file tree

Showing 4 changed files with 49 additions and 1 deletion.
diff --git a/test/__snapshots__/test.js.snap b/test/__snapshots__/test.js.snap
@@ -202,6 +202,22 @@ p {
 "
 `;
 
+exports[`only calls plugins once when it processes :global shorthand selector: plugins once - processes :global shorthand selector - CSS 1`] = `
+"/* validator-2-start (globalShorthand.css) *//* validator-1-start (globalShorthand.css) */
+.title {
+    color: red;
+}/* validator-1-end (globalShorthand.css) *//* validator-2-end (globalShorthand.css) */
+"
+`;
+
+exports[`only calls plugins once when it processes :local shorthand selector: plugins once - processes :local shorthand selector - CSS 1`] = `
+"/* validator-2-start (localShorthand.css) *//* validator-1-start (localShorthand.css) */
+._localShorthand_title {
+    color: red;
+}/* validator-1-end (localShorthand.css) *//* validator-2-end (localShorthand.css) */
+"
+`;
+
 exports[`only calls plugins once when it processes classes: plugins once - processes classes - CSS 1`] = `
 "/* validator-2-start (classes.css) */
 
@@ -268,6 +284,28 @@ p {
 
 exports[`preserves comments: preserves comments - JSON 1`] = `Object {}`;
 
+exports[`processes :global shorthand selector: processes :global shorthand selector - CSS 1`] = `
+".title {
+    color: red;
+}
+"
+`;
+
+exports[`processes :global shorthand selector: processes :global shorthand selector - JSON 1`] = `Object {}`;
+
+exports[`processes :local shorthand selector: processes :local shorthand selector - CSS 1`] = `
+"._localShorthand_title {
+    color: red;
+}
+"
+`;
+
+exports[`processes :local shorthand selector: processes :local shorthand selector - JSON 1`] = `
+Object {
+  "title": "_localShorthand_title",
+}
+`;
+
 exports[`processes classes: processes classes - CSS 1`] = `
 ".page {
     padding: 20px;

diff --git a/test/fixtures/in/globalShorthand.css b/test/fixtures/in/globalShorthand.css
@@ -0,0 +1,3 @@
+:global .title {
+    color: red;
+}
diff --git a/test/fixtures/in/localShorthand.css b/test/fixtures/in/localShorthand.css
@@ -0,0 +1,3 @@
+:local .title {
+    color: red;
+}
diff --git a/test/test.js b/test/test.js
@@ -24,6 +24,8 @@ const cases = {
   values: "processes values",
   interpolated: "generates scoped name with interpolated string",
   global: "allows to make CSS global",
+  localShorthand: "processes :local shorthand selector",
+  globalShorthand: "processes :global shorthand selector",
 };
 
 function generateScopedName(name, filename) {
@@ -40,7 +42,9 @@ Object.keys(cases).forEach((name) => {
       : generateScopedName;
 
   const scopeBehaviour =
-    name === behaviours.GLOBAL ? behaviours.GLOBAL : behaviours.LOCAL;
+    name === behaviours.GLOBAL || name === "globalShorthand"
+      ? behaviours.GLOBAL
+      : behaviours.LOCAL;
 
   it(description, async () => {
     const sourceFile = path.join(fixturesPath, "in", `${name}.css`);