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
ココがすごいぜ!Playwright Component Test
Search
rakus frontend
April 17, 2024
Technology
640
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
ココがすごいぜ!Playwright Component Test
rakus frontend
April 17, 2024
More Decks by rakus frontend
See All by rakus frontend
新卒FEが1年目に取り組んだこと・学んだこと
rakus_fe
0
59
ErrorBoundaryとSuspenseの導入検討
rakus_fe
1
840
日付をもう少し真面目に勉強中
rakus_fe
0
57
React19 β をざっと見る
rakus_fe
0
370
Reactのパフォーマンス改善例
rakus_fe
0
610
Typescript5.4の新機能
rakus_fe
0
360
非破壊的な配列メソッド
rakus_fe
0
430
スプレッドシートのセル結合がつらいので足掻いてみた話
rakus_fe
0
300
Other Decks in Technology
See All in Technology
Sansan Engineering Unit 紹介資料
sansan33
PRO
1
5k
The Django UUID Story - DjangoCon US 2026
pauloxnet
0
310
Oracle AI Databaseデータベース・サービス: BaseDB/ExaDB-Dの可用性
oracle4engineer
PRO
1
960
Eight Engineering Unit 紹介資料
sansan33
PRO
3
8.3k
紙 to デジタル
ichien178
0
360
All About Sansan – for New Global Engineers
sansan33
PRO
1
1.5k
IHV like なユースケースへのOpenID Connect 関連仕様の適用事例
optim
0
360
名刺メーカーDevグループ 紹介資料
sansan33
PRO
0
1.2k
Introduction to Sansan for Engineers / エンジニア向け会社紹介
sansan33
PRO
6
77k
ClaudeCodeでセキュリティ監視業務を半自動化_1年の運用でわかったAIに任せる設計の5つのポイント
kintotechdev
3
900
会計事務所と顧問先の契約関係をOIDC・OAuthで表現する
terara
0
490
エージェント化するAI:現在地とその先に起きる変化 / AI as Agents: The Current State and the Changes Ahead
ks91
PRO
0
160
Featured
See All Featured
Reality Check: Gamification 10 Years Later
codingconduct
0
2.3k
Why You Should Never Use an ORM
jnunemaker
PRO
61
10k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
12
1.3k
ラッコキーワード サービス紹介資料
rakko
1
4.6M
Everyday Curiosity
cassininazir
0
300
svc-hook: hooking system calls on ARM64 by binary rewriting
retrage
2
530
How to train your dragon (web standard)
notwaldorf
97
6.8k
Mind Mapping
helmedeiros
PRO
1
340
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
350
Building Applications with DynamoDB
mza
96
7.2k
Max Prin - Stacking Signals: How International SEO Comes Together (And Falls Apart)
techseoconnect
PRO
0
430
BBQ
matthewcrist
89
10k
Transcript
ίί͕εΰ͍ͥʂ Playwright Component Test
গࣗ͠ݾհ • ໊લɿ দӜ ߉ੜ • ੜ݄ɿ1999 / 12 /
22 (24) • ग़ɿಸྑݝ • ॴଐɿגࣜձࣾϥΫεɹϑϩϯτΤϯυ։ൃ՝ • ͍ͬͯΔٕज़ɿ React , TypeScript
Playwright is Կ • Microsoft͕࡞ͬͨNode.jsϕʔεͷE2EςετࣗಈԽϑϨʔϜϫʔΫ • ςετϖʔδ(ը໘)୯ҐͰߦ͏ • CypressͳͲ͕ର߅അ
ϩάΠϯͷE2Eςετͷྫ ϩάΠϯը໘ τοϓը໘
Playwright ͷऑʁ
Playwright Component Test is Կ • PlaywrightͰίϯϙʔωϯτςετ·ͰͰ͖Δػೳ • ςετΛϖʔδ୯Ґ͔Βίϯϙʔωϯτ୯Ґʹʂ •
ݱࡏExperimental (࣮ݧతػೳ)
Ͱɺίϯϙʔωϯτ(୯ମ)ςετͬͯ Playwright͡Όͳͯ͘Ͱ͖ΔΑͶʁ Jest × Testing Library ͱ͔
ͪΐͬͱͬͯʂ Playwright Component Testͷίί͕εΰ͍ͶΜʂ
Playwright Component Test ͷεΰ͍ ɾίϯϙʔωϯτ͕࣮ϒϥβͰϨϯμϦϯά͞ΕΔ ɾը໘ͷαΠζΛࢦఆͰ͖Δ ɾλΠϜκʔϯݴޠΛࢦఆͰ͖Δ
ίϯϙʔωϯτ͕࣮ϒϥβͰϨϯμϦϯά͞ΕΔ JSDom
Playwright Component Test ͷεΰ͍ ɾίϯϙʔωϯτ͕࣮ϒϥβͰϨϯμϦϯά͞ΕΔ ɾը໘ͷαΠζΛࢦఆͰ͖Δ ɾλΠϜκʔϯݴޠΛࢦఆͰ͖Δ
ը໘αΠζΛࢦఆͰ͖Δ ϨεϙϯγϒͳαΠυόʔ WindowͷWidthHeightɺresizeΠϕϯτͳ ͲΛࣗ࡞͢Δඞཁ͋Γ (※ ͔ͳΓࠔ)
Playwright Component Test ͷεΰ͍ ɾίϯϙʔωϯτ͕࣮ϒϥβͰϨϯμϦϯά͞ΕΔ ɾը໘ͷαΠζΛࢦఆͰ͖Δ ɾλΠϜκʔϯݴޠΛࢦఆͰ͖Δ
λΠϜκʔϯݴޠΛࢦఆͰ͖Δ ຊޠ ver ӳޠ ver ςετ͕ࠔ खಈVRTͰ֬ೝ͢Δͷ͕ແ
·ͱΊ • खಈͰ֬ೝ͍ͯͨ͠Α͏ͳίϯϙʔωϯτςετʹ͑Δʂ • JestͳͲͱ͍͚Δ͜ͱ͕େࣄʂ • Playwright Component Test ͷՄೳੑແݶେʂ