Using Cypress to test a Vue Site with Ademola Bhadmus (Pt 2)
summary
Live coding shows a Vue site tested with Cypress from init to assertions: creates package.json, installs Cypress, tweaks config like baseUrl and defaultCommandTimeout, and adds a beforeEach visit hook. Tests type "Dynamic naming" into the search input and press Enter, switch strict have.text to forgiving contain, and fix autosave issues. Dropdowns require trigger('mouseenter') or a plugin, and new tabs are handled by invoking or removing target attributes such as invoke('attr','target','_self') so the flow stays in the runner.
AI-written summary · about
chapters (7)
- 0:00Introduction
- 3:56Cypress setup for Vue
- 5:22Testing search
- 17:05Multi-tab navigation
- 31:13Dropdown menu tests
- 35:12Q&A
- 41:57Closing
related talks
48mComponent Testing with Vite, Vue, and Cypress
53mTesting with Vite and the Cypress Component Test Runner
25mTesting Vue Components with Cypress
23mGaining Confidence with Cypress Tests
30mIntroducing Component Testing with Cypress
39mGaining Confidence with Cypress Tests
32mGaining Confidence with Cypress Tests
22mCypress Component Testing