메뉴
Guide for writing end to end tests using plawright. Use this when asked to write an end-to-end-test.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
How map movement, state, and geolocation work. Use this when modifying the map, its position/zoom, URL sync, or geolocation behaviour.
Official integration patterns for Mapbox GL JS across popular web frameworks (React, Vue, Svelte, Angular). Covers setup, lifecycle management, token handling, search integration, and common pitfalls. Based on Mapbox's create-web-app scaffolding tool.
Performance optimization patterns for Mapbox GL JS web applications. Covers initialization waterfalls, bundle size, rendering performance, memory management, and web optimization. Prioritized by impact on user experience.
| name | writing-e2e-tests |
| description | Guide for writing end to end tests using plawright. Use this when asked to write an end-to-end-test. |
Dies ist das Frontend für Wheelmap.org, eine Plattform zur Erfassung der Barrierefreiheit von öffentlichen Orten. Stack: Next.js 14, React 18, TypeScript, Playwright, Mapbox GL.
e2e/ Verzeichnis)pnpm test oder pnpm exec playwright testnpx playwright show-reportnpx playwright test --debugnpx playwright test e2e/dateiname.spec.tsnpx playwright test --project=chromiumCI_TEST_DEPLOYMENT_BASE_URL oder TEST_DEPLOYMENT_BASE_URLretain-on-failure)// Standard-Import
import { test, expect } from './lib/axe-test'; // Inkludiert Accessibility-Testing
import getBaseURL from './lib/base-url';
import { skipOnboarding } from './skipOnboarding';
// Test-Setup
test.beforeEach(async ({ page }) => {
await page.goto(baseURL);
await skipOnboarding(page);
});
// Test schreiben
test('beschreibung', async ({ page }) => {
// Playwright-Selektoren bevorzugen: page.getByRole() > page.locator()
await expect(page.getByRole('button', { name: 'Submit' })).toBeVisible();
});
page.getByRole() mit ARIA-Labels bevorzugen - nie page.locator()!page.waitForLoadState() nach NavigationskipOnMobiles() / skipOnDesktops() aus ./lib/device-typemakeAxeBuilder() Fixture für automatisierte Accessibility-Checkse2e/test-data//buildings/way:23517902nodes/vnDZSz73newE2WmnJnodes/385610010612003215733659311213356985075012beta - Neue Branches normalerweise von beta abzweigen... (Asana #TASK_GID)https://app.asana.com/0/PROJECT_GID/TASK_GID → GitHub-Asana Integration zeigt PR als Kartemcp_asana_asana_update_taskhttps://github.com/sozialhelden/wheelmap-frontend/pull/123# Workspaces auflisten
mcp_asana_asana_list_workspaces
# Tasks in Projekt suchen
mcp_asana_asana_search_tasks workspace_gid="1200321573365931" project_gid="1213356985075012"
# Task Details abrufen
mcp_asana_asana_get_task task_gid="TASK_GID"
# Task aktualisieren
mcp_asana_asana_update_task task_gid="TASK_GID" opt_fields="..."
pnpm install
pnpm dev
# App läuft unter http://localhost:3000
pnpm lint # ESLint + Next.js Lint
pnpm format # Code formatieren
pnpm transifex:push # Neue Strings zu Transifex pushen
.module.css oder SCSSsrc/components/icons/