Skip to main content

Front-End Testing and Advanced Browser Automation

Umar Hansa
On the web
umaar.com
On Twitter
@umaar
Tickets
Get a ticket

Workshop includes:
  • Working examples to take away
  • Interactive sessions
  • Workshop recordings
  • Dedicated Q&A time
  • Smashing Certificate

Workshop, 5×2.5h + Q&A • Wed & Thu, Aug 19 – Sep 3
09:00 – 11:30 AM PDT (Pacific Daylight Time)

Browser automation helps us create resilient web applications by ensuring they are battle-tested through end-to-end tests.

On the other end of the spectrum, they also help create a whole new field of websites and services, through techniques such as browser scraping. In this workshop, you will learn browser automation from the ground up.


To get you fit for making full use of the benefits that browser automation brings along, we will cover:

  • End-to-end testing (with and without a testing library)
  • Scraping data from other websites and services
  • Automated performance, accessibility, and visual regression testing
  • Running automated browsers on free cloud services and a $5 VPS
  • Common pitfalls with browser automation and how to debug related automation issues.

Make your tests resilient: if every minor change causes your test to break, it is probably too brittle. In this workshop you’ll learn how.

What Will We Explore In This Workshop?

  • Testing
    End-to-end browser testing helps us create rock-solid web apps. Especially because you can validate certain website behavior which unit tests or integration tests will never catch. Learn common testing patterns, from user registration workflows (and email sending) to page interactivity and navigation.
  • Scraping
    Believe it or not, entire startups are building their businesses around scraping web content. We’ll learn scraping strategies and how to operate fairly. As a fun exercise, we will produce an automated price checker that notifies us when an online product becomes cheaper.
  • Auditing
    Testing is more than just asserting page titles. It’s ensuring you have no performance or accessibility regressions when you make changes to the code. Performance, accessibility, and even visual regression testing can be checked automatically. Learn the tools which can help you achieve this.
  • Personal productivity
    How many of us have automated all those boring parts in their workflows? Very few, I suspect. That’s why we’ll look into strategies that help you become more productive — from filling in long web forms to dynamically creating images and even setting up your web development environment with automated browsers.
  • Deploying + Debugging
    First, we’ll deploy our tests to the cloud. Test failures are inevitable, though, but with the right techniques, we can speed up the debugging process dramatically. DevTools and exporting screenshots and videos of our test run to see what went wrong are two of the approaches we’ll take a closer look at.

The closer you can get your test to match how people actually use your website in the real world, the more resilient your website will be.

Who Is This For?

This workshop is aimed for all developers, whether it’s frontend, backend, or even those still exploring engineering field. We will cover much more than just testing, so join us on this journey to learn how automating browsers can help you.

Please note that we will be using JavaScript and Node.js along the way.

What Hardware/Software Do You Need?

  • A machine with Chrome installed (Firefox and Edge are optional)
  • Your favorite code editor (e.g., VS Code, Sublime Text, etc.)
  • Node.js v14.1.0 or newer
  • A GitHub account
  • Basic knowledge of JavaScript

Register for this workshop →

About Umar Hansa

Umar is a web developer and Google Developer Expert based in London, with a focus on writing tips and tutorials for the modern web. He tweets web tips and known for his DevTools course.

Time & Schedule

The workshop is split over five days with two-hour-long sessions on each day — and lots of time for Q&A of course. Our virtual doors open at 8:30, we start at 9 AM PDT.

Please mark your calendars:

  • Wed, August 19, 09:00 – 11:30 AM PDT
  • Thu, August 20, 09:00 – 11:30 AM PDT
  • Wed, August 26, 09:00 – 11:30 AM PDT
  • Thu, August 27, 09:00 – 11:30 AM PDT
  • Thu, September 3, 09:00 – 11:30 AM PDT

Schedule

This is the schedule for each of the five days:

Day 1 — Introduction

8:45 AM PDT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM
An introduction to browser automation and testing web applications in JavaScript.

11:00 AM – 11:30 AM
Q&A with Umar on the day’s material. Networking!

Day 2 — Web Scraping

8:45 AM PDT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM
Continuing our testing journey, but this time with a “web scraping” spin, where we’ll learn how to scrape anything from any website.

11:00 AM – 11:30 AM
Q&A with Umar on the day’s material. Networking!

Day 3 — Web Performance and Accessibility

8:45 AM PDT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM
Going deeper into automation, we’ll set up some automated web performance monitoring tools which you can use in your own projects. We’ll also touch upon automated accessibility testing.

11:00 AM – 11:30 AM
Q&A with Umar on the day’s material. Networking!

Day 4 — Automation

8:45 AM PDT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM
Using automation to boost your own productivity. Filling in web forms, setting up your development environment, and more.

11:00 AM – 11:30 AM
Q&A with Umar on the day’s material. Networking!

Day 5 — Debugging and Exporting

8:45 AM PDT
Virtual doors open, registration, chat and introductions.

9:00 AM – 11:00 AM
Running our tests in the cloud, debugging test failures, exporting screenshots and videos so you can watch your test runs.

11:00 AM – 11:30 AM
Q&A with Umar on the day’s material. Networking!

Register for this workshop →