mirror of
https://github.com/block/buzz.git
synced 2026-10-30 22:11:36 +00:00
## Summary - apply the refreshed card layout across desktop onboarding - update identity backup, recovery, and key presentation flows - clarify AI connection choices and default model settings - simplify the backup ceremony from creation through optional verification - bring the harness and provider setup flow forward with validation, preserved state, and consistent navigation - fix action alignment and stray card scrolling in the refreshed layout ## Validation - pre-push desktop lint, typecheck, frontend tests, and native tests passed - focused onboarding Playwright coverage passed - manually reviewed the refreshed onboarding and backup flow in the native app - just ci passed all sections except one unchanged process-cleanup timing test; its exact rerun passed --------- Signed-off-by: kenny lopez <klopez4212@gmail.com> Signed-off-by: Princess Donut <b238ea756dee4d98afa5883fc7f1de61eeabe65bf700e3a5a5a80db5e42e2c2b@buzz.block.builderlab.xyz> Signed-off-by: Clay Delk <clay.delk@gmail.com> Co-authored-by: Princess Donut <b238ea756dee4d98afa5883fc7f1de61eeabe65bf700e3a5a5a80db5e42e2c2b@buzz.block.builderlab.xyz> Co-authored-by: Clay Delk <clay.delk@gmail.com>
89 lines
3.1 KiB
TypeScript
89 lines
3.1 KiB
TypeScript
import { expect, test } from "@playwright/test";
|
||
|
||
import { waitForAnimations } from "../helpers/animations";
|
||
import { installMockBridge } from "../helpers/bridge";
|
||
|
||
const HELP_SEEN_KEY = "buzz.machine-onboarding.identity-key-help-seen.v1";
|
||
|
||
test("identity key help explains the first-run choice", async ({ page }) => {
|
||
await installMockBridge(page, undefined, {
|
||
skipCommunitySeed: true,
|
||
skipOnboardingSeed: true,
|
||
});
|
||
await page.goto("/");
|
||
|
||
const trigger = page.getByTestId("identity-key-help-trigger");
|
||
// No initial opacity-0 assertion: on a slow runner the 2s reveal timer can
|
||
// fire before the first assertion runs, failing the test for the wrong
|
||
// reason. The reveal + persistence assertions below carry the coverage.
|
||
await expect(trigger).toHaveCSS("opacity", "1", { timeout: 5000 });
|
||
await expect
|
||
.poll(() =>
|
||
page.evaluate((key) => localStorage.getItem(key), HELP_SEEN_KEY),
|
||
)
|
||
.toBe("true");
|
||
|
||
await page.setViewportSize({ width: 720, height: 620 });
|
||
await trigger.click();
|
||
|
||
const dialog = page.getByTestId("identity-key-help-dialog");
|
||
await expect(dialog).toBeVisible();
|
||
await waitForAnimations(page);
|
||
await expect(
|
||
dialog.getByRole("heading", { name: "What’s an identity key?" }),
|
||
).toBeVisible();
|
||
await expect(dialog).toHaveClass(/w-full/);
|
||
await expect(page.getByTestId("dialog-overlay")).toHaveCount(0);
|
||
const dialogBounds = await dialog.boundingBox();
|
||
expect(dialogBounds).not.toBeNull();
|
||
expect(dialogBounds?.x).toBeGreaterThanOrEqual(0);
|
||
expect(
|
||
(dialogBounds?.x ?? 0) + (dialogBounds?.width ?? 0),
|
||
).toBeLessThanOrEqual(720);
|
||
|
||
await page.getByTestId("onboarding-back").click();
|
||
await expect(dialog).not.toBeVisible();
|
||
await expect(trigger).toHaveCSS("opacity", "1");
|
||
|
||
await page.reload();
|
||
await expect(page.getByTestId("identity-key-help-trigger")).toHaveCSS(
|
||
"opacity",
|
||
"1",
|
||
);
|
||
});
|
||
|
||
test("identity key help stays readable when the app resolves dark mode", async ({
|
||
page,
|
||
}) => {
|
||
await page.emulateMedia({ colorScheme: "dark" });
|
||
await installMockBridge(page, undefined, {
|
||
skipCommunitySeed: true,
|
||
skipOnboardingSeed: true,
|
||
});
|
||
await page.goto("/");
|
||
|
||
// Fresh profiles follow the system scheme, so the emulated dark scheme is
|
||
// the first-run repro: the app resolves the dark theme while onboarding.
|
||
await expect
|
||
.poll(() =>
|
||
page.evaluate(() => document.documentElement.classList.contains("dark")),
|
||
)
|
||
.toBe(true);
|
||
|
||
const trigger = page.getByTestId("identity-key-help-trigger");
|
||
await expect(trigger).toHaveCSS("opacity", "1", { timeout: 5000 });
|
||
await trigger.click();
|
||
|
||
const dialog = page.getByTestId("identity-key-help-dialog");
|
||
await expect(dialog).toBeVisible();
|
||
await waitForAnimations(page);
|
||
|
||
// The textured powder card is baked light in both themes, so the dialog pins
|
||
// the neutral onboarding theme to its light variant. Without the pin the
|
||
// dark theme flips --foreground to near-white and the title disappears
|
||
// against the white card.
|
||
await expect(
|
||
dialog.getByRole("heading", { name: "What’s an identity key?" }),
|
||
).toHaveCSS("color", "rgb(23, 23, 23)");
|
||
});
|