cern-sis / issues-inspire

0 stars 0 forks source link

Change image snapshots to code snapshots in Cypress tests #447

Open karolina-siemieniuk-morawska opened 4 months ago

karolina-siemieniuk-morawska commented 4 months ago

Due to ongoing issue with visual testing (https://github.com/cern-sis/issues-inspire/issues/364), we should give up on comparing screenshots and switch to comparing snapshots of DOM tree instead. Most reliable tool for that will be a plugin directly from cypress: @cypress/snapshot

karolina-siemieniuk-morawska commented 4 months ago

TECH NOTES:

  1. Install @cypress/snapshot plugin in e2e folder
  2. In index.js add require('@cypress/snapshot').register()
  3. Change all (...).matchSnapshots() assertions to cy.get('body').snapshot()
  4. Remove onlyOn('headless') rule as it will not be needed anymore
  5. Run all tests to create snapshots
  6. Run tests locally and on CI to make sure it works
karolina-siemieniuk-morawska commented 4 months ago

Try: https://argos-ci.com/docs/quickstart/cypress