get something working with testing experimental moveBefore.

MichaelWest22 · Dec 17, 2024 · 4862b93 · 4862b93
1 parent 990e500
commit 4862b93
Show file tree

Hide file tree

Showing 7 changed files with 55 additions and 10 deletions.
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -19,3 +19,17 @@ jobs:
       - name: Run tests
         run: npm run ci
 
+  test-move-before:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+      - name: Use Node.js
+        uses: actions/setup-node@v4
+        with:
+          cache: 'npm'
+      - name: Install dependencies
+        run: npm install
+      - name: Run tests
+        run: npm run test-move-before
+
diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,4 @@
 /node_modules/
 /coverage
+/test/chrome-profile
 .idea
diff --git a/TESTING.md b/TESTING.md
@@ -25,6 +25,12 @@ npm run ci
 ```
 This will run the tests using Playwright’s headless browser setup across Chrome, Firefox, and WebKit (Safari-adjacent). This is ultimately what gets run in Github Actions to verify PRs.
 
+To run all tests against Chrome with experimental `moveBefore` support added, execute:
+```bash
+npm run test-move-before
+```
+This will start headless Chrome in a new profile with the `atomic-move` experimental flag set. This runs in a separate job in CI.
+
 ## Running Individual Tests
 
 ### Headless Mode

diff --git a/package.json b/package.json
@@ -21,6 +21,7 @@
   "scripts": {
     "test": "web-test-runner",
     "debug": "web-test-runner --manual --open",
+    "test-move-before": "USE_MOVE_BEFORE=1 web-test-runner",
     "ci": "web-test-runner --playwright --browsers chromium firefox webkit",
     "amd": "(echo \"define(() => {\n\" && cat src/idiomorph.js && echo \"\nreturn Idiomorph});\") > dist/idiomorph.amd.js",
     "cjs": "(cat src/idiomorph.js && echo \"\nmodule.exports = Idiomorph;\") > dist/idiomorph.cjs.js",

diff --git a/test/htmx-integration.js b/test/htmx-integration.js
@@ -1,5 +1,4 @@
 describe("Tests for the htmx integration", function() {
-
     function makeServer(){
         var server = sinon.fakeServer.create();
         htmx.config.defaultSettleDelay = 0;

diff --git a/test/lib/utilities.js b/test/lib/utilities.js
@@ -1,6 +1,10 @@
 /* Test Utilities */
+
 function setup() {
-    beforeEach(function() {
+    beforeEach(() => {
+        if (window.useMoveBefore && !Element.prototype.moveBefore) {
+            throw new Error('Element.prototype.moveBefore is not available.');
+        }
         clearWorkArea();
     });
 }

diff --git a/web-test-runner.config.mjs b/web-test-runner.config.mjs
@@ -1,17 +1,17 @@
-export default {
-  nodeResolve: true,
-  coverage: true,
-  coverageConfig: {
-    include: ['src/**/*'],
-  },
-  files: "test/*.js",
+import { chromeLauncher } from "@web/test-runner";
+import { exec } from "child_process";
+
+let config = {
   testRunnerHtml: (testFramework) => `
     <!DOCTYPE html>
     <html>
     <head>
       <script src="/node_modules/chai/chai.js"></script>
       <script src="/node_modules/chai-dom/chai-dom.js"></script>
-      <script>should = chai.should()</script>
+      <script>
+          should = chai.should();
+          window.useMoveBefore = ${process.env.USE_MOVE_BEFORE};
+      </script>
       <script src="/test/lib/utilities.js"></script>
       <script src="/node_modules/sinon/pkg/sinon.js"></script>
 
@@ -32,5 +32,25 @@ export default {
     </body>
     </html>
   `,
+
+  nodeResolve: true,
+  coverage: true,
+  coverageConfig: {
+    include: ['src/**/*'],
+  },
+  files: "test/*.js",
 };
 
+if (process.env.USE_MOVE_BEFORE) {
+  // configure chrome to use a custom profile directory we control
+  config.browsers = [
+    chromeLauncher({ launchOptions: { args: ['--user-data-dir=test/chrome-profile'] } })
+  ]
+  exec([
+    'rm -rf test/chrome-profile', // clear profile out from last run
+    'mkdir -p test/chrome-profile', // create from scratch
+    `echo '{"browser":{"enabled_labs_experiments":["atomic-move@1"]}}' > test/chrome-profile/Local\\ State`, // enable experiment
+  ].join(" && "));
+}
+
+export default config;