fix: correct support for multiple classes, fixes #43

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2017 Anton Korzunov
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

__tests__/edge-cases/missing-43.spec.ts

@@ -0,0 +1,43 @@
+import { loadStyleDefinitions } from '../../src';
+import { getCriticalStyles } from '../../src/getCSS';
+
+describe('missing styles', () => {
+  it('result should contain 1600', async () => {
+    const styles = loadStyleDefinitions(
+      () => ['test.css'],
+      // // .downloads-1u5ev.downloadsFallback-1btP7 .logo-2Dv5-,
+      () => `    
+    .a.b .c {    
+    position: relative;
+}
+`
+    );
+    await styles;
+
+    expect(styles.ast['test.css'].selectors).toMatchInlineSnapshot(`
+      Array [
+        Object {
+          "declaration": 1,
+          "hash": ".a.b .c18suomu-1gpll6f0",
+          "media": Array [],
+          "parents": Array [
+            "a",
+            "b",
+          ],
+          "pieces": Array [
+            "c",
+          ],
+          "postfix": ".c",
+          "selector": ".a.b .c",
+        },
+      ]
+    `);
+
+    const extracted = getCriticalStyles('<div class="a b"><div class="c"></div></div>\n', styles);
+
+    expect(extracted).toMatchInlineSnapshot(`
+      "<style type=\\"text/css\\" data-used-styles=\\"test.css\\">.a.b .c { position: relative; }
+      </style>"
+    `);
+  });
+});

__tests__/extraction.spec.tsx

@@ -148,6 +148,18 @@ describe('extraction stories', () => {
 .top .child {
   margin: 10px;
 }
+
+.grand.top .child {
+  position: correct
+}
+
+.grand.top {
+  margin: 10px;
+}
+
+.grand.top.incorrect .child {
+  position: incorrect
+}
 `
     );
     await styles;
@@ -160,6 +172,8 @@ describe('extraction stories', () => {
       .child { padding: 10px; }
       .grand .child { padding: 10px; }
       .top .child { margin: 10px; }
+      .grand.top .child { position: correct; }
+      .grand.top { margin: 10px; }
       "
     `);
   });

__tests__/mapStyles.spec.ts

@@ -33,7 +33,7 @@ describe('test parent selector', () => {
   });
 
   it('should return the double style', () => {
-    expect(extractParents('.a.b c')).toEqual(['a.b']);
+    expect(extractParents('.a.b c')).toEqual(['a', 'b']);
   });
 
   it('should keep the first style; drop last', () => {

package.json

@@ -30,7 +30,7 @@
     "@theuiteam/lib-builder": "0.1.4"
   },
   "engines": {
-    "node": ">=10"
+    "node": ">=11"
   },
   "files": [
     "dist"

src/parser/utils.ts

@@ -26,7 +26,10 @@ export const extractParents = (selector: string): string[] => {
 
   const effectiveMatcher = ruleSelection.filter(classish);
 
-  const selectors = effectiveMatcher.map((x) => x.replace(/[.\s.:]+/, '').replace(/PLUS_SYMBOL/g, '+')).filter(Boolean);
+  const selectors = effectiveMatcher
+    .map((x) => x.replace(/[.\s.:]+/, '').replace(/PLUS_SYMBOL/g, '+'))
+    .filter(Boolean)
+    .flatMap<string>((cl) => cl.split('.'));
 
   return selectors;
 };

tsconfig.json

@@ -16,17 +16,7 @@
     "importHelpers": true,
     "target": "es6",
     "moduleResolution": "node",
-    "lib": [
-      "dom",
-      "es5",
-      "es6",
-      "es2017.object",
-      "scripthost",
-      "es2015.collection",
-      "es2015.symbol",
-      "es2015.iterable",
-      "es2015.promise"
-    ],
+    "lib": ["dom", "es5", "es6", "es2019", "scripthost"],
     "types": ["node", "jest"],
     "typeRoots": ["./node_modules/@types"],
     "jsx": "react"