Movatterモバイル変換


[0]ホーム

URL:


Learn the smart, efficient way to test any JavaScript application.

YOUR ESSENTIAL GUIDE TO FLAWLESS TESTING

by
Kent C. Dodds
Kent C. Dodds
Trophy

Why bother testing your JavaScript?

When a user encounters a bug they look like this: 🤬

Bugs grind work to a halt.

Bugs cause financial harm.

Every single time a bug is encountered, user trust erodes.

Bugs are bad.

And who gets blamed?

You.

The developer.

Youknow you should squash bugs before your code is deployed.

Youknow you need to ship code that:

  • Takes every opportunity to guarantee that it works.

  • Doesn’t punish users with unnecessary bugs.
  • Doesn’t play whack-a-mole with features, fixing one thing only to breakanother.

  • Is maintainable and understandable to your co-workers.

A professional ships working code. Code that works.

We’re talking aboutcode that is well tested. Only through testing can you confidently deliver confident, professional code.

Why aren’t you testing code that users rely on?

When code fails on your users, have you failed to do your job?

You should do your job as well as possible and test, right?

Right.

Just one problem...

“Testing takes too much time and effort.”

There’s no time. You’re busy already.

There’s no obvious ROI. You can’t get the buy-in or budget for testing efforts.

There’s no way to test everything. Most testing is click click clicking around every turn of your application. It takes forever and feels like a waste of time—time you want to spend shipping new features, not QAing.

Nobody has time for that. But one way or another, your applicationwill be tested. If not by you, then by your users.

Cross your fingers and push to prod.

So... click click click hope for the best? That’s what we’re doing?

If we want to ship high-quality, well-tested JavaScript applications there has to be a better way.

Imagine outsourcing the heavy lifting of testing your application.

You're a developer.

You know humans are bad at complex, repetitive tasks.

You also know thatcomputers are very, very good at complex, repetitive tasks.

Professional developers use computers to automate testing of critical paths, behaviors, and all the little things—over and over and over again, all day and all night.

That’s how professional developers get things done... and done well.

Automated tests are the pro move.

Automated tests are your backup, your muscle.

Automated tests are your secret weapon...

But before you canbuild those tests, you need to know:

  • What should I test?
  • When do I test it?
  • Do I need 100% coverage?
  • How many tests are enough?

You could scour the internet to find the right alchemy of testing tools and techniques — or you could skip the analysis paralysis and go right to application success with a proven testing method.

screenshot of booking UI app we will be building

By using this proven testing method, you’ll layer these techniques:

  • Use a static type system and a linter to capture basic errors like typosand syntax.

  • Write effective unit tests that target the critical behavior andfunctionality of your application.

  • Develop integration tests to audit your application holistically andmake sure everything works together correctly in harmony.

  • Create end-to-end (e2e) functional tests for automated click-testing ofcritical paths instead of relying on your users to do it for you.

These four layers of automated testing give you the playbook to ship professional JavaScript applications with confidence, speed, and money savings. Every time.

One professional method of testing every JavaScript application

This course will apply the four-layer testing method to a React application, but this foundational strategy can be applied across any JavaScript framework:Angular, Vue, legacy Backbone apps, even frameworks and libraries we haven’t met yet.

Following this course, you’ll be equipped to:

  • deliver solid features that work for users as expected

  • choose the best tools for the job
  • communicate more effectively with your coworkers

  • be a more confident, professional JavaScript developer

Learn the professional method for JavaScript testing and always ship high quality software like the professional you are.

Code Bits

What's in Testing JavaScript?

