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
0
570
ココがすごいぜ!Playwright Component Test
rakus frontend
April 17, 2024
Tweet
Share
More Decks by rakus frontend
See All by rakus frontend
新卒FEが1年目に取り組んだこと・学んだこと
rakus_fe
0
50
ErrorBoundaryとSuspenseの導入検討
rakus_fe
1
770
日付をもう少し真面目に勉強中
rakus_fe
0
45
React19 β をざっと見る
rakus_fe
0
330
Reactのパフォーマンス改善例
rakus_fe
0
540
Typescript5.4の新機能
rakus_fe
0
310
非破壊的な配列メソッド
rakus_fe
0
380
スプレッドシートのセル結合がつらいので足掻いてみた話
rakus_fe
0
260
Other Decks in Technology
See All in Technology
Introduce marp-ai-slide-generator
itarutomy
0
140
AWS re:Invent 2025~初参加の成果と学び~
kubomasataka
1
200
M&Aで拡大し続けるGENDAのデータ活用を促すためのDatabricks権限管理 / AEON TECH HUB #22
genda
0
280
AI時代のワークフロー設計〜Durable Functions / Step Functions / Strands Agents を添えて〜
yakumo
3
2.4k
AR Guitar: Expanding Guitar Performance from a Live House to Urban Space
ekito_station
0
260
LayerX QA Night#1
koyaman2
0
270
Microsoft Agent Frameworkの可観測性
tomokusaba
1
120
NIKKEI Tech Talk #41: セキュア・バイ・デザインからクラウド管理を考える
sekido
PRO
0
240
コールドスタンバイ構成でCDは可能か
hiramax
0
110
"人"が頑張るAI駆動開発
yokomachi
1
640
re:Invent2025 セッションレポ ~Spec-driven development with Kiro~
nrinetcom
PRO
1
110
オープンソースKeycloakのMCP認可サーバの仕様の対応状況 / 20251219 OpenID BizDay #18 LT Keycloak
oidfj
0
200
Featured
See All Featured
Heart Work Chapter 1 - Part 1
lfama
PRO
3
35k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.2k
AI in Enterprises - Java and Open Source to the Rescue
ivargrimstad
0
1.1k
For a Future-Friendly Web
brad_frost
180
10k
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
1
270
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
38
2.7k
Paper Plane (Part 1)
katiecoart
PRO
0
2.2k
Building an army of robots
kneath
306
46k
Evolving SEO for Evolving Search Engines
ryanjones
0
79
Neural Spatial Audio Processing for Sound Field Analysis and Control
skoyamalab
0
140
Primal Persuasion: How to Engage the Brain for Learning That Lasts
tmiket
0
190
Build your cross-platform service in a week with App Engine
jlugia
234
18k
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 ͷՄೳੑແݶେʂ