Wrap each popover menu and give it a caller-named id

e2e-tests/playwright.config.ts

@@ -15,5 +15,11 @@ export default defineConfig({
     screenshot: "only-on-failure",
     viewport: { width: 1280, height: 800 },
   },
-  projects: [{ name: "chromium", use: { ...devices["Desktop Chrome"] } }],
+  // CSS anchor positioning is the newest platform feature in the app and every popup menu rests on
+  // it, so the tests tagged @engines run in all three engines; the rest stay on chromium.
+  projects: [
+    { name: "chromium", use: { ...devices["Desktop Chrome"] } },
+    { name: "firefox", grep: /@engines/, use: { ...devices["Desktop Firefox"] } },
+    { name: "webkit", grep: /@engines/, use: { ...devices["Desktop Safari"] } },
+  ],
 });

e2e-tests/visual.spec.ts

@@ -74,7 +74,7 @@ test("theme switch flips the palette with no JavaScript", async ({ page }) => {
 // longer has to click the trigger again to get rid of one. Driven through the language picker; the
 // profile menu is the same block. Anchoring is asserted too — without `position-anchor` the panel
 // silently detaches and lands in the middle of the viewport.
-test("a popover menu sits on its trigger and closes on an outside click or Esc — no JavaScript", async ({ page }) => {
+test("a popover menu sits on its trigger and closes on an outside click or Esc — no JavaScript @engines", async ({ page }) => {
   await page.goto("/dashboard");
   const trigger = page.locator('button[aria-label="Language"]');
   const panel = page.locator('button[aria-label="Language"] + .menu-pop');