Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Cypress_-_e2e_testing_for_Web_in__2019_.pdf
Search
Shahjada Talukdar
August 21, 2019
Programming
0
1.3k
Cypress_-_e2e_testing_for_Web_in__2019_.pdf
Shahjada Talukdar
August 21, 2019
Tweet
Share
Other Decks in Programming
See All in Programming
Vue SFCのtemplateでTypeScriptの型を活用しよう
tsukkee
3
1.5k
GCCのプラグインを作る / I Made a GCC Plugin
shouth
1
150
Java ジェネリクス入門 2024
nagise
0
600
推し活の ハイトラフィックに立ち向かう Railsとアーキテクチャ - Kaigi on Rails 2024
falcon8823
6
2.2k
Nuxtベースの「WXT」でChrome拡張を作成する | Vue Fes 2024 ランチセッション
moshi1121
1
510
現場で役立つモデリング 超入門
masuda220
PRO
12
2.9k
PLoP 2024: The evolution of the microservice architecture pattern language
cer
PRO
0
1.6k
ECSのサービス間通信 4つの方法を比較する 〜Canary,Blue/Greenも添えて〜
tkikuc
11
2.3k
Vaporモードを大規模サービスに最速導入して学びを共有する
kazukishimamoto
4
4.3k
Vitest Browser Mode への期待 / Vitest Browser Mode
odanado
PRO
2
1.7k
レガシーな Android アプリのリアーキテクチャ戦略
oidy
1
170
Vue.js学習の振り返り
hiro_xre
2
130
Featured
See All Featured
How to Think Like a Performance Engineer
csswizardry
19
1.1k
Happy Clients
brianwarren
97
6.7k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
43
6.6k
Making Projects Easy
brettharned
115
5.9k
What's in a price? How to price your products and services
michaelherold
243
12k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.1k
Building Better People: How to give real-time feedback that sticks.
wjessup
363
19k
Designing for Performance
lara
604
68k
Optimising Largest Contentful Paint
csswizardry
33
2.9k
A Tale of Four Properties
chriscoyier
156
23k
Embracing the Ebb and Flow
colly
84
4.4k
Transcript
Cypress - e2e testing for Web in 2019 21.08.2019
Shahjada Talukdar Senior Software Engineer @eBay
What is Cypress? JavaScript e2e Testing Framework
Why we need another tool? Selenium, Robots
Limitations of Selenium • Old(2004) and was not built for
the today’s modern webapps • Slow, flaky tests, not stable enough
Experience with robot • It’s hard to make dev env
• Hard to write and run tests • Local env test running is hard while development • Not sure if it’s very good for TDD
Objective ( to solve the problem ) To have a
testing environment with possibly fewer flaky tests and faster & easier dev experience.
Challenges for companies • Existing test framework(Robot) is already in
power. • Existing app(already built), harder than apps from scratch. • Need to think about the existing DevOps environment.
Current Limitations of cypress • Still pretty new ( I
think it as react’s beginning time ). • No IE support yet (they say to test with chrome and if the app works 100% means it is tested e2e so it’s a big relief too ).
Benefits(?) of Cypress • Same JS code everywhere. • Development
environment couldn’t be easier than this. • We can use our existing testing knowledge like mocha, jest, jasmine
• https://www.cypress.io/how-it-works
Old Team, Old App and We have 50 developers, what
to do? npm install
Initiate cypress for an existing app cypress open
e2e tests need to wait for the page to render
and finish the http calls Cypress does this by default ( at least they say so ) That’s why, fewer/no manual time waits
My app is developed with React(redux), Angular, Vue, Polymer, Vanilla?
Cypress does not need to know the framework. And no major application code changes for the tests to run
Demo
Features of Cypress
Time travelling Cypress takes snapshots as your tests run. Simply
hover over commands in the Command Log to see exactly what happened at each step.
Real time reloads Cypress automatically reloads whenever you make changes
to your tests. See commands execute in real time in your app.
Debuggability Stop guessing why your tests are failing. Debug directly
from familiar tools like Chrome DevTools. Our readable errors and stack traces make debugging lightning fast.
Automatic waiting Never add waits or sleeps to your tests.
Cypress automatically waits for commands and assertions before moving on. No more async hell.
Network traffic control - Easily control, stub, and test edge
cases without involving your server. You can stub network traffic however you like. - Fixtures
Screenshots and videos - View screenshots taken automatically on failure,
or videos of your entire test suite when run headlessly. - Screenshots using API
Selectors Playground
Environment Variables
Dashboard in Cypress
Comparisons - With cypress it will be less waits and
sleeps or probably close to none. Cypress is growing so fast, we can hope it will be even more stable & better.
None
Thank you Shahjada Talukdar https://shahjada.me https://twitter.com/destro_mas
Questions and discussions