Dive into JavaScript testing with the best talks from 2020/2021

Jan Tomes
Jan Tomes
03 Aug, 2021
Rate this content

Often overlooked, sometimes under-appreciated, testing is a crucial but difficult part of software delivery. Watch these great talks to ensure your JavaScript code is always spotless and runs smoothly.

Bugs are an essential part of the global ecosystem, but finding them pollinating flowers is much better than finding them crawling through your apps. Errors and glitches can make or break your product, which is why testing is such an important step before shipping. However, JavaScript testing is not a straightforward process, from picking the right approach and tools to identifying the bugs themselves. 

Thankfully, every problem has a solution, and every JS testing approach has a champion willing to share their knowledge. So tune in to the videos below and make your next app as flawless as possible.

Iris Schaffer: Fantastic bugs and where to find them

Every bug is different: some lurk around for months, others appear suddenly after the upgrade of a dependency. Some are introduced us while others other teams or systems. Some are painfully obvious and affect all users, and others only occur in some instances. And the ways of finding and, eventually, preventing them are just as diverse: be it a snapshot, unit, integration, end-to-end or automated visual tests, every kind comes with its challenges and opportunities. 

Testing UIs is hard, but in the end, only test automation can give us the confidence we need to move fast and refactor our code relentlessly. In this talk, Iris Schaffer looks at what kinds of bugs there are, which tests are most effective for catching them, and how we can implement various methods using modern front-end technologies.

Christian Bromann: The evolution of browser automation

In this session, Christian Bromann looks at what's happened behind the scenes in browser automation throughout the years and what the future has in stock for us. You will see how web testing will develop and what challenges this will bring for conventional frameworks like Selenium or WebdriverIO and new frameworks such as Cypress, Puppeteer, and Playwright. Lastly, you will experiment with some new automation capabilities these frameworks provide to test some of the latest web features.

Jessica Sachs: Component testing with Vite, Vue, and Cypress

In this talk Jessica Sachs, you will explore what a developer workflow with Vite, Vue, and Cypress looks like and how fun testing can be. Jessica is a core team member of vue-test-utils, develops at Cypress, and is considered a testing guru the community.

Applitools 🤝 Cypress: State of the union

This is the opening keynote for Front-End Test Fest delivered Angie Jones, Head of Developer Relations at Applitools, and Amir Rustamzadeh, Director of Developer Experience at Cypress. In the video, they look at the upcoming capabilities of Cypress to tame flaky tests and test components along with their guests and discuss the innovative features of Cypress and Applitools. 

You'll learn how they can be used to not only meet but exceed your quality objectives and how component testing, flake detection, and visual testing can significantly enhance your functional, cross-platform, accessibility, and localization quality initiatives.

Tomasz Łakomy: Shipping high-quality JS apps with confidence

Shipping bug-less code to production is — obviously — impossible. But still, users deserve the best experience we can give them, stipulates Tomasz Łakomy in this talk. And he argues that if you gain confidence in the way you build your software, you can sleep better knowing that it won't explode in the middle of the night. 

In this talk, Tomasz covers something he calls The Testing Spectrum, which is a set of tools, practices, and mindset of shipping high-quality code to production.

Bushra Alam: The allure of adding tests to Azure DevOps

Continuous testing is the process of executing automated tests as part of the software delivery pipeline. Teams that use Continuous Testing can catch bugs early and often, resulting in code that is always production-ready. Join Bushra Alam to learn how to integrate your end-to-end tests with Azure DevOps.

Patrick Kunka: Simulating network conditions with JavaScript

When working with video streaming, accurately simulating customer network conditions for development and testing is crucial. In this talk, Patrick Kunka sheds light on using containers and server-side JavaScript to programmatically shape network conditions. 

You'll also learn how to gain valuable insights about the behavior and performance of client-side JavaScript from Adaptive Bitrate video players to entire single-page applications.

03 Aug, 2021
AI generated transcription, chapters and summary will be available later.

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Remix Conf Europe 2022Remix Conf Europe 2022
23 min
Scaling Up with Remix and Micro Frontends
Do you have a large product built by many teams? Are you struggling to release often? Did your frontend turn into a massive unmaintainable monolith? If, like me, you’ve answered yes to any of those questions, this talk is for you! I’ll show you exactly how you can build a micro frontend architecture with Remix to solve those challenges.
TestJS Summit 2021TestJS Summit 2021
33 min
Network Requests with Cypress
Whether you're testing your UI or API, Cypress gives you all the tools needed to work with and manage network requests. This intermediate-level task demonstrates how to use the cy.request and cy.intercept commands to execute, spy on, and stub network requests while testing your application in the browser. Learn how the commands work as well as use cases for each, including best practices for testing and mocking your network requests.
TestJS Summit 2021TestJS Summit 2021
38 min
Testing Pyramid Makes Little Sense, What We Can Use Instead
Featured Video
The testing pyramid - the canonical shape of tests that defined what types of tests we need to write to make sure the app works - is ... obsolete. In this presentation, Roman Sandler and Gleb Bahmutov argue what the testing shape works better for today's web applications.

