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
Headless Chrome Tutorial
Search
derek-b
April 19, 2018
Technology
0
86
Headless Chrome Tutorial
Madison PHP tutorial using Puppeteer, Mocha, Chai and Headless Chrome.
derek-b
April 19, 2018
Tweet
Share
More Decks by derek-b
See All by derek-b
What Raising 3 Kids Taught Me About Working with Users
derekb
0
45
Pardon the disruption: a user-first approach to software design
derekb
0
74
Teaching Through Code Review
derekb
0
97
Add Location-Based Searching to Your Site with Elasticsearch
derekb
0
30
Add Location-based Searching to Your PHP App with Elasticsearch
derekb
1
320
Map, Filter, and Reduce in PHP
derekb
0
720
You Version Your Code, Why Not Your Database?
derekb
0
58
Taming Your Data with Elasticsearch - PHP Benelux
derekb
1
450
What Raising 3 Kids Taught Me About Working With Users
derekb
0
370
Other Decks in Technology
See All in Technology
TopAppBar Composableをカスタムする
hunachi
0
170
Стильный код: натуральный поиск редких атрибутов по картинке. Юлия Антохина, Data Scientist, Lamoda Tech
lamodatech
0
330
はじめてのSDET / My first challenge as a SDET
bun913
1
200
近年の PyCon 情勢から見た PyCon APAC のまとめ
terapyon
0
290
ソフトウェア開発現代史: "LeanとDevOpsの科学"の「科学」とは何か? - DORA Report 10年の変遷を追って - #DevOpsDaysTokyo
takabow
0
200
ブラウザのレガシー・独自機能を愛でる-Firefoxの脆弱性4選- / Browser Crash Club #1
masatokinugawa
1
390
低レイヤを知りたいPHPerのためのCコンパイラ作成入門 / Building a C Compiler for PHPers Who Want to Dive into Low-Level Programming
tomzoh
0
210
Рекомендации с нуля: как мы в Lamoda превратили главную страницу в ключевую точку входа для персонализированного шоппинга. Данил Комаров, Data Scientist, Lamoda Tech
lamodatech
0
330
AIと開発者の共創: エージェント時代におけるAIフレンドリーなDevOpsの実践
bicstone
1
250
20250408 AI Agent workshop
sakana_ai
PRO
15
3.5k
Automatically generating types by running tests
sinsoku
1
440
Amazon S3 Tables + Amazon Athena / Apache Iceberg
okaru
0
240
Featured
See All Featured
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Adopting Sorbet at Scale
ufuk
76
9.3k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
129
19k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
30
2k
Build your cross-platform service in a week with App Engine
jlugia
229
18k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
41
2.2k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
280
13k
GraphQLとの向き合い方2022年版
quramy
46
14k
Build The Right Thing And Hit Your Dates
maggiecrowley
35
2.6k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
13
660
Scaling GitHub
holman
459
140k
Agile that works and the tools we love
rasmusluckow
328
21k
Transcript
Browser Automated Testing with Headless Chrome Derek Binkley @DerekB_WI
Derek Binkley @DerekB_WI JavaScript Experience?
What is It?
Derek Binkley @DerekB_WI Testing Tools • Text based • Page
recorder • Selenium WebDriver • Browser Emulator
Derek Binkley @DerekB_WI Headless Chrome • June 2017 • Full
browser • Chrome Dev Tools • No GUI
Is Anybody There?
Derek Binkley @DerekB_WI Why? • Reliability • Dependability • Sleep
better after an update
What do we need? Node Chrome Puppeteer Mocha Chai
Derek Binkley @DerekB_WI Install • npm init • npm i
—save mocha chai • npm i --save puppeteer • Add test script to package.json
Derek Binkley @DerekB_WI Setup Command package.json
Derek Binkley @DerekB_WI Basics • Test Defined as JavaScript •
Full Access to DOM • Assertions using Chai • Run using Mocha
Examples
Derek Binkley @DerekB_WI Thanks • @DerekB_WI • https:/ /joind.in/talk/034f5
Derek Binkley @DerekB_WI Resources • https:/ /developers.google.com/web/updates/2017/06/ headless-karma-mocha-chai • https:/
/medium.com/@ankit_m/ui-testing-with- puppeteer-and-mocha-part-1-getting-started- b141b2f9e21 • https:/ /github.com/GoogleChrome/puppeteer • https:/ /github.com/checkly/puppeteer-examples • https:/ /puppeteersandbox.com/