Rules Hub
Coding Rules Library
← Back to all rules
Rule priority, scope & exceptions
Use this to align rules with the senior-level structure (P0/P1/P2, scope, exceptions/tradeoffs).
frontend ruleP1stack specificStack: testing
vitestbrowser-modereacttesting-library
Write component tests in the browser-mode runner, not a DOM emulator
When the project runs a real-browser test runner, new component specs go there (`*.browser.spec.tsx`, `vitest/browser`) instead of the legacy happy-dom/jsdom project and `@testing-library/*`.
PR: hegnar-web#4698 FCK-3550 Drive ad suppression from the article flagCreated: Sep 7, 2026
Bad example
Old codets
| 1 | // Foo.spec.tsx |
| 2 | import { render } from '@testing-library/react'; |
| 3 | const { container } = render(<Foo />); |
Explanation (EN)
Objašnjenje (HR)
Good example
New codets
| 1 | // Foo.browser.spec.tsx |
| 2 | import { page } from 'vitest/browser'; |
| 3 | const { container } = await page.render(<Foo />); |
Explanation (EN)
Objašnjenje (HR)
Notes (EN)
DOM emulators drift from real browsers and the project treats them as legacy; browser mode also ships the jest-dom style matchers.