Cross-Framework Testing in MFs
summary
A concrete recipe for making UI tests agnostic across React and Angular micro frontends using Cypress, NX monorepo, the Poke API backend and composed drivers that wrap Cypress helper calls and an assertable abstraction. Tests run as end‑to‑end, integration (mocking responses) and component mounts, use randomly generated data, and catch the bug where clicking Next fires extra requests. Dozens of failing tests become green after adding one line in the integration driver, and a gradual 18‑month rollout uses test driver pattern and TS stubber for lightweight stubs.
AI-written summary · about
chapters (12)
- 0:00Introduction and speakers
- 2:15What is cross framework testing
- 8:22Pitfalls in UI testing
- 10:53Pokémon app architecture
- 14:20End-to-end testing demo
- 17:55Component testing approach
- 20:43Test helpers and drivers
- 28:54Driver composition
- 33:10Fixing failing tests
- 34:36Key principles summary
- 36:46Adopting the patterns
- 37:30Q&A session
related talks
38mFrontend Tests: what nobody said to you
40mThree Flavors of Pokémon - Framework Agnostic UI Testing
39mGaining Confidence with Cypress Tests
49mFrontend Testing: Mapping Out the Territory
26mNx + Cypress Like Peanut Butter & Jelly
54mCypress: Your Automated Sous Chef
29mEnd-to-end Testing Is Hard - But It Doesn't Have to Be
27mFull-Circle Testing With Cypress