Upgrade to Pro — share decks privately, control downloads, hide ads and more …

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
120
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
73
Pardon the disruption: a user-first approach to software design
Avatar for derek-b derekb
0
99
Teaching Through Code Review
Avatar for derek-b derekb
0
120
Add Location-Based Searching to Your Site with Elasticsearch
Avatar for derek-b derekb
0
59
Add Location-based Searching to Your PHP App with Elasticsearch
Avatar for derek-b derekb
1
370
Map, Filter, and Reduce in PHP
Avatar for derek-b derekb
0
860
You Version Your Code, Why Not Your Database?
Avatar for derek-b derekb
0
76
Taming Your Data with Elasticsearch - PHP Benelux
Avatar for derek-b derekb
1
500
What Raising 3 Kids Taught Me About Working With Users
Avatar for derek-b derekb
0
420

Other Decks in Technology

See All in Technology
Azure Speech で音声対応してみよう
Avatar for kosmosebi kosmosebi
0
140
非エンジニア職からZOZOへ 〜登壇がキャリアに与えた影響〜
Avatar for ikechi penpeen
0
480
Rebirth of Software Craftsmanship in the AI Era
Avatar for Lemi Orhan Ergin lemiorhan
PRO
4
1.6k
ぼくがかんがえたさいきょうのあうとぷっと
Avatar for Yuuki Yamashita yama3133
0
160
ハーネスエンジニアリングの概要と設計思想
Avatar for sergicalsix sergicalsix
4
1.7k
こんなアーキテクチャ図はいやだ / Anti-pattern in AWS Architecture Diagrams
Avatar for Naomi Yamasaki naospon
1
390
Data Hubグループ 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
0
2.9k
Azure Lifecycle with Copilot CLI
Avatar for Toru Makabe torumakabe
3
960
昔はシンプルだった_AmazonS3
Avatar for kawaji kawaji_scratch
0
290
マルチエージェント × ハーネスエンジニアリング × GitLab Duo Agent Platformで実現する「AIエージェントに仕事をさせる時代へ。」 / 20260421 GitLab Duo Agent Platform
Avatar for Niishi Kubo n11sh1
0
120
AIを共同作業者にして書籍を執筆する方法 / How to Write a Book with AI as a Co-Creator
Avatar for ama-ch ama_ch
2
120
Introduction to Bill One Development Engineer
Avatar for Sansan, Inc. sansan33
PRO
0
410

Featured

See All Featured
WCS-LA-2024
Avatar for Leonardo Collado-Torres lcolladotor
0
530
The #1 spot is gone: here's how to win anyway
Avatar for Tamara Novitovic tamaranovitovic
2
1k
DBのスキルで生き残る技術 - AI時代におけるテーブル設計の勘所
Avatar for soudai sone soudai
PRO
64
53k
Organizational Design Perspectives: An Ontology of Organizational Design Elements
Avatar for Dr. Kim W Petersen kimpetersen
PRO
1
670
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
45
9k
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
360
30k
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
141
7.4k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
46
8.1k
Making Projects Easy
Avatar for Brett Harned brettharned
120
6.6k
AI in Enterprises - Java and Open Source to the Rescue
Avatar for ivargrimstad ivargrimstad
0
1.2k
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
Avatar for Ines Montani inesmontani
PRO
0
320
Context Engineering - Making Every Token Count
Avatar for Addy Osmani addyosmani
9
820

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/