Add minimal reproducer for Moderation UI bug

- Adds examples/reproducers/issue-moderation-ui/repro.spec.ts
- Adds examples/reproducers/issue-moderation-ui/README.md
- Adds examples/reproducers/issue-moderation-ui/playwright.config.ts
- Reproduces failure in 'Show anyway' button visibility check
This commit is contained in:
google-labs-jules[bot] committed 2026-01-26 12:37:03 +00:00
1 parent 5b3d72bbba
commit 5f1f659308
3 files changed
+111

No files matched your search

@@ -0,0 +1,19 @@
# Moderation UI "Show Anyway" Bug Reproducer
This reproducer demonstrates the failure of the "Show anyway" button visibility check and click action in the moderation UI fixtures.
## Issue Description
In the moderation UI tests, the "Show anyway" button fails to be visible or clickable in the test environment (headless mode), even though the logic seems correct. This prevents verifying the "show anyway" override functionality.
## Running the Reproducer
To run the reproducer script:
```bash
npx playwright test examples/reproducers/issue-moderation-ui/repro.spec.ts
```
## Expected Result
The test should fail with a timeout waiting for the "Show anyway" button to be visible or clickable.
@@ -0,0 +1,23 @@
import baseConfig from '../../../playwright.config.ts';
import { defineConfig } from '@playwright/test';
import path from 'path';
import { fileURLToPath } from 'url';
const __dirname = path.dirname(fileURLToPath(import.meta.url));
const repoRoot = path.resolve(__dirname, '../../..');
export default defineConfig({
...baseConfig,
testDir: './',
webServer: {
...baseConfig.webServer,
cwd: repoRoot,
},
projects: [
{
name: 'repro',
testMatch: '**/*.spec.ts',
use: baseConfig.projects?.[0]?.use,
},
],
});
@@ -0,0 +1,69 @@
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__";
const RESTORE_BUTTON_LABEL = "Restore default moderation";
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.afterEach(async ({ page }) => {
try {
await page.evaluate(({ key, sentinel }) => {
window.localStorage?.removeItem(key);
window.sessionStorage?.removeItem(sentinel);
}, { key: STORAGE_KEY, sentinel: SENTINEL_KEY });
} catch {
// ignore cleanup errors when page already closed
}
});
test.describe("moderation fixtures reproducer", () => {
test("show anyway override persists across reloads", async ({ page }) => {
await page.goto(FIXTURE_URL, { waitUntil: "networkidle" });
await waitForFixtureReady(page);
const overrideCard = page.locator('[data-test-id="show-anyway"]');
const thumbnail = overrideCard.locator('img[data-video-thumbnail]');
await expect(overrideCard).toHaveAttribute(
"data-moderation-override-available",
"true"
);
const showAnywayButton = overrideCard.getByRole("button", { name: "Show anyway" });
const restoreButtonQuery = overrideCard.getByRole("button", {
name: RESTORE_BUTTON_LABEL,
});
await expect(overrideCard).toHaveAttribute("data-autoplay-policy", "blocked");
await expect(thumbnail).toHaveAttribute("data-thumbnail-state", "blurred");
// Uncommenting the failing check to reproduce the bug
await expect(showAnywayButton).toBeVisible();
await expect(restoreButtonQuery).toHaveCount(0);
// Uncommenting the failing action to reproduce the bug
await showAnywayButton.click({ force: true });
});
});