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 ruleP1universalStack: testing
vi.mockbrowser-modemockingminimal-mocks
Mock the module that actually breaks in the test environment, not its harmless parent
When a component tree cannot render in the test runner, find the exact module that touches the unavailable API (process.env, node-fetch, fs) and stub that one; mocking a harmless wrapper above it hides real markup from the test and over-mocks.
PR: hegnar-web#4698 FCK-3550 review round 2Created: Sep 8, 2026
Bad example
Old codets
| 1 | // stubs the whole wrapper, so its real markup is never rendered |
| 2 | vi.mock(import('./ZephrFeatureWithPlaceholder.tsx'), () => ({ default: () => <div /> })); |
Explanation (EN)
Objašnjenje (HR)
Good example
New codets
| 1 | // ZephrFeature is the one that reads process.env, stub only that |
| 2 | vi.mock(import('#/server/components/ZephrFeature.tsx'), () => ({ |
| 3 | default: ({ featureId }) => <div data-testid="zephr-feature" data-name={featureId} />, |
| 4 | })); |
Explanation (EN)
Objašnjenje (HR)
Notes (EN)
Verify empirically which module fails (run the test without the mock and read the stack trace) instead of guessing from import lists.