Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Headless Chrome Tutorial

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for derek-b derek-b
April 19, 2018
Technology
150
0

Headless Chrome Tutorial

Madison PHP tutorial using Puppeteer, Mocha, Chai and Headless Chrome.

Avatar for derek-b

derek-b

April 19, 2018

More Decks by derek-b

See All by derek-b
What Raising 3 Kids Taught Me About Working with Users
Avatar for derek-b derekb
0
90
Pardon the disruption: a user-first approach to software design
Avatar for derek-b derekb
0
120
Teaching Through Code Review
Avatar for derek-b derekb
0
130
Add Location-Based Searching to Your Site with Elasticsearch
Avatar for derek-b derekb
0
74
Add Location-based Searching to Your PHP App with Elasticsearch
Avatar for derek-b derekb
1
400
Map, Filter, and Reduce in PHP
Avatar for derek-b derekb
0
910
You Version Your Code, Why Not Your Database?
Avatar for derek-b derekb
0
100
Taming Your Data with Elasticsearch - PHP Benelux
Avatar for derek-b derekb
1
540
What Raising 3 Kids Taught Me About Working With Users
Avatar for derek-b derekb
0
460

Other Decks in Technology

See All in Technology
初海外で注意すべきこと12選！！！安全快適なre:invent生活にするために
Avatar for Yuuuuuuu yuuuuuuu168
1
190
freeeにおけるSoftware Factory
Avatar for freee freee
PRO
0
270
その Valkey 使いこなしていますか？
Avatar for Takafumi ONAKA onk
PRO
5
1.8k
ストレスなくAIと付き合いたい！こんなときどうしてる？
Avatar for Nami Kimura namiki64
4
660
From Developer Experience to Agentic Experience: The Next Evolution of APIs
Avatar for Benjamin Granados benjagm
0
100
国際カードブランドルール変更に伴うクレジットカード決済取引仕様変更について
Avatar for Keiichi Nomura k1style
0
140
20261017福岡devIO 「AIは"良いダッシュボード"を作れるか？
Avatar for 武田 jtakeda
0
230
Browser Spec: Testing Hotwire with Ruby
Avatar for Masayoshi Takahashi takahashim
1
150
What Is JetBrains Air
Avatar for Daisuke Masuda x5gtrn
PRO
0
140
Gemini Intelligence 入門 ― AppFunctions と Gemini Nano
Avatar for takuro abe takuroabe
0
340
AWSセキュリティで活用するAI機能
Avatar for cm-usuda-keisuke cmusudakeisuke
1
180
[EMNLP26] RIGEL: Self-Distilled Score Adaptation for Image and Video Captioning Evaluation
Avatar for Semantic Machine Intelligence Lab., Keio Univ. keio_smilab
PRO
0
110

Featured

See All Featured
Rails Girls Zürich Keynote
Avatar for Gregor Martynus gr2m
96
14k
Navigating Weather and Climate Data
Avatar for Ryan Abernathey rabernat
0
560
Design in an AI World
Avatar for tapps tapps
1
360
Context Engineering - Making Every Token Count
Avatar for Addy Osmani addyosmani
9
1.2k
Ten Tips & Tricks for a 🌱 transition
Avatar for Manu Carrasco Molina stuffmc
1
270
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
280
24k
Intergalactic Javascript Robots from Outer Space
Avatar for Vicent Martí tanoku
273
28k
Introduction to Domain-Driven Design and Collaborative software design
Avatar for Kenny Baas-Schwegler baasie
1
1k
Leadership Guide Workshop - DevTernity 2021
Avatar for David Neal reverentgeek
1
400
Color Theory Basics | Prateek | Gurzu
Avatar for Gurzu gurzu
1
490
Beyond borders and beyond the search box: How to win the global "messy middle" with AI-driven SEO
Avatar for David Carrasco davidcarrasco
3
280
My Coaching Mixtape
Avatar for mlcsv mlcsv
0
360

Transcript

  1. Browser Automated Testing with Headless Chrome Derek Binkley @DerekB_WI

  2. Derek Binkley @DerekB_WI JavaScript Experience?

  3. What is It?

  4. Derek Binkley @DerekB_WI Testing Tools • Text based • Page

    recorder • Selenium WebDriver • Browser Emulator

  5. Derek Binkley @DerekB_WI Headless Chrome • June 2017 • Full

    browser • Chrome Dev Tools • No GUI

  6. Is Anybody There?

  7. Derek Binkley @DerekB_WI Why? • Reliability • Dependability • Sleep

    better after an update

  8. What do we need? Node Chrome Puppeteer Mocha Chai

  9. Derek Binkley @DerekB_WI Install • npm init • npm i

    —save mocha chai • npm i --save puppeteer • Add test script to package.json

  10. Derek Binkley @DerekB_WI Setup Command package.json

  11. Derek Binkley @DerekB_WI Basics • Test Defined as JavaScript •

    Full Access to DOM • Assertions using Chai • Run using Mocha

  12. Examples

  13. Derek Binkley @DerekB_WI Thanks • @DerekB_WI • https:/ /joind.in/talk/034f5

  14. 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/