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
160
ココがすごいぜ!Playwright Component Test
rakus frontend
April 17, 2024
Tweet
Share
More Decks by rakus frontend
See All by rakus frontend
Typescript5.4の新機能
rakus_fe
0
97
非破壊的な配列メソッド
rakus_fe
0
150
スプレッドシートのセル結合がつらいので足掻いてみた話
rakus_fe
0
95
Other Decks in Technology
See All in Technology
Google Cloud Next '24 Recap(Cloud Run/k8s)
mokocm
0
340
2024春 注目のWeb系 OSS & SaaS 3選
makies
0
180
非同期推論システムによるコスト削減と信頼性向上
koki_nishihara
1
360
Gitlab本から学んだこと - そーだいなるプレイバック / gitlab-book
soudai
7
1.3k
MixIT 2024 - Pulumi : Gérer son infra avec son langage de programmation préféré
ju_hnny5
1
120
EM完全に理解した と思ったけど、 やっぱり何も分からなかった話 / EM Night Fukuoka #1
hirutas
0
280
web-application-security
matsuihidetoshi
1
190
止まらないLinuxシステムを構築する_高信頼性クラスタ入門
koedoyoshida
2
460
MLOpsの「壁」を乗り越える、LINEヤフーの Data Quality as Code
lycorptech_jp
PRO
8
630
令和最新版 Ruby プロファイラ "Pf2" のご紹介
osyoyu
0
120
Cloud Service Mesh に触れ合う
phaya72
1
230
IaCジェネレーターとBedrockで詳細設計書を生成してみた
tsukasa_ishimaru
4
890
Featured
See All Featured
Typedesign – Prime Four
hannesfritz
36
2.1k
Put a Button on it: Removing Barriers to Going Fast.
kastner
58
3.1k
Stop Working from a Prison Cell
hatefulcrawdad
267
19k
Thoughts on Productivity
jonyablonski
60
3.9k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
155
14k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
501
140k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
21
1.4k
4 Signs Your Business is Dying
shpigford
176
21k
What's in a price? How to price your products and services
michaelherold
238
11k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
323
20k
Documentation Writing (for coders)
carmenintech
60
4k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
41
4.4k
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 ͷՄೳੑແݶେʂ