Files
Portfolio/tests/browser/bfcache-lifecycle.spec.ts

88 lines
3.0 KiB
TypeScript

import { expect, test } from "../helpers/serve-dist";
import {
dispatchPersistedPageTransition,
installSceneInstrumentation,
readSceneInstrumentation,
} from "../helpers/scene-instrumentation";
test.beforeEach(async ({ page }) => installSceneInstrumentation(page));
test("synthetic persisted freeze and restore keeps at most one canvas, RAF loop, and audio context", async ({
page,
distUrl,
}) => {
await page.goto(distUrl, { waitUntil: "domcontentloaded" });
await expect(page.locator(".journey-world")).toHaveAttribute(
"data-scene-state",
"running",
);
await page.getByRole("button", { name: "PLAY SOUNDTRACK" }).click();
await expect(page.getByRole("button", { name: "Mute sound" })).toBeVisible();
for (let cycle = 0; cycle < 3; cycle += 1) {
await dispatchPersistedPageTransition(page, "pagehide");
await expect
.poll(
async () =>
(await readSceneInstrumentation(page)).activeAnimationFrames,
)
.toBe(0);
await dispatchPersistedPageTransition(page, "pageshow");
await expect(page.locator(".journey-world")).toHaveAttribute(
"data-scene-state",
"running",
);
await expect
.poll(
async () =>
(await readSceneInstrumentation(page)).activeAnimationFrames,
)
.toBeLessThanOrEqual(1);
}
const state = await readSceneInstrumentation(page);
expect(state.maximumCanvasCount).toBe(1);
expect(await page.locator(".journey-canvas").count()).toBe(1);
expect(state.audioContextsConstructed).toBe(1);
expect(state.liveAudioContexts).toBeLessThanOrEqual(1);
});
test("persisted lifecycle events preserve paused and Static states without duplicate resources", async ({
page,
distUrl,
}) => {
await page.goto(distUrl, { waitUntil: "domcontentloaded" });
await expect(page.locator(".journey-world")).toHaveAttribute(
"data-scene-state",
"running",
);
await page.getByRole("button", { name: "Play soundtrack" }).click();
await page.getByRole("button", { name: "Pause motion" }).click();
await dispatchPersistedPageTransition(page, "pagehide");
await dispatchPersistedPageTransition(page, "pageshow");
await expect(page.locator(".journey-canvas")).toHaveCount(1);
await expect(
page.getByRole("button", { name: "Resume motion" }),
).toBeVisible();
await page.getByRole("button", { name: "Drive settings" }).click();
await page.getByLabel("Quality control").selectOption("static");
await dispatchPersistedPageTransition(page, "pagehide");
await dispatchPersistedPageTransition(page, "pageshow");
await expect(page.locator(".journey-canvas")).toHaveCount(0);
await expect(
page.getByRole("button", { name: "Enable motion" }),
).toBeVisible();
const state = await readSceneInstrumentation(page);
expect(state.maximumCanvasCount).toBeLessThanOrEqual(1);
await expect
.poll(
async () => (await readSceneInstrumentation(page)).activeAnimationFrames,
)
.toBe(0);
expect(state.audioContextsConstructed).toBe(1);
expect(state.liveAudioContexts).toBe(1);
});