Files
863e8a6f9a tests: mock CGW APIs in visual tests for deterministic screenshots (#7206)
* tests: mock CGW APIs in visual tests for deterministic Chromatic screenshots

25 of 33 visual tests hit the live staging API, causing non-deterministic
screenshots due to changing token prices, balances, and fiat values.

Add mockVisualTestApis() helper that intercepts all CGW endpoints with
shared MSW fixture data (via symlink). Each visual test calls it in
beforeEach(); tests needing specific data override with their own
cy.intercept() after (Cypress last-registered-wins).

* tests: remove functional assertions from visual tests

Visual tests exist solely to load a screen for Chromatic to screenshot.
They should never fail due to data assertions or functional validation.

Removed:
- cy.contains() assertions checking data-dependent values (sepoliaEther)
- cy.contains() assertions checking page headings (can break if text changes)
- Functional assertions: verifyErrorMsgInvalidAddress, verifyNumberErrorValidation,
  checkTimeDropdownOptions, verifyBatchIconCount, verifyRandomStringAddress,
  verifyTooltipMessage, verifyIncorrectAddressErrorMessage,
  verifyEmptyOwnerNameNotAllowed, checkMultichainSubSafeExists
- Stale selector: notifications.notificationsTitle pointed to wrong component
- cy.get().should('be.visible') assertions used as page-load signals

Kept:
- Navigation actions that set up visual state (typing invalid data, clicking buttons)
- main.verifySkeletonsGone() as the canonical page-loaded signal
- main.waitForMuiAnimationsToSettle() for animation settling

* tests: deterministic visual regression tests for Chromatic

- Pin app version and commit hash in visual regression builds
- Mock CGW APIs (chain config, safe info, balances, portfolio) for deterministic screenshots
- Return deterministic safe name when VISUAL_REGRESSION_BUILD is set
- Fix appsEndpoint glob matching /settings/safe-apps page route
- Add clickOnTokenselectorAndSelectToken for mock-compatible token selection
- Remove skeleton assertion from awaitVisualStability

---------

Co-authored-by: Hanzo Dev <[email protected]>
2026-02-19 20:16:47 +01:00

37 lines
1.2 KiB
JavaScript

import * as constants from '../../support/constants.js'
import * as main from '../pages/main.page.js'
import { getSafes, CATEGORIES } from '../../support/safes/safesHandler.js'
import { mockVisualTestApis } from '../../support/visual-mocks.js'
let staticSafes = []
describe('[VISUAL] Settings pages screenshots', { defaultCommandTimeout: 60000, ...constants.VISUAL_VIEWPORT }, () => {
before(async () => {
staticSafes = await getSafes(CATEGORIES.static)
})
beforeEach(() => {
mockVisualTestApis()
})
it('[VISUAL] Screenshot setup page', () => {
cy.visit(constants.setupUrl + staticSafes.SEP_STATIC_SAFE_4)
main.awaitVisualStability()
})
it('[VISUAL] Screenshot appearance settings page', () => {
cy.visit(constants.appearanceSettingsUrl + staticSafes.SEP_STATIC_SAFE_4)
main.awaitVisualStability()
})
it('[VISUAL] Screenshot modules page', () => {
cy.visit(constants.modulesUrl + staticSafes.SEP_STATIC_SAFE_4)
main.awaitVisualStability()
})
it('[VISUAL] Screenshot notifications settings page', () => {
cy.visit(constants.notificationsUrl + staticSafes.SEP_STATIC_SAFE_4)
main.awaitVisualStability()
})
})