Three Flavors of Pokémon - Framework Agnostic UI Testing
summary
Framework-agnostic UI tests are implemented with Cypress helpers, an assertable wrapper, and a driver pattern so the same test code runs against three implementations (React, Angular, Lit) at unit, integration and end-to-end levels. The repo contains a Pokedex app used to prove that one test body covers all three builds, that mocking an image 404 reproduces a GIF fallback bug, and that adding one line to a login driver (consent check) turns dozens of failing tests green.
AI-written summary · about
chapters (12)
- 0:00Introduction
- 1:14Identifying testing pitfalls
- 4:33Measures of high-quality tests
- 6:28Introduction to the demo
- 8:29End-to-end testing
- 12:17Integration testing
- 16:06Unit and component testing
- 19:39Helpers and the driver pattern
- 23:49Implementing driver patterns
- 30:01Applying drivers to features
- 34:36Solving defects with tests
- 36:12Summary and resources
related talks
45mCross-Framework Testing in MFs
27mFull-Circle Testing With Cypress
39mTesting, Testing, 1, 2, NaN
02h 35mTesting from 0 to 100
39mGaining Confidence with Cypress Tests
49mFrontend Testing: Mapping Out the Territory
24mScalable Testing Practices for Modern Apps
35mI Like My Tests, Like I Like My Friends, Reliable and Flake-Free