Files
intotheeast-com/tests/ui/maps.spec.js
T

44 lines
2.3 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
// @ts-check
// Tests: M1M4 — MapLibre GL canvas renders on all three map surfaces
// Requires demo data: run `make demo-load` before this suite.
const { test, expect } = require('@playwright/test');
// ── M1: Full map page renders MapLibre canvas ─────────────────────────────────
test('M1: /map page renders MapLibre GL canvas without JS errors', async ({ page }) => {
const errors = [];
page.on('pageerror', e => errors.push(e.message));
await page.goto('/trips/japan-korea-2026/map');
await expect(page.locator('canvas.maplibregl-canvas')).toBeVisible({ timeout: 10000 });
expect(errors, 'No JS errors on map page').toHaveLength(0);
});
// ── M2: Full map page — dot markers are in the DOM ───────────────────────────
test('M2: /map page has at least one dot marker', async ({ page }) => {
await page.goto('/trips/japan-korea-2026/map');
await expect(page.locator('canvas.maplibregl-canvas')).toBeVisible({ timeout: 10000 });
// Custom DOM markers are rendered as .maplibregl-marker elements
const markerCount = await page.locator('.maplibregl-marker').count();
expect(markerCount, 'At least one marker present').toBeGreaterThan(0);
});
// ── M3: Dailies mini-map renders MapLibre canvas ─────────────────────────────
test('M3: Dailies mini-map renders MapLibre GL canvas without JS errors', async ({ page }) => {
const errors = [];
page.on('pageerror', e => errors.push(e.message));
await page.goto('/trips/japan-korea-2026/dailies');
await expect(page.locator('#feed-map canvas.maplibregl-canvas')).toBeVisible({ timeout: 10000 });
expect(errors, 'No JS errors on dailies page').toHaveLength(0);
});
// ── M4: Home map renders MapLibre canvas ─────────────────────────────────────
test('M4: Home page map renders MapLibre GL canvas without JS errors', async ({ page }) => {
const errors = [];
page.on('pageerror', e => errors.push(e.message));
await page.goto('/');
await expect(page.locator('#home-map canvas.maplibregl-canvas')).toBeVisible({ timeout: 10000 });
expect(errors, 'No JS errors on home page').toHaveLength(0);
});