From 4e21dedcb92d908c2229969c58516378b60ecc26 Mon Sep 17 00:00:00 2001
From: "google-labs-jules[bot]"
 <161369871+google-labs-jules[bot]@users.noreply.github.com>
Date: Sat, 24 Jan 2026 12:39:43 +0000
Subject: [PATCH] Add minimal reproducers for Moderation UI and CSS Lint bugs

---
 .../issue-1-moderation-ui/README.md           | 17 ++++++++
 .../playwright.config.ts                      | 13 +++++++
 .../issue-1-moderation-ui/repro.spec.ts       | 39 +++++++++++++++++++
 .../reproducers/issue-2-css-lint/README.md    | 17 ++++++++
 .../reproducers/issue-2-css-lint/repro.mjs    | 14 +++++++
 5 files changed, 100 insertions(+)
 create mode 100644 examples/reproducers/issue-1-moderation-ui/README.md
 create mode 100644 examples/reproducers/issue-1-moderation-ui/playwright.config.ts
 create mode 100644 examples/reproducers/issue-1-moderation-ui/repro.spec.ts
 create mode 100644 examples/reproducers/issue-2-css-lint/README.md
 create mode 100644 examples/reproducers/issue-2-css-lint/repro.mjs

diff --git a/examples/reproducers/issue-1-moderation-ui/README.md b/examples/reproducers/issue-1-moderation-ui/README.md
new file mode 100644
index 00000000..d8f947ac
--- /dev/null
+++ b/examples/reproducers/issue-1-moderation-ui/README.md
@@ -0,0 +1,17 @@
+# Moderation UI "Show Anyway" Bug Reproducer
+
+This directory contains a minimal reproducer for the bug where the "Show anyway" button is not visible in headless mode (or specific environments) within the moderation fixtures.
+
+## Issue
+
+The "Show anyway" button fails `toBeVisible()` check in tests, causing false negatives in moderation UI tests.
+
+## Running the Reproducer
+
+Run the following command from the repository root:
+
+```bash
+npx playwright test -c examples/reproducers/issue-1-moderation-ui/playwright.config.ts
+```
+
+Expected result: The test should **fail** with `Error: expect(locator).toBeVisible() failed`.
diff --git a/examples/reproducers/issue-1-moderation-ui/playwright.config.ts b/examples/reproducers/issue-1-moderation-ui/playwright.config.ts
new file mode 100644
index 00000000..83f6ffa5
--- /dev/null
+++ b/examples/reproducers/issue-1-moderation-ui/playwright.config.ts
@@ -0,0 +1,13 @@
+import { defineConfig } from "@playwright/test";
+import baseConfig from "../../../playwright.config.ts";
+
+export default defineConfig({
+  ...baseConfig,
+  testDir: ".",
+  projects: [
+    {
+      name: "repro",
+      testMatch: "**/*.spec.ts",
+    },
+  ],
+});
diff --git a/examples/reproducers/issue-1-moderation-ui/repro.spec.ts b/examples/reproducers/issue-1-moderation-ui/repro.spec.ts
new file mode 100644
index 00000000..cb06b3c2
--- /dev/null
+++ b/examples/reproducers/issue-1-moderation-ui/repro.spec.ts
@@ -0,0 +1,39 @@
+import { expect, test } from "@playwright/test";
+
+const FIXTURE_URL = "/docs/moderation/fixtures/index.html";
+const STORAGE_KEY = "bitvid:moderation:fixture-overrides";
+const SENTINEL_KEY = "__moderationFixturesInit__";
+
+async function waitForFixtureReady(page) {
+  await page.waitForSelector('body[data-ready="true"]');
+}
+
+function setupStorageReset(page) {
+  return page.addInitScript(({ storageKey, sentinelKey }) => {
+    try {
+      const session = window.sessionStorage;
+      const local = window.localStorage;
+      if (session && !session.getItem(sentinelKey)) {
+        local?.removeItem(storageKey);
+        session.setItem(sentinelKey, "1");
+      }
+    } catch {
+      /* ignore reset failures in tests */
+    }
+  }, { storageKey: STORAGE_KEY, sentinelKey: SENTINEL_KEY });
+}
+
+test.beforeEach(async ({ page }) => {
+  await setupStorageReset(page);
+});
+
+test("show anyway button should be visible", async ({ page }) => {
+  await page.goto(FIXTURE_URL, { waitUntil: "networkidle" });
+  await waitForFixtureReady(page);
+
+  const overrideCard = page.locator('[data-test-id="show-anyway"]');
+  const showAnywayButton = overrideCard.getByRole("button", { name: "Show anyway" });
+
+  // This assertion fails in headless mode (bug)
+  await expect(showAnywayButton).toBeVisible();
+});
diff --git a/examples/reproducers/issue-2-css-lint/README.md b/examples/reproducers/issue-2-css-lint/README.md
new file mode 100644
index 00000000..7448bc98
--- /dev/null
+++ b/examples/reproducers/issue-2-css-lint/README.md
@@ -0,0 +1,17 @@
+# CSS Lint Tokens Bug Reproducer
+
+This directory contains a reproducer for the CSS linting issue where raw measurements are detected in `css/tailwind.source.css`.
+
+## Issue
+
+The `lint:tokens` check fails due to raw values (e.g., `40rem`) being used instead of design tokens.
+
+## Running the Reproducer
+
+Run the script from the repository root:
+
+```bash
+node examples/reproducers/issue-2-css-lint/repro.mjs
+```
+
+Expected result: The script should output a lint failure message and exit with a non-zero status.
diff --git a/examples/reproducers/issue-2-css-lint/repro.mjs b/examples/reproducers/issue-2-css-lint/repro.mjs
new file mode 100644
index 00000000..aa4219a3
--- /dev/null
+++ b/examples/reproducers/issue-2-css-lint/repro.mjs
@@ -0,0 +1,14 @@
+import { spawn } from 'node:child_process';
+
+console.log("Running lint:tokens to reproduce the issue...");
+const child = spawn('npm', ['run', 'lint:tokens'], { stdio: 'inherit', shell: true });
+
+child.on('exit', (code) => {
+  if (code !== 0) {
+    console.log("\nReproduced: Lint check failed as expected.");
+    process.exit(code);
+  } else {
+    console.log("\nFailed to reproduce: Lint check passed.");
+    process.exit(0);
+  }
+});