Merge pull request #63 from suitcss/v21

Updates for v21 release

.github/workflows/ci.yml

@@ -11,7 +11,7 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node: [ '16', '18', '20' ]
+        node: [ '18', '20', '21' ]
     name: Run tests on Node ${{ matrix.node }}
     steps:
       - name: Checkout repository
@@ -21,6 +21,6 @@ jobs:
         with:
           node-version: ${{ matrix.node }}
       - name: Install dependencies
-        run: yarn install
+        run: npm ci
       - name: Run tests
-        run: yarn test
+        run: npm test

__tests__/index.js

@@ -1,37 +1,52 @@
-const config = require("../");
-const fs = require("fs");
-const stylelint = require("stylelint");
-
-const validCss = fs.readFileSync(`${__dirname}/valid.css`, "utf-8");
-const invalidCss = (
-`a {}
-`);
-
-test("no warnings with valid css", () =>
-  stylelint.lint({
-    code: validCss,
-    config,
-  })
-  .then(data => {
-    const { errored, results } = data;
+import config from '../index.js';
+import stylelint from 'stylelint';
+
+describe('stylelint-config-suitcss', () => {
+  const lint = async (css) => {
+    const result = await stylelint.lint({
+      code: css,
+      config,
+    });
+
+    return result;
+  };
+
+  test('should not allow block-no-empty', async () => {
+    const { results } = await lint(`a {}`);
     const { warnings } = results[0];
 
-    expect(errored).toBeFalsy();
-    expect(warnings).toHaveLength(0);
-  })
-);
-
-test("a warning with invalid css", () =>
-  stylelint.lint({
-    code: invalidCss,
-    config,
-  })
-  .then(data => {
-    const { errored, results } = data;
+    expect(warnings).toHaveLength(1);
+    expect(warnings[0].text).toContain('block-no-empty');
+  });
+
+  test('should enforce color-hex-length to be short', async () => {
+    const { results } = await lint(`a { color: #ffffff; }`);
+    const { warnings } = results[0];
+
+    expect(warnings).toHaveLength(1);
+    expect(warnings[0].text).toContain('color-hex-length');
+  });
+
+  test('should not allow at-rule-no-vendor-prefix', async () => {
+    const { results } = await lint(`@-webkit-keyframes slide { from { top: 0; } to { top: 100%; } }`);
+    const { warnings } = results[0];
+
+    expect(warnings).toHaveLength(1);
+    expect(warnings[0].text).toContain('at-rule-no-vendor-prefix');
+  });
+
+  test('should enforce function-url-quotes', async () => {
+    const { results } = await lint(`a { background: url(unquoted-url.jpg); }`);
     const { warnings } = results[0];
 
-    expect(errored).toBeTruthy();
     expect(warnings).toHaveLength(1);
-    expect(warnings[0].text).toBe("Unexpected empty block (block-no-empty)");
-  })
-);
+    expect(warnings[0].text).toContain('function-url-quotes');
+  });
+
+  test('should allow correct SUIT custom properties usage', async () => {
+    const { results } = await lint(`:root { --mainColor: #123456; }`);
+    const { warnings } = results[0];
+
+    expect(warnings).toHaveLength(0);
+  });
+});

index.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
   "plugins": [
     "stylelint-order",
     "stylelint-suitcss",