playwright-best-practices
Обзор тестов Playwright на соответствие лучшим практикам
Тесты Playwright часто страдают от нестабильности, медленного выполнения и плохой поддерживаемости. Этот skill проводит анализ тестового кода TypeScript на соответствие более чем 40 проверенным лучшим практикам, организованным в 8 категорий, предоставляя конкретные предложения по улучшению с понятными примерами.
스킬 ZIP 다운로드
Claude에서 업로드
설정 → 기능 → 스킬 → 스킬 업로드로 이동
토글을 켜고 사용 시작
테스트해 보기
"playwright-best-practices" 사용 중입니다. Review the following Playwright test code: ```typescript test('login test', async ({ page }) => { await page.goto('https://example.com'); await page.waitForTimeout(2000); await page.click('.submit-button'); const isVisible = await page.locator('.welcome').isVisible(); expect(isVisible).toBe(true); }); ```
예상 결과:
Found 2 issues in the test:
1. **Manual waitForTimeout** (Line 3)
- Issue: Using `waitForTimeout(2000)` causes flakiness and wastes time
- Impact: HIGH - Leads to unreliable tests and slow execution
- Fix: Use Playwright's built-in auto-waiting or explicit waits for network events
2. **Generic expect without auto-waiting** (Line 5)
- Issue: `expect(isVisible).toBe(true)` doesn't auto-retry
- Impact: HIGH - Can fail intermittently when element isn't ready
- Fix: Use `await expect(page.locator('.welcome')).toBeVisible()`
"playwright-best-practices" 사용 중입니다. Check my locators for best practices: ```typescript const submitButton = page.locator('button.submit-btn:nth-child(2)'); const userName = page.locator('div.container > div.content > span.name'); ```
예상 결과:
Found 2 locator issues:
1. **Position-based CSS selector**
- Issue: `button.submit-btn:nth-child(2)` is fragile and breaks on UI changes
- Impact: HIGH - Tests fail when button order changes
- Fix: Use role-based locator like `page.getByRole('button', { name: 'Submit' })`
2. **Deep CSS chain**
- Issue: `div.container > div.content > span.name` is brittle and couples to DOM structure
- Impact: MEDIUM - Breaks on any structural refactoring
- Fix: Use semantic locators like `page.getByText('User Name')` or ARIA roles
보안 감사
낮은 위험This is a documentation-only skill containing markdown files with code examples. All static findings are false positives - patterns detected in documentation code blocks, not executable code. The skill provides guidelines for Playwright test best practices and does not execute arbitrary code, make network requests to external services, or access sensitive files.
낮은 위험 문제 (4)
위험 요인
⚡ 스크립트 포함
🌐 네트워크 접근 (1)
📁 파일 시스템 액세스 (1)
🔑 환경 변수 (1)
⚙️ 외부 명령어 (1)
품질 점수
만들 수 있는 것
QA инженер проверяет существующие тесты
QA инженер хочет провести аудит своего набора тестов Playwright на предмет проблем стабильности и поддерживаемости перед развертыванием в производство.
Разработчик рефакторит устаревшие тесты
Разработчик выполняет рефакторинг устаревших тестов Selenium в Playwright и хочет получить руководство по правильным паттернам и антипаттернам, которых следует избегать.
Проверка качества в CI/CD pipeline
Команда хочет автоматически проверять, что новые тестовые вклады соответствуют установленным лучшим практикам перед слиянием.
이 프롬프트를 사용해 보세요
Проверьте мои тесты Playwright в {file_path} на соответствие лучшим практикам. Проверьте проблемы, такие как отсутствие автоматического ожидания, правильное использование assertions и стратегии локаторов.Проведите аудит всех тестов Playwright в директории {directory} на соответствие рекомендациям по лучшим практикам. Для каждой найденной проблемы объясните, что не так, почему это важно, и предоставьте исправленный пример.Проверьте, правильно ли мои тесты используют веб-ориентированные assertions. Найдите случаи, когда используется общий expect() вместо веб-ориентированных assertions, таких как toBeVisible(), toHaveText() и toHaveCount().
Проверьте мои тесты Playwright на проблемы производительности. Проверьте медленные селекторы, отсутствие паттернов Page Object Model, отсутствие конфигурации параллельного выполнения и ненужные ожидания. Предложите конкретные улучшения с примерами кода.
모범 사례
- Всегда используйте веб-ориентированные assertions (toBeVisible, toHaveText, toHaveCount) вместо общего expect с извлеченными значениями — они автоматически ожидают и повторяют попытки
- Предпочитайте ролевые локаторы (getByRole, getByText, getByLabel) селекторам CSS/XPath — они более устойчивы к изменениям в UI
- Никогда не используйте ручные ожидания, такие как waitForTimeout — полагайтесь на встроенное в Playwright автоматическое ожидание или явные ожидания сетевых событий
피하기
- Использование общего expect() с вручную извлеченными значениями DOM вместо веб-ориентированных assertions
- Использование позиционных CSS селекторов или хрупких XPath выражений вместо семантических ролевых локаторов
- Добавление произвольных задержек сна вместо правильного автоматического ожидания или явных условных ожиданий