Menú
Frontend testing guide — unit, integration, visual regression, accessibility, E2E for UI
Instalar con Codex o Claude Copia este prompt, pégalo en Codex, Claude u otro asistente, y deja que revise la página de la skill y la instale por ti.
Basado en la clasificación ocupacional SOC
| name | frontend-testing |
| version | 1.0.0 |
| description | Frontend testing guide — unit, integration, visual regression, accessibility, E2E for UI |
| requires | [] |
| task_types | ["testing","frontend-testing","qa","e2e"] |
| applies_to_tags | ["testing","frontend","qa","playwright","vitest","cypress"] |
renderHook)// Arrange
const input = { ... }
// Act
const result = fn(input)
// Assert
expect(result).toEqual(expected)
"returns empty array when no results match"render(<TaskCard task={mockTask} />)
// Query bằng role/label — không dùng test-id trừ khi cần
expect(screen.getByRole('heading', { name: 'Fix bug' })).toBeVisible()
await userEvent.click(screen.getByRole('button', { name: 'Claim' }))
expect(mockClaim).toHaveBeenCalledWith(taskId)
getByRole — accessible namegetByLabelText — form fieldsgetByText — visible textgetByTestId — last resortpage.getByRole thay selectors CSSsleeptest('user can claim a task', async ({ page }) => {
await page.goto('/board')
await page.getByRole('button', { name: 'Claim' }).first().click()
await expect(page.getByText('In Progress')).toBeVisible()
})
waitForSelector / waitForResponseimport { axe } from 'jest-axe'
const { container } = render(<Component />)
const results = await axe(container)
expect(results).toHaveNoViolations()
| Loại | Minimum |
|---|---|
| Utility functions | 95% |
| Hooks | 85% |
| Components (branch) | 80% |
| Critical user paths (E2E) | 100% |
Backend testing guide — unit, integration, API contract, database, load testing
Backend development guide — API design, data modeling, business logic, security, performance
Codebase second brain workflow for AI agents — use repo maps and capability maps before deep code reads
Multi-agent coordination skill — task decomposition, dependency tracking, handoff protocol, conflict resolution
Frontend development guide — UI implementation, component architecture, state management, performance
Project management skill — sprint planning, backlog grooming, risk management, reporting, stakeholder communication