Updates

.github/workflows/publish.yml

@@ -4,26 +4,30 @@ on:
   release:
     types: [created]
 
+permissions:
+  contents: read
+
 jobs:
   test:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
+      - uses: actions/checkout@v5
+      - uses: actions/setup-node@v5
         with:
-          node-version: '20.x'
+          node-version: '24.x'
       - run: npm install
-      - run: npm install --prefix jest/legacy
+      - run: npm run lint
+      - run: npm run typecheck
       - run: npm test
 
   publish:
     needs: test
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
+      - uses: actions/checkout@v5
+      - uses: actions/setup-node@v5
         with:
-          node-version: '20.x'
+          node-version: '24.x'
           registry-url: 'https://registry.npmjs.org'
       - run: npm version --no-git-tag-version ${{ github.event.release.tag_name }}
       - run: npm publish

.github/workflows/tests.yml

@@ -2,19 +2,61 @@ name: Tests
 
 on: [push, pull_request]
 
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: true
+
+permissions:
+  contents: read
+
 jobs:
+  lint:
+    name: Linting
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v5
+      - uses: actions/setup-node@v5
+        with:
+          node-version: 24.x
+      - name: Get npm cache directory
+        id: npm-cache
+        run: echo "dir=$(npm config get cache)" >> $GITHUB_OUTPUT
+      - name: Cache npm dependencies
+        uses: actions/cache@v5
+        with:
+          path: ${{ steps.npm-cache.outputs.dir }}
+          key: ${{ runner.os }}-node-${{ hashFiles('package.json') }}
+          restore-keys: ${{ runner.os }}-node-
+      - run: npm install
+      - run: npm run lint
+      - run: npm run typecheck
+
   test:
+    name: Node ${{ matrix.node-version }} / Tailwind ${{ matrix.tailwind.v3 }} + ${{ matrix.tailwind.v4 }}
     runs-on: ubuntu-latest
     strategy:
+      fail-fast: false
       matrix:
-        node-version: [20.x, 22.x]
+        node-version: [20.x, 22.x, 24.x]
+        tailwind:
+          - { v3: '3.1.0', v4: '4.0.7' } # @tailwindcss/postcss < 4.0.7 has a test runner bug
+          - { v3: '^3', v4: '^4' }
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v5
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v5
         with:
           node-version: ${{ matrix.node-version }}
+      - name: Get npm cache directory
+        id: npm-cache
+        run: echo "dir=$(npm config get cache)" >> $GITHUB_OUTPUT
+      - name: Cache npm dependencies
+        uses: actions/cache@v5
+        with:
+          path: ${{ steps.npm-cache.outputs.dir }}
+          key: ${{ runner.os }}-node-${{ hashFiles('package.json') }}
+          restore-keys: ${{ runner.os }}-node-
       - run: npm install
-      - run: npm install --prefix jest/legacy
-      - run: npm run lint
-      - run: npm run test
+      - name: Install Tailwind ${{ matrix.tailwind.v3 }} + ${{ matrix.tailwind.v4 }}
+        run: npm install --no-save tailwindcss@${{ matrix.tailwind.v4 }} @tailwindcss/postcss@${{ matrix.tailwind.v4 }} @tailwindcss/cli@${{ matrix.tailwind.v4 }} tailwindcss-legacy@npm:tailwindcss@${{ matrix.tailwind.v3 }}
+      - run: npm test

eslint.config.mjs

@@ -4,7 +4,10 @@ import eslintPluginJest from 'eslint-plugin-jest'
 
 export default [
     js.configs.recommended,
-    eslintPluginJest.configs['flat/recommended'],
+    {
+        ...eslintPluginJest.configs['flat/recommended'],
+        files: ['jest/**/*.js'],
+    },
     {
         languageOptions: {
             ecmaVersion: 2022,

jest/content/direction.html

@@ -1,2 +1,4 @@
 <div class="animate-normal"></div>
 <div class="animate-reverse"></div>
+<div class="animate-alternate"></div>
+<div class="animate-alternate-reverse"></div>

jest/content/fill-mode.html

@@ -1,2 +1,4 @@
 <div class="animate-fill-none"></div>
+<div class="animate-fill-forwards"></div>
+<div class="animate-fill-backwards"></div>
 <div class="animate-fill-both"></div>

jest/content/predefined-animations.html

@@ -1,2 +1,19 @@
-<div class="animate-fade"></div>
 <div class="animate-spin"></div>
+<div class="animate-ping"></div>
+<div class="animate-pulse"></div>
+<div class="animate-bounce"></div>
+<div class="animate-wiggle"></div>
+<div class="animate-wiggle-more"></div>
+<div class="animate-rotate-y"></div>
+<div class="animate-rotate-x"></div>
+<div class="animate-jump"></div>
+<div class="animate-jump-in"></div>
+<div class="animate-jump-out"></div>
+<div class="animate-shake"></div>
+<div class="animate-fade"></div>
+<div class="animate-fade-down"></div>
+<div class="animate-fade-up"></div>
+<div class="animate-fade-left"></div>
+<div class="animate-fade-right"></div>
+<div class="animate-flip-up"></div>
+<div class="animate-flip-down"></div>

jest/content/timing-function.html

@@ -1,3 +1,6 @@
 <div class="animate-ease"></div>
 <div class="animate-ease-linear"></div>
+<div class="animate-ease-in"></div>
+<div class="animate-ease-out"></div>
+<div class="animate-ease-in-out"></div>
 <div class="animate-ease-[cubic-bezier(1,0.66,0.33,0)]"></div>

jest/customMatchers.js

@@ -1,24 +1,27 @@
 expect.extend({
-    toIncludeAll(received, expected) {
-        function stripped(str) {
-            return str.replace(/\s/g, '').replace(/;/g, '')
+    toContainAll(received, expected) {
+        if (typeof received !== 'string') {
+            throw new TypeError(`toContainAll: received value must be a string, got ${typeof received}`)
         }
 
-        const receivedStripped = stripped(received)
+        if (! Array.isArray(expected)) {
+            throw new TypeError('toContainAll: expected value must be an array of strings')
+        }
 
-        const pass = Array.isArray(expected) && expected.every(value => receivedStripped.includes(stripped(value)))
+        const normalize = str => str.replace(/[\s;]/g, '')
+        const pass = expected.every(value => normalize(received).includes(normalize(value)))
 
         return {
             pass,
             message: () => pass
-                ? this.utils.matcherHint('.not.toIncludeAll') +
-                  '\n\n' +
-                  `Expected not to have all of: ${this.utils.printExpected(received)}\n` +
-                  `Received: ${this.utils.printReceived(expected)}`
-                : this.utils.matcherHint('.toIncludeAll') +
-                  '\n\n' +
-                  `Expected to have all of: ${this.utils.printExpected(expected)}\n` +
-                  `Received: ${this.utils.printReceived(received)}`,
+                ? this.utils.matcherHint('.not.toContainAll')
+                    + '\n\n'
+                    + `Expected not to have all of: ${this.utils.printExpected(expected)}\n`
+                    + `Received: ${this.utils.printReceived(received)}`
+                : this.utils.matcherHint('.toContainAll')
+                    + '\n\n'
+                    + `Expected to have all of: ${this.utils.printExpected(expected)}\n`
+                    + `Received: ${this.utils.printReceived(received)}`,
         }
     },
 })