Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
Selenium あるある
seya
May 30, 2018
Programming
0
1.4k
Selenium あるある
seya
May 30, 2018
Tweet
Share
More Decks by seya
See All by seya
なぜ私はコードをデザインに使いたいのか
kazuyaseki
8
2.8k
フロントエンド開発のための Figma
kazuyaseki
17
20k
PWAに取り組む前に知っておきたい SPAとSEO
kazuyaseki
9
3.3k
State of SEO for SPA 2018
kazuyaseki
8
4k
Vue コンポーネント実装パターン
kazuyaseki
16
3.2k
Other Decks in Programming
See All in Programming
GoogleI/O2022 LT報告会資料
shinsukefujita1126
0
280
GitHubのユーザー名を変更した後のあれこれ
tahia910
0
120
エンジニアによる事業指標計測のススメ
doyaaaaaken
1
180
Mobile Product Engineering
championswimmer
0
290
Running Laravel/PHP on AWS (AWS Builders Day Taiwan 2022)
dwchiang
0
130
Value and Record Types
hschwentner
0
540
Improving Developer Experience Through Tools and Techniques 2022
krzysztofzablocki
0
430
EFFICIENT CREATION OF AN EMPTY COLLECTION IN .NET
abt
0
150
Treasure.map(): Functional programming in JVM-based languages
paranoidmonoid
0
130
Node.jsデザインパターンを読んで
mmmommm
0
1.8k
即、New Relic / New Relic NOW!
uzulla
0
270
git on intellij
hiroto_kitamura
0
160
Featured
See All Featured
Atom: Resistance is Futile
akmur
255
20k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
224
49k
Art, The Web, and Tiny UX
lynnandtonic
280
17k
StorybookのUI Testing Handbookを読んだ
zakiyama
5
2.2k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
151
13k
Keith and Marios Guide to Fast Websites
keithpitt
404
21k
Pencils Down: Stop Designing & Start Developing
hursman
112
9.8k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
498
130k
Why Our Code Smells
bkeepers
PRO
324
55k
10 Git Anti Patterns You Should be Aware of
lemiorhan
638
52k
Designing on Purpose - Digital PM Summit 2013
jponch
106
5.6k
Embracing the Ebb and Flow
colly
73
3.4k
Transcript
Selenium 失敗あるある @D‑Cube 【自動化】ワーストプラクティス ~まずはやってみる~
自己紹介
E2E自動化、やってますか?
私はやったことがあります
1ヶ月半かけてSeleniumの勉強 + 設計と実装 を経て
ついに完成!!!
しかし…
ものの数ヶ月で使われなくなり、私が初めて 作った自動テストスイートはゴミと化しまし た。
本日は当時を振り返って失敗の原因と そこから得られる教訓を語ります。
原因1. 信頼性のないテスト
Seleniumのテストは "タイミング次第" で落 ちる。
前提としてSeleniumでテストを書く際には様々な状況でDOMを選択す る必要があります。 この時問題になるのが、まだ存在していないDOMを選択しようとしてテ ストが失敗することで、これがまた結構な頻度で起こる。
これを防ぐためには、起きる可能性がある部分(大抵はページ遷移後の タイミング)にそのDOMがマウントするまで待つような処理を挟む browser.waitUntil( () => browser.isExisting(".search-field"); );
しかし疲れてきた私は…
browser.pause(300);
それでも…
None
↓ 私
結論 信頼性のないテストはゴミ
教訓 ページロードや非同期処理を待つことが手軽にできる Cypressなどのツールを検討してみよう。
原因2. マルチブラウザ対応を頑張ってしまう
対応しようとしたブラウザ
EdgeのDriverで click が動作しない Excpetion "org.openqa.selenium.WebDriverException: Element is obscured "
clickイベントを注入するJSでwrapすること によって無事解決 browser.click = selector => browser.selectorExecute(selector, element => element[0].click());
FirefoxでActionクラスが存在しない 要するにDrag & Dropとかができない。
Drag & Dropイベントを注入するJSで(ry browser.execute(function (selectorDrag, selectorDrop) { // function for
triggering mouse events var fireMouseEvent = function (type, elem, centerX, centerY var evt = document.createEvent('MouseEvents'); evt.initMouseEvent(type, true, true, window, 1, 1, 1, centerX elem.dispatchEvent(evt); }; var elemDrag = document.querySelector(selectorDrag); var elemDrop = document.querySelector(selectorDrop); if (!elemDrag || !elemDrop) return false; var pos = elemDrag.getBoundingClientRect(); var center1X = Math.floor((pos.left + pos.right) / 2); ・ ・ ・
信じられるのはChromeだけ…
教訓 マルチブラウザテストで見たい観点は何かを考えよう。 違うブラウザでJSの挙動が違うということは最近ではあまりなくなっ た。自動テストは一ブラウザだけで、ブラウザ間の差異を見るのはシナ リオテストを手動で見る、みたいなキリであれば現実的かもしれない。
原因3. メンテナンスコストをなめてた
メンテナンスはとても大変 テストケースのアップデート テストコードのアップデート selectorが変わった時壊れまくる… 変更の影響範囲をちゃんと連携しないクソ開発者(私)
業務にちゃんと組み込ませることを最初から意識する。 経験ある人がいないのであれば、スモールスタートで始めるのでも価値 があると思う。 (よくいじられるところ1ページ選んで、そこだけ導入するとか) 慣れてきてハマりそうだと確信したら対象範囲を増やすとか。
あと E2Eの自動化はとても片手間でできるものでは ない
教訓 優秀なテストエンジニアを雇おう!
ご静聴ありがとうございました。