test(frontend): cover the lifecycle, the voice and the repaints

Component and store cases for everything in this series, several of
which exist because the thing they pin is invisible everywhere else:

- `view-lifecycle` and `keyboard-reach` — a document listener count
  that does not grow across a simulated navigate cycle, and a tab
  sequence that reaches the sidebar and plays a row without a mouse.
- `notifications`, `notification-store`, `confirm-dialog`,
  `empty-states` — the four levels, the (level, region, key)
  coalescing window, and loading/failed/empty as three states.
- `card-grid-repaint` — fails if `artists-view`'s or `genres-view`'s
  per-render arrow functions are hoisted to stable fields, which is
  the audit's own recommendation and takes the cards from 1 highlighted
  to 0. It exists for no other reason.
- `lazy-track-details` — reads the five sources and fails on a
  returning static import, the same shape as `TestNoDirectRuntimeEmits`
  and for the same reason: the invariant is about what the code does
  *not* say.
- `now-playing` — a position report that changes nothing must not
  touch the DOM again, and a track change must. The first fails
  against the old unconditional `updated()`.
- `playlist-virtualization`, `list-render-cost`, `selection`, `icons`,
  and the store cases for the library-filter race, the never-settling
  waiter and the per-playlist patch.

frontend/test/components/icons.test.ts

@@ -0,0 +1,71 @@
+/**
+ * The icons are bundled, and stay bundled.
+ *
+ * `e2e/specs/offline-icons.spec.ts` is the reproduction — it closes the
+ * network and looks at the screen.  This is the cheap guard that runs
+ * on every change: that the library the app registers resolves every
+ * name it claims to, and resolves none of them to a URL somebody else
+ * has to be reachable to serve.
+ */
+import { describe, expect, it } from 'vitest';
+// A bare <wa-icon> is an unknown element unless something pulls the
+// component in; in the app `index.ts` does it, and here nothing else in
+// this module would.
+import '@awesome.me/webawesome/dist/components/icon/icon.js';
+
+import { bundledIconNames, registerBundledIcons } from '../../src/icons';
+import { fixture } from '../support/render';
+
+// A name from each of the ways a call site produces one: a literal in a
+// template, a sidebar table entry, a value computed from player state,
+// and the notification tone map.  Not exhaustive on purpose — the
+// exhaustive check is the e2e sweep, which can see what state produces.
+const REPRESENTATIVE = [
+    'house', 'compact-disc', 'play', 'pause', 'shuffle', 'repeat',
+    'volume-high', 'volume-xmark', 'triangle-exclamation', 'circle-check',
+    'magnifying-glass', 'gear', 'heart', 'regular/heart',
+];
+
+describe('bundled icons', () => {
+    it('resolves every name the app is known to use', () => {
+        const names = new Set(bundledIconNames());
+
+        for (const name of REPRESENTATIVE) {
+            expect(names, `icon '${name}' is not bundled`).toContain(name);
+        }
+    });
+
+    it('resolves nothing to a remote origin', async () => {
+        // Re-registering is what the app does on every boot; it must be
+        // idempotent, and the assertion needs the resolver itself
+        // rather than the name list.
+        registerBundledIcons();
+
+        // Attributes, not properties: `regular/heart` is a library key
+        // rather than an icon name, and `wa-icon` takes its name from
+        // the attribute.
+        const icons = await Promise.all(
+            REPRESENTATIVE.filter((n) => !n.includes('/')).map(async (n) => {
+                const el = await fixture('wa-icon');
+                el.setAttribute('name', n);
+                await el.updateComplete;
+
+                return el;
+            }),
+        );
+
+        // Give the icon components a turn to fetch and inline their SVG.
+        await new Promise((r) => setTimeout(r, 500));
+
+        expect(icons.length).toBeGreaterThan(0);
+
+        for (const icon of icons) {
+            const svg = icon.shadowRoot?.querySelector('svg');
+
+            expect(
+                svg,
+                `icon '${icon.getAttribute('name')}' rendered nothing`,
+            ).toBeTruthy();
+        }
+    });
+});