test: adopt a hybrid unit + browser e2e model, shard CI, and snapshot the console

The hot client, overlay, and building indicator are now exercised end
to end in headless Chrome (puppeteer 22, the last CJS release jest can
require) against a real webpack watcher: updates applied without
reload, the full-reload fallback, reconnect with catch-up sync after a
server restart, disconnect() semantics, overlay lifecycle (Escape on
the host page, HTML-in-error-message escaping, warnings, pagination),
the building badge, multi-compiler ?name= filtering with per-bundle
overlay slots, and the custom publish/subscribe API.

Console behavior is snapshotted from the real browser console: the full
info-level update cycle, logging=none/warn/error gates, and the
per-bundle dedup where a sibling's clean rebuild does not re-log
another bundle's unchanged warning while its own rebuild does. Each
multi-compiler compilation gets its own context dir so editing one
entry cannot invalidate the sibling's watcher and shuffle event order.

The jsdom suites stay, slimmed to what a browser cannot exercise
deterministically: process-update internals, shared state between
bundled copies, option parsing, and protocol edges. The review of the
new tests also surfaced a real client bug, now fixed: an EventSource
error event queued behind disconnect() re-armed the reconnect timer on
the orphaned wrapper — close() is now final.

e2e runs serially through the new test:e2e script (four concurrent
Chrome instances plus watchers starved the rest of the suite), and CI
shards every test job 4x with jest --shard, uploading per-shard
coverage that a final job aggregates for codecov, mirroring
webpack-dev-server's setup.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Author: bjohansebas

.github/workflows/nodejs.yml

@@ -56,19 +56,20 @@ jobs:
         run: if [ -n "$(git status types --porcelain)" ]; then echo "Missing types. Update types by running 'npm run build:types'"; exit 1; else echo "All types are valid"; fi
 
   test:
-    name: Test - ${{ matrix.os }} - Node v${{ matrix.node-version }}, Webpack ${{ matrix.webpack-version }}
+    name: Test - ${{ matrix.os }} - Node v${{ matrix.node-version }}, Webpack ${{ matrix.webpack-version }} (${{ matrix.shard }})
 
     strategy:
       fail-fast: false
       matrix:
         os: [ubuntu-latest, windows-latest, macos-latest]
         node-version: [20.x, 22.x, 24.x, 25.x]
         webpack-version: [latest]
+        shard: ["1/4", "2/4", "3/4", "4/4"]
 
     runs-on: ${{ matrix.os }}
 
     concurrency:
-      group: test-${{ matrix.os }}-v${{ matrix.node-version }}-${{ matrix.webpack-version }}-${{ github.ref }}
+      group: test-${{ matrix.os }}-v${{ matrix.node-version }}-${{ matrix.webpack-version }}-${{ matrix.shard }}-${{ github.ref }}
       cancel-in-progress: true
 
     steps:
@@ -84,9 +85,33 @@ jobs:
         run: npm ci
 
       - name: Run tests for webpack version ${{ matrix.webpack-version }}
-        run: npm run test:coverage -- --ci
+        run: npm run test:coverage -- --ci --shard=${{ matrix.shard }}
+
+      - name: Run browser e2e tests
+        run: npm run test:e2e -- --ci --shard=${{ matrix.shard }}
+
+      - name: Upload coverage artifact
+        uses: actions/upload-artifact@ea165f8d65b6e75b540449e92b4886f43607fa02 # v4.6.2
+        with:
+          name: coverage-${{ matrix.os }}-${{ matrix.node-version }}-${{ strategy.job-index }}
+          path: coverage/lcov.info
+
+  upload-coverage:
+    name: Upload coverage to codecov
+    needs: test
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@3d3c42e5aac5ba805825da76410c181273ba90b1 # v7.0.1
+
+      - name: Download coverage artifacts
+        uses: actions/download-artifact@d3f86a106a0bac45b974a628896c90dbdf5c8093 # v4.3.0
+        with:
+          pattern: coverage-*
+          path: coverage
 
       - name: Submit coverage data to codecov
         uses: codecov/codecov-action@fb8b3582c8e4def4969c97caa2f19720cb33a72f # v7.0.0
         with:
           token: ${{ secrets.CODECOV_TOKEN }}
+          directory: coverage

client-src/index.js

@@ -145,6 +145,7 @@ function createEventSourceWrapper() {
   let timer;
   /** @type {ReturnType<typeof setTimeout>} */
   let reconnectTimer;
+  let closed = false;
 
   const handleOnline = () => {
     log.info("connected");
@@ -162,18 +163,30 @@ function createEventSourceWrapper() {
   };
 
   /**
-   * Close the connection and stop the activity timer without scheduling a
-   * reconnection. A reconnection that is already pending is cancelled too, so
-   * closing during the reconnect window really is final.
+   * Tear the current connection down without deciding whether it is final.
    */
-  const close = () => {
+  const stop = () => {
     clearInterval(timer);
     clearTimeout(reconnectTimer);
     source.close();
   };
 
+  /**
+   * Close for good: no reconnection is scheduled, a pending one is cancelled,
+   * and error events already queued behind the close (the EventSource fires
+   * one when its connection dies) can no longer resurrect the wrapper.
+   */
+  const close = () => {
+    closed = true;
+    stop();
+  };
+
   const handleDisconnect = () => {
-    close();
+    if (closed) {
+      return;
+    }
+
+    stop();
     reconnectTimer = setTimeout(init, /** @type {number} */ (options.timeout));
   };