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
ProxyServerを使った本番環境でのE2Eテスト
Search
Taketoshi Aono(青野健利 a.k.a brn)
June 28, 2017
2
2.3k
ProxyServerを使った本番環境でのE2Eテスト
本番環境でjavascriptのE2Eテストを行った方法の説明です。
Taketoshi Aono(青野健利 a.k.a brn)
June 28, 2017
Tweet
Share
More Decks by Taketoshi Aono(青野健利 a.k.a brn)
See All by Taketoshi Aono(青野健利 a.k.a brn)
document.write再考
brn
6
3k
Parsing Javascript
brn
13
9.1k
JSON & Object Tips
brn
1
440
CA 1Day Youth Bootcamp for Frontend LT
brn
0
870
Modern TypeScript
brn
2
770
javascript - behind the scene
brn
3
710
tc39 proposals
brn
0
830
プロダクト開発とTypeScript
brn
8
2.9k
React-Springでリッチなアニメーション
brn
1
650
Featured
See All Featured
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
29
1k
Visualization
eitanlees
146
15k
Agile that works and the tools we love
rasmusluckow
328
21k
Fontdeck: Realign not Redesign
paulrobertlloyd
83
5.4k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
226
22k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.6k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
4
420
How to Ace a Technical Interview
jacobian
276
23k
Git: the NoSQL Database
bkeepers
PRO
427
64k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
28
9.3k
Product Roadmaps are Hard
iamctodd
PRO
50
11k
Bash Introduction
62gerente
611
210k
Transcript
Production E2E test with ProxyServer
せ: @brn (ꫬꅿ⨳ⵃa.k.a ـٕ٦ظ) 耵噟: ؿٗٝزؒٝسؒٝآص،٥iOSؒٝآص، ⠓爡: Cyberagent ،سذؙأةآؔRightSegment٥AI Messenger
ـؚٗ: http://abcdef.gets.b6n.ch/ Twitter: https://twitter.com/brn227 GitHub: https://github.com/brn
Why test against production? 猘ך⫴ְגְ،سذؙأةآؔדכBtoBָً؎ٝחזתׅկ ًر؍،瘝ךBtoCךؿٗٝزؒٝس㹋鄲ׅ堣⠓כ婁ו֮תׇկ ךծE2Eذأزחꟼ׃ג㼰ղ暴婊ז✲䞔ָ㢳ְדׅկ
Why test against production? ז鏬ד➙㔐כ剑㹋鄲ֿׅהָ㢳ְծ javascript SDKךE2Eذأزך׀稱➜׃ְה䙼ְתׅկ
Why is javascript SDK? ךחjavascript SDKהכוזך䭷׃גְַ׀铡僇׃תׅկ javascript SDKהכ⚺חծscriptה㼰׃ךةؚךإحزד䲿⣘ׁhtml ػ٦خדׅկ
Ⱗ⡤⢽ד鎉ֲהGoogle Analyticsךأصلحز瘝ךֿהדׅկ
Special E2E test ׁגծֿךjavascript SDKךE2Eذأزָ暴婊ַהְֲהծ 㛇劤涸חؙٓ؎،ٝزךWebل٦آח㙵鴥תֿה䲿ה׃גְ ծ涯秵ך橆㞮דE2Eذأز׃הֿדծ㹋ꥷךذأزחזז ְֿהָ㢳ְךדׅկ ך…
Solution ؙٓ؎،ٝزךWEBل٦آ♳ד 㹋ꥷחذأز׃תׅ
How? ֿװזְה… ⟃厤طحزغؙٝךؚٗ؎ٝل٦آォֹ굲ל׃ֿהָ… ⾱㔓כؙٓ؎،ٝزךل٦آח֮document.writeָChromeחـٗح ׁؙגְךדָׅծJSSDKך⚥דdocument.open׃גְծ㹋 遤ׁג׃תגل٦آָ涯秵חזג׃תגְַדׅկ
How? ֲֿזזְחذأز׃
How? ׃ַ׃ؙٓ؎،ٝزךWEBل٦آחכ㹋ꥷח劤殢ךةָؚ㙵תגֶծ ذأزׅחכֿךةؚرفٗ؎ךdev橆㞮ךךח縧ֹ䳔ִ䗳銲 ָ֮תׅկ
ProxyServer ֿדـٓؐؠהWEBل٦آךחProxyServer䮠ծ Man in the middle(⚥罏余䷼)הְֲ䩛岀欽ְג WEBل٦آ何ׂ׃תׅw
ProxyServer ➙㔐כNodejsךדծ node-mitm-proxyהְֲךך׆לזnpmٌآُ٦ٕ崞欽׃תׅկ
node-mitm-proxy ֿךٌآُ٦ٕכוֲװծ client => proxy proxy => server server =>
proxy proxy => client ךぐ穗騟ד剅ֹ䳔ִָ〳腉ז״ֲדׅկזךדծ➙㔐כծ server => proxy client => proxy ך穗騟剅ֹ䳔ִגծ劤殢؟٦غפךؙٔؒأز涪؟٦غח崧׃ծ ؟٦غַךٖأهٝأ何甑׃גرغحؚ䞔㜠㙵鴥תׅկ
Nightwatch.js E2Eذأز荈⡤כNightwatch.jsⵃ欽׃ג遤ְתׅկ Nightwatch.jsהכSelenium⢪E2Eذأزח暴⻉׃ٓ؎ـٓٔדׅկ 湫חSeleniumח鍗״ַז嚂דֹתׅկ ׁחぐـٓؐؠכselenium-dockerⵃ欽׃גⴓ侔橆㞮ד遤ְתׅկ
Images Nightwatch selenium-hub Browser Browser Browser Proxy Proxy Proxy jsךURL剅ֹ䳔ִהWEBل٦آך何甑
Development Contents Server Production Contents Server 剅ֹ䳔ִURLד،ؙإأ WEB WEBل٦آ《䖤
E2E Test ֿד劤殢橆㞮פך،ؙإأד֮זָծ 涪橆㞮ךjsؿ؋؎ٕדE2Eذأز㹋遤ֿׅהָדֹתׅկ
Problems Nightwatch.jsדFirefoxחProxy鏣㹀ְְׅ倯岀ָזְծ Firefoxדذأزָדֹגְתׇկ 湫䱸Selenium⢪ִל〳腉זךדָׅ… ֮הٌغ؎ٕ…
Summary 穠㽷荈⹛ذأزֽדؕغ٦דֹ眔㔲חכꣲ歲ָ֮תׅկ זךדծ➂⸂ד嫣鹈ذأزث٦يָذأز׃גְתׅկ 暴חٌغ؎ٕ橆㞮ך劤殢E2Eذأزָ穠圓⿑׃ְךדծז הַז傈㣄鋅גְתׅ…
Summary ׀幠耮ָ֮הֲ׀ְׂת׃կ