48 lines
1.6 KiB
TypeScript
48 lines
1.6 KiB
TypeScript
import { test, expect } from "@playwright/test";
|
|
|
|
test.describe("Mobile Dashboard Scroll", () => {
|
|
test.use({
|
|
viewport: { width: 390, height: 844 }, // iPhone 12 Pro size
|
|
userAgent:
|
|
"Mozilla/5.0 (iPhone; CPU iPhone OS 14_4 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Mobile/15E148 Safari/604.1",
|
|
});
|
|
|
|
test("should allow scrolling to access order form at the bottom", async ({
|
|
page,
|
|
}) => {
|
|
// 1. Navigate to dashboard
|
|
await page.goto("http://localhost:3001/dashboard");
|
|
await page.waitForLoadState("domcontentloaded");
|
|
|
|
// 2. Check Top Element (Chart)
|
|
const chart = page.locator("canvas").first();
|
|
await expect(chart).toBeVisible();
|
|
|
|
// 3. Scroll to Bottom
|
|
await page.evaluate(() => window.scrollTo(0, document.body.scrollHeight));
|
|
await page.waitForTimeout(500); // Wait for scroll
|
|
|
|
// 4. Check Bottom Element (Order Form)
|
|
// "매수하기" button is a good indicator of the order form
|
|
const buyButton = page.getByRole("button", { name: "매수하기" });
|
|
await expect(buyButton).toBeVisible();
|
|
|
|
// 5. Verify Scroll Height is greater than Viewport Height
|
|
const scrollHeight = await page.evaluate(
|
|
() => document.documentElement.scrollHeight,
|
|
);
|
|
const viewportHeight = 844;
|
|
expect(scrollHeight).toBeGreaterThan(viewportHeight);
|
|
|
|
console.log(
|
|
`Scroll Height: ${scrollHeight}, Viewport Height: ${viewportHeight}`,
|
|
);
|
|
|
|
// Capture screenshot at bottom
|
|
await page.screenshot({
|
|
path: "test-results/mobile-scroll-bottom.png",
|
|
fullPage: false,
|
|
});
|
|
});
|
|
});
|