test: add ability to do visual regression tests#42
Conversation
There was a problem hiding this comment.
Reviewed Changes
Managerbot reviewed 3 out of 8 changed files in this pull request and generated 4 comments.
Files not reviewed (5)
- .gitignore
- package-lock.json
- package.json
- _config.yml
- tests/__snapshots__/visual-regression.spec.ts/home-page.png
Comments suppressed due to low confidence (0)
| snapshotPathTemplate: '{testDir}/__snapshots__/{testFilePath}/{arg}{ext}', | ||
| expect: { | ||
| toHaveScreenshot: { | ||
| maxDiffPixelRatio: 0.01, |
There was a problem hiding this comment.
Consider using a lower tolerance value for maxDiffPixelRatio. 0.01 (1%) might still allow noticeable visual differences to pass. Depending on your UI complexity, values between 0.001-0.005 might be more appropriate.
| try { | ||
| await expect(page).toHaveScreenshot('home-page.png', { | ||
| fullPage: true, | ||
| maxDiffPixelRatio: 0.01, |
There was a problem hiding this comment.
This duplicates the maxDiffPixelRatio setting that's already in the global config. Consider removing it here to keep configuration in one place.
| await page.goto('/'); | ||
|
|
||
| // Wait for the page to be fully loaded | ||
| await page.waitForLoadState('networkidle'); |
There was a problem hiding this comment.
networkidle can be flaky for pages with continuous background activity. Consider adding additional stabilization checks or a fixed timeout if needed.
| }); | ||
|
|
||
| // Test passed - remove diff image if it exists | ||
| if (fs.existsSync(DIFF_IMAGE)) { |
There was a problem hiding this comment.
Consider wrapping file operations in try/catch blocks to handle potential file system errors gracefully.
No description provided.