Salesforce has introduced the Lighting Web Component as a lightweight framework. Lightning Web Component or LWC is the latest lightweight framework built on web standards. Since Salesforce is a member of the World Wide Web Consortium (W3C) and is committed to creating open web standards, it encourages the development of web standards on the Lightning platform. Our expert engineers have put together a quick guide to testing Lightning Web Components.
Using Lightning Web Components
LWC uses core web component standards to make sure that only the required and Salesforce-supported operations are performed in browsers. The code is native to the browsers, lightweight and is easy to use.
It provides users ease of access to custom elements, templates, shadow DOM, decorators and modules. LWC is different from the Aura because it will allow you to write web components, which most of the modern browsers support. An LWC framework will work as a translator between web components and browsers, so the latter can easily understand the components.
Testing Lightning Web Components
Testing is very important when it comes to the LWC because the components contain many different files including CSS, JS controllers, client-side JavaScript. Writing tests and making assertions with LWC and Jasmine, Mocha or Jest is simple, and an LWC has its own Visual Studio Code extension that provides powerful autocomplete and linting. While performing testing on web components, QA teams need to make sure that the following are covered:
- Test a component in isolation
- Test a component’s public API properties, methods and events
- Test basic user interaction (clicks)
- Verify the DOM output of a component
- Verify that events fire when expected
Essentials of Testing with LWC
Like any other testing endeavor, there are steps that need to be completed before testing a Salesforce LWC. Let’s have a look at some of the important ones:
- Write one test case for different components and do not integrate multiple test cases into one
- Understand the length of the test case, which mainly depends on the component
- Before executing your test, the test case should describe the accomplishments
- Carefully document the expected results for different actions performed on the LWC
- If your test case is written to test multiple elements at once, then it is preferable to implement modern-day JavaScript so the code can be optimized
Tools for Testing LWC
The advantage of working with an LWC is that it has built-in Test-Driven Development (TDD), which makes writing tests simple. Below are some widely used tools for testing a Salesforce LWC.
Testing LWC with Jest
Jest is the most widely used tool with rich features for writing JavaScript tests. Jest can be used to write unit tests for all your Lightning web components. Jest tests are independent of any platform and can be executed locally. As Jest tests don’t run in a browser, the execution of the test is fast.
If you run the Jest test in “watch mode” then you will receive immediate feedback while you’re coding. Jest tests run at the command line and you can run the same with your IDE.
Jasmine Unit Tests
Jasmine can be used to test both LWC and Aura components. They can test the components in the real browser and in real application containers. You can also test the multiple web components at the same time. Moreover, Jasmine is a JavaScript framework, so it provides better testing solutions.
Mocha Tests
This tool is a JavaScript testing framework and runs on Nodejs. It helps to make asynchronous testing simple and robust. The serial execution of Mocha tests makes it more flexible and assists in creating accurate reports.
Regression Testing with QUnit
QUnit is an easy-to-use JavaScript-based testing framework. It is used to test generic JavaScript-based components. Regression testing of lightning web components can be completed with QUnit. Whenever a bug is encountered, you can write a test and execute the required test steps to regress the bug on any browser.
Summary
Testing Salesforce LWCs is still an unexplored horizon. You should initially write LWC tests in Jest and further in Jasmine and Mocha. If your recipe has some spices in it then definitely you will enjoy the test. To ensure comprehensive testing for LWC, get in touch with QASource experts today.