Remix Conf Europe 2022Remix Conf Europe 2022
37 min
Full Stack Components
Remix is a web framework that gives you the simple mental model of a Multi-Page App (MPA) but the power and capabilities of a Single-Page App (SPA). One of the big challenges of SPAs is network management resulting in a great deal of indirection and buggy code. This is especially noticeable in application state which Remix completely eliminates, but it's also an issue in individual components that communicate with a single-purpose backend endpoint (like a combobox search for example).
In this talk, Kent will demonstrate how Remix enables you to build complex UI components that are connected to a backend in the simplest and most powerful way you've ever seen. Leaving you time to chill with your family or whatever else you do for fun.
JSNation Live 2021JSNation Live 2021
29 min
Making JavaScript on WebAssembly Fast
JavaScript in the browser runs many times faster than it did two decades ago. And that happened because the browser vendors spent that time working on intensive performance optimizations in their JavaScript engines.
Because of this optimization work, JavaScript is now running in many places besides the browser. But there are still some environments where the JS engines can’t apply those optimizations in the right way to make things fast.
We’re working to solve this, beginning a whole new wave of JavaScript optimization work. We’re improving JavaScript performance for entirely different environments, where different rules apply. And this is possible because of WebAssembly. In this talk, I'll explain how this all works and what's coming next.
React Summit 2023React Summit 2023
24 min
Debugging JS
As developers, we spend much of our time debugging apps - often code we didn't even write. Sadly, few developers have ever been taught how to approach debugging - it's something most of us learn through painful experience.  The good news is you _can_ learn how to debug effectively, and there's several key techniques and tools you can use for debugging JS and React apps.

Workshops on related topic

React Summit 2023React Summit 2023
151 min
Designing Effective Tests With React Testing Library
Featured Workshop
React Testing Library is a great framework for React component tests because there are a lot of questions it answers for you, so you don’t need to worry about those questions. But that doesn’t mean testing is easy. There are still a lot of questions you have to figure out for yourself: How many component tests should you write vs end-to-end tests or lower-level unit tests? How can you test a certain line of code that is tricky to test? And what in the world are you supposed to do about that persistent act() warning?
In this three-hour workshop we’ll introduce React Testing Library along with a mental model for how to think about designing your component tests. This mental model will help you see how to test each bit of logic, whether or not to mock dependencies, and will help improve the design of your components. You’ll walk away with the tools, techniques, and principles you need to implement low-cost, high-value component tests.
Table of contents
- The different kinds of React application tests, and where component tests fit in
- A mental model for thinking about the inputs and outputs of the components you test
- Options for selecting DOM elements to verify and interact with them
- The value of mocks and why they shouldn’t be avoided
- The challenges with asynchrony in RTL tests and how to handle them
- Familiarity with building applications with React
- Basic experience writing automated tests with Jest or another unit testing framework
- You do not need any experience with React Testing Library
- Machine setup: Node LTS, Yarn
TestJS Summit 2022TestJS Summit 2022
146 min
How to Start With Cypress
Featured WorkshopFree
The web has evolved. Finally, testing has also. Cypress is a modern testing tool that answers the testing needs of modern web applications. It has been gaining a lot of traction in the last couple of years, gaining worldwide popularity. If you have been waiting to learn Cypress, wait no more! Filip Hric will guide you through the first steps on how to start using Cypress and set up a project on your own. The good news is, learning Cypress is incredibly easy. You'll write your first test in no time, and then you'll discover how to write a full end-to-end test for a modern web application. You'll learn the core concepts like retry-ability. Discover how to work and interact with your application and learn how to combine API and UI tests. Throughout this whole workshop, we will write code and do practical exercises. You will leave with a hands-on experience that you can translate to your own project.
React Summit 2022React Summit 2022
117 min
Detox 101: How to write stable end-to-end tests for your React Native application
Compared to unit testing, end-to-end testing aims to interact with your application just like a real user. And as we all know it can be pretty challenging. Especially when we talk about Mobile applications.
Tests rely on many conditions and are considered to be slow and flaky. On the other hand - end-to-end tests can give the greatest confidence that your app is working. And if done right - can become an amazing tool for boosting developer velocity.
Detox is a gray-box end-to-end testing framework for mobile apps. Developed by Wix to solve the problem of slowness and flakiness and
used by React Native itself
as its E2E testing tool.
Join me on this workshop to learn how to make your mobile end-to-end tests with Detox rock.
- iOS/Android: MacOS Catalina or newer
- Android only: Linux
Install before the workshop
React Day Berlin 2022React Day Berlin 2022
86 min
Using CodeMirror to Build a JavaScript Editor with Linting and AutoComplete
Using a library might seem easy at first glance, but how do you choose the right library? How do you upgrade an existing one? And how do you wade through the documentation to find what you want?
In this workshop, we’ll discuss all these finer points while going through a general example of building a code editor using CodeMirror in React. All while sharing some of the nuances our team learned about using this library and some problems we encountered.
TestJS Summit - January, 2021TestJS Summit - January, 2021
173 min
Testing Web Applications Using Cypress
This workshop will teach you the basics of writing useful end-to-end tests using Cypress Test Runner.
We will cover writing tests, covering every application feature, structuring tests, intercepting network requests, and setting up the backend data.
Anyone who knows JavaScript programming language and has NPM installed would be able to follow along.

Node Congress 2023Node Congress 2023
63 min
0 to Auth in an Hour Using NodeJS SDK
Passwordless authentication may seem complex, but it is simple to add it to any app using the right tool.
We will enhance a full-stack JS application (Node.JS backend + React frontend) to authenticate users with OAuth (social login) and One Time Passwords (email), including:
- User authentication - Managing user interactions, returning session / refresh JWTs
- Session management and validation - Storing the session for subsequent client requests, validating / refreshing sessions
At the end of the workshop, we will also touch on another approach to code authentication using frontend Descope Flows (drag-and-drop workflows), while keeping only session validation in the backend. With this, we will also show how easy it is to enable biometrics and other passwordless authentication methods.
Table of contents
- A quick intro to core authentication concepts
- Coding
- Why passwordless matters
- IDE for your choice
- Node 18 or higher