Bots now render as an Oo rig built once in core: nine species, styled Oo eyes, eyewear, headwear, neckwear, arms and moment props, with a level of detail per size. A shared animation frame loop moves only visible avatars and holds still under reduced motion. Claude-Session: https://claude.ai/code/session_01EKuME5CgL1ddGGN7LGvtBj Co-authored-by: Claude <noreply@anthropic.com>
30 lines
1.4 KiB
TypeScript
30 lines
1.4 KiB
TypeScript
import { expect, test } from "@playwright/test";
|
|
import { captureScreenshot } from "./helpers";
|
|
|
|
for (const theme of ["light", "dark"] as const) {
|
|
test(`Oo looks render every species with the Oo eyes (${theme})`, async ({ page }, testInfo) => {
|
|
await page.goto(`/e2e/fixtures/oo-gallery.html?theme=${theme}`);
|
|
const gallery = page.getByTestId("oo-gallery");
|
|
await expect(gallery.locator("svg[data-oo-species]")).toHaveCount(12);
|
|
for (const species of ["cat", "dog", "bunny", "bear", "robot", "ghost", "frog", "penguin"]) {
|
|
await expect(gallery.locator(`svg[data-oo-species="${species}"]`).first()).toBeVisible();
|
|
}
|
|
await expect(gallery.locator('[data-part="eye-big"]')).toHaveCount(12);
|
|
const sizes = page.getByTestId("oo-sizes");
|
|
await expect(
|
|
sizes.locator("svg[data-oo-species]").first().locator('[data-part="arm-left"]'),
|
|
).toHaveCount(0);
|
|
await expect(
|
|
sizes.locator("svg[data-oo-species]").last().locator('[data-part="arm-left"]'),
|
|
).toHaveCount(1);
|
|
await captureScreenshot(page, testInfo, `oo-gallery-${theme}`);
|
|
});
|
|
}
|
|
|
|
test("Oo keeps blinking and moving while visible", async ({ page }) => {
|
|
await page.goto("/e2e/fixtures/avatar-motion.html");
|
|
const rig = page.locator('.rakazo-bot-avatar svg[data-oo-species] [data-part="rig"]');
|
|
const first = await rig.getAttribute("transform");
|
|
await expect.poll(() => rig.getAttribute("transform")).not.toBe(first);
|
|
});
|