進行状況の追跡を始めよう
Trailhead のホーム
Trailhead のホーム

Write Tests for Your Lightning Components

Learning Objectives

After completing this unit, you’ll be able to:

  • Explain the role of the Lightning Test Service, its helpers, and execution methods.
  • Write unit tests for Lightning components.

Background

Development on the Lightning Platform these days includes more than just Apex. It includes client-side Javascript in Lightning component controllers. Testing these involves a few specialized tools. This video introduces them.


Lightning components are the building blocks of modern Salesforce applications. You build them  with the Lightning Component framework, a UI framework for developing dynamic web apps for mobile and desktop devices. This is a modern framework for building single-page applications engineered for growth. 

Lightning components contain several files that define different aspects of the component. For example, a component can contain a CSS file, a Javascript controller, and a design file in addition to the components markup file. Because Lightning components often contain client-side Javascript controllers, you need to test that logic. 

Apex is a proprietary language, so Salesforce provides built-in testing tools with the Lightning Platform. However, Javascript is an open language that Salesforce doesn’t control. The Javascript ecosystem has developed a number of testing frameworks, such as Jasmine, Mocha, and Jest. Rather than reinventing the wheel, the Lightning Platform provides wrapper libraries for Jasmine and Mocha. 

In this step, we discuss the Jasmine testing framework. The package you installed in unit 1 of this module includes some example Jasmine tests, as well as the Lightning Testing Service. 

Jasmine is a behavior-driven development testing framework. With this framework, you don’t make assertions about what a calculation is or which exception is thrown. Instead, Jasmine has you make expectations about which behavior occurs. So, instead of asserting that the output of method A should be XYZ, we tell Jasmine to expect method A to be called once, and its return value should be XYZ. 

To bridge the Lightning Component framework and Jasmine (or Mocha), the platform provides the Lightning Test Service. The Lightning Testing Service provides a utility object $T, which lets you create components and manipulate data. This facilitates testing. 

First, open the Jasmine example tests.

  1. Click Setup icon and select Developer Console.
  2. Select File > Open Resource.
  3. Select JasmineExampleTests.js and have a look at the code.

Code Highlights

Jasmine organizes its tests into suites using the describe keyword. Each individual test starts with the IT function call. 

In the Developer Console’s JasmineExampleTest.js tab, scroll down to the test suite starting on line 69. This test demonstrates invoking a client-side action and inspecting its behavior. One of the first things that happens in the test is a call to $T, the test helper object. In this case, you’re using $T to create an instance of the component c:egClientSideAction. $T is promise enabled, meaning the real work of your test is contained in the .then(component) method starting on line 72. 

You make expectations against the component object, and you can interact with it to set attribute values. Specifically, you expect the component to have markup with the aura:id of “accountList” and that it initially has 0 items in the array. Because the $T object creates an instance of the egClientSideAction component, which has a default Aura:Id and an empty array, the expectation is true. After executing the component.searchAccounts() method, however, you expect there to be 10 elements in the account list, the first of which is named Salesforce.

When you write tests for your Lightning components, you need a way to execute them. The Lightning Test Service has two methods to execute your tests. Once you have the tests written, you can run them by visiting: http://<your trailhead playground instance>.lightning.force.com/c/jasminetests.app. This page loads and runs your Jasmine tests, writing the pass/fail information to the screen. 

If you’d like to execute your Lightning Test Service–based tests from the command line, you’re in luck. If you install the Lightning Test Service from the DX command line, you can execute your tests directly from the command line. For more information on how that works, see the Lightning Test Service readme on github. See the link in the Resources section.

Resources