Unit testing with Lightning Web Components

In this section, we are going to build a unit test for the Race Setup Lightning Web Component. This component has a number of dependencies that need to be mocked in order to build a successful unit test that covers the component's HTML and JavaScript code. Here is a reminder of what the component looks like:

When the user selects drivers and clicks Add Drivers, a confirmation toast message is shown:

The Race Setup component uses a lightning-table child component defined in its HTML and methods from an Apex Controller RaceSetupComponentController class defined in its JavaScript controller. Lightning Web Components unit tests focus solely on the logic directly in the Race Setup component code (raceSetup.html and raceSetup.js) and no other concerns, thus, we will focus on testing the following behaviors:

  • When the component has loaded, the list of drivers is correctly bound to the table.
  • When Add Drivers is clicked, the correct drivers are passed to the Apex Controller.
  • The correct toast and custom events are sent.
  • When there are errors from the Apex Controller, the correct events are sent.

In the following sections, we will learn the basics of setting up unit tests for Lightning Web Components within a Salesforce DX project and the layout of the test code. We will then look at mocking approaches to emulate the preceding dependencies to test the desired behaviors.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
3.147.61.142