8 modules full of dense testing knowledge

  • Fundamentals of Testing in JavaScript

    Fundamentals of Testing in JavaScript

    updatedIncludes brand new content!
    Upgrade to get access
    7video lessons
    code
    transcript
    8mof learning material

    Do you know what a testing framework does? Do you know what makes a testing framework different from a testing or assertion library? The best way to use a tool effectively is to understand how it works. And the best way to understand how a tool works is by making it yourself!

    In this short course, we’ll learn how testing frameworks and assertion libraries work by building our own, simple version of each.

  • JavaScript Mocking Fundamentals

    JavaScript Mocking Fundamentals

    updatedIncludes brand new content!
    Upgrade to get access
    6video lessons
    code
    transcript
    15mof learning material

    When running unit tests, you don’t want to actually make network requests or charge real credit cards. That could… get expensive… and also very, very slow. So instead of running your code exactly as it would run in production, you can modify how some of your JavaScript modules and functions work during tests to avoid test unreliability (flakiness) and improve the speed of your tests. This kind of modification can come in the form of stubs, mocks, or generally: “test doubles.”

    There are some great libraries and abstractions for mocking your JavaScript modules during tests.The Jest testing framework has great mocking capabilities built-in forfunctions as well as entiremodules. To really understand how things are working though, let’s implement some of these features ourselves.

  • Static Analysis Testing JavaScript Applications

    Static Analysis Testing JavaScript Applications

    updatedIncludes brand new content!
    Upgrade to get access
    15video lessons
    code
    transcript
    43mof learning material

    There are a ton of ways your application can break. One of the most common sources of bugs is related to typos and incorrect types. Passing a string to a function that expects a number, or falling prey to a common typo in a logical statement are silly mistakes that should never be made, but this happens all the time.

    We could write a comprehensive suite of automated tests for our entire codebase to make certain mistakes like this never happen, but that would likely be too much work and slow development down to be worth the benefit. Luckily for us, there are tools like ESLint, TypeScript, Prettier, and more which we can use to satisfy a whole category of testing with a great developer experience.

  • Use DOM Testing Library to test any JS framework

    Use DOM Testing Library to test any JS framework

    updatedIncludes brand new content!
    Upgrade to get access
    12video lessons
    code
    transcript
    17mof learning material

    The person using your application components shouldn’t have to know or care what framework(s) you used to write your application. Guess what: Neither should your tests.

    This course explores thedom-testing-library using 11 different frameworks, fromReact toSvelte. You’ll get hands-on experience writing tests for any JavaScript framework, giving you the confidence you need to ship your JavaScript application with your framework of choice.

  • Configure Jest for Testing JavaScript Applications

    Configure Jest for Testing JavaScript Applications

    updatedIncludes brand new content!
    Upgrade to get access
    24video lessons
    code
    transcript
    1h 38mof learning material

    Jest is a fully featured testing framework with a developer experience that is second to none. It’s remarkably simple and flexible at the same time. For simple use cases, you often don’t need to configure anything, install and enjoy the built-in coverage and watch mode support.

    In a real-world application though, you’ll often have needs specific to your application, especially when testing browser-based applications. You'll need to handle Webpack loaders, dynamic imports, and custom module resolution which Node.js does not support.

    In this course we’ll go over ways you can optimize your Jest configuration to make testing real-world JavaScript applications a delight. We’ll cover what’s already been mentioned in addition to Babel support, code coverage, how to make watch mode even more helpful, and how to run test suites with entirely different configurations.

  • Test React Components with Jest and React Testing Library

    Test React Components with Jest and React Testing Library

    updatedIncludes brand new content!
    Upgrade to get access
    42video lessons
    code
    transcript
    2h 24mof learning material

    If you want to ship your applications with confidence - and of course you do - you need an excellent suite of automated tests to make absolutely sure that when changes reach your users, nothing gets broken. To get this confidence, your tests need to realistically mimic how users actually use your React components. Otherwise, tests could pass when the application is broken in the real world.

    In this course, we’ll write a series of render methods and run a range of tests to see how we can get the confidence we’re looking for, without giving up maintainability or test run-speed.

  • Install, Configure, and Script Cypress for JavaScript Web Applications

    Install, Configure, and Script Cypress for JavaScript Web Applications

    updatedIncludes brand new content!
    Upgrade to get access
    20video lessons
    code
    transcript
    53mof learning material

    Cypress is an incredibly powerful web testing tool. It’s capable of testing any web application. Its architecture places it a cut above similar end-to-end testing tools. Its developer experience is best-in-class. And because Cypress runs your tests in the same context as the rest of your application, you’re able to get speed, reliability, and debuggability that are just a long - distant dream with similar tools. The catch? There is no catch. Cypress is exceptional.

    In this course, we’ll go over how you can install, configure, and script Cypress to test modern, real - world JavaScript web applications.

  • Test Node.js Backends

    Test Node.js Backends

    updatedIncludes brand new content!
    Upgrade to get access
    40video lessons
    code
    transcript
    2h 21mof learning material

    Backends hold so much of our application's business logic that is often used to support multiple clients (web, mobile, and other native platforms). This logic is critical to get right and deploying a breaking change to this can be devastating to your company's goals (not to mention the bottom-line). Increasing your "deployment confidence" is crucial and automated testing is the best way to do that.

    As Node.js continues to grow in usage around the world, learning how to test this mission-critical code in a way that increases developer velocity as well as confidence becomes increasingly important. In this workshop we use an Express.js example and focus on the patterns and practices that you need to learn so you can apply what you learn to test your code written in any Node.js web framework.

    You'll learn:

    • Testing Pure Functions
    • Testing Middleware
    • Testing Controllers
    • Testing API routes
    • Mocking third party dependencies
    • Testing authenticated code

Gain insight from industry experts.

Exclusive Pro Testing Bonus Content

Interviews

Wes Bos
Scott Tolinski

Practical testing with Wes Bos and Scott Tolinski

Wes is a full stack web developer and designer from Hamilton, Canada. He loves to share what he knows through his training products, teaching and speaking at conferences.

Scott Tolinski is the creator of Level Up Tutorials where he has released thousands of free and premium web development tutorials. Scott also is the co-host of the popular web development podcast Syntax. In his free time Scott is a dedicated Bboy (breakdancer) & enjoys pushing himself athletically through dance, working out and snowboarding.

Marcy Sutton

a11y with Marcy Sutton

Marcy is a Senior Front-End Engineer at Deque Systems, where she works on the axe-core team focusing on accessibility test integrations into web developer tooling.

Jessica Kerr

Static Types with Jessica Kerr

Symmathecist, developer, speaker, mother, crazy nut. Atomist. Learning and growing.

J.B. Rainsberger

Testing Practices with J.B. Rainsberger

J. B. Rainsberger teaches programmers to write software with less stress. Testing plays a significant role in stress reduction. He writes, teaches, speaks, and coaches not only programmers and organizations, but also his fellow coaches.

Angie Jones

Visual regression testing with Angie Jones

Angie Jones is a Senior Developer Advocate who specializes in test automation strategies and techniques. She shares her wealth of knowledge by speaking and teaching at software conferences all over the world.

Snapshots and Reason with Jared Forsyth

Snapshots and Reason with Jared Forsyth

Jared is a mobile & web developer for Khan Academy, he’s working to bring a world-class education to everyone.

Justin Searls

Testing culture with Justin Searls

Occasional conference talk speedrunner. Salt mining instructor at @testdouble.

Rosie Sherry

Ministry of testing with Rosie Sherry

Rosie is a founder of Software Testing Club, she loves all things communities, bootstrapping and unschooling.

Kent Beck

Craftmanship with Kent Beck

Kent is an Original signer of the Agile Manifesto, Author of the Extreme Programming book series, rediscoverer of Test-Driven Development, and inspiring Keynote Speaker.

Mattias Johansson

Testing Levels with Mattias Johansson

Mattias is a software engineer working on technology-assisted mental health treatment at Mindler.se and the creator of the programming show Fun Fun Function on YouTube.

Printables

The Essential Testing Glossary

The Essential Testing Glossary

Full Annotated Transcripts

Full Annotated Transcripts

JavaScript Testing Poster

JavaScript Testing Poster

Testing Checklist

Testing Checklist

Kent C. Dodds

Hi, I'm Kent C. Dodds, the creator of this course.

I'm a full-stack JavaScript engineer. At PayPal I helped build products shipped to millions of users all over the globe. I represented PayPal on the TC39. I'm a Google Developer Expert and I've been teaching on egghead.io and Frontend Masters for years. I'm happily married and the father of four kids (and one dog). I like my family, code, JavaScript, React, and of course, testing!

Start testing like a pro

Buy once. Forever yours.

Pro Testing

Loading price
Pro Testing

Professional Testing is for you if you are ready tocommit to building fully tested applications for your users.

Workshops

  • Fundamentals of Testing in JavaScript

  • JavaScript Mocking Fundamentals

  • Static Analysis Testing JavaScript Applications

  • Use DOM Testing Library to test any JS framework

  • Test React Components with Jest and React Testing Library

  • Install, Configure, and Script Cypress for JavaScript Web Applications

  • Configure Jest for Testing JavaScript Applications

  • Test Node.js Backends

  • Expert Interviews

    Coming soon

Features

  • All 8 modules in this course including testing React and other frameworks

  • Stream & Download

  • 9 bonus video interviews with testing experts

  • Fully annotated transcripts with inline code and screenshots

  • Full source code for all modules

  • Printable testing checklist and cheat sheets

30-Day Money-Back Guarantee

What other developers are saying

FAQ

Something has gone horribly wrong, how can I get help?

Oh no! There is a gray buoy in the lower right side of the screen or email help@testingjavascript.com.

Does my company own the team license(s)?

Team licenses are actually coupon codes that can be redeemed by users. Companies are not meant to own or keep the licenses.

They are meant to be distributed and are owned by the individual that claims that seat.

They cannot be transferred or "passed around"


[8]ページ先頭

©2009-2025 Movatter.jp