Introduction to Cypress

Lightning talk at E2E Test Automation Day 2019 with Selenium (Osaka)
https://seleniumjp.connpass.com/event/133553/

Transcript

1. Lightning Talk – Introduction to Cypress Jul 20, 2019 at E2E Test Automation Day with Selenium Mitsuyuki Shiiba EC Incubation Development Dept. Rakuten, Inc. tw: bufferings
2. 2 Testing Pyramid E2E Integration Unit • Slow? • Unreliable? • Hard?
3. 3 https://www.cypress.io/ "Fast, easy and reliable testing for anything that runs in a browser." Cypress doesn't use Selenium. Free / Open Source / MIT License
4. 4 Cypress Test Runner
5. 5 Cypress Test Runner Test Spec
6. 6 Cypress Test Runner Test Spec Target App
7. 7 Demo
8. 8 Easy to install, easy to run # Install everything with one command $ npm install cypress --save-dev # GUI Runner $ npx cypress open # Headless Runner $ npx cypress run
9. 9 Fast Selenium WebDriver's Architecture Test Script WebDriver Browser HTTP Control
10. 10 Fast Cypress runs in the same run-loop as your app. Test Spec Target App
11. 11 Time Travel We can check DOM snapshot for each test step.
12. 12 Automatic Waiting & Retry We can focus on what to test. it('adds 2 todos', function () { cy.visit('/') cy.get('.new-todo') .type('learn testing{enter}') .type('be cool{enter}') cy.get('.todo-list li') .should('have.length', 2) })
13. 13 Debuggability We can debug our application.
14. 14 Cypress Architecture Browser (Using same domain with proxy) NodeJS Process Reference Dominic Elm - Cypress: The future of E2E testing https://youtu.be/pXyBligMMr0?t=1107 Tests (iframe) App (iframe) Cypress Proxy OS Web Websocket Start with Proxy DOM LocalStorage ... Service Worker
15. 15 Many other good parts! • Real time reloads • Spies, stubs, and clocks • Network traffic control • Consistent results • Screenshots and videos (headless runner) • Dashboard (paid feature)
16. 16 Restrictions • Only support Chromium currently • Seem to be working on Firefox, IE, Edge • Not supported (because of its architecture) • Multiple tabs/browsers • Multiple domains in one test case
17. 17 and we want you! Let's talk about Cypress!