Test Lightning Web ComponentsCall APIs from Apex

Test Lightning Web Components with Jest Framework

Prerequisites:

1. Before installing sfdx-lwc-jest install Node.js and npm.

2. Node.js : This page lists two releases of Node.js. We recommend using the “LTS” (Long Term Support) version, rather than the “Current” version.

Install Jest and Its Dependencies into Your Project

npm install @salesforce/sfdx-lwc-jest --save-dev

To Run test:

npm run test:unit

Component Folder Structure

Create a folder named __tests__ at the top level of your component’s bundle directory.

Update .forceignore with **/__tests__/**

Test File Naming Conventions:

Test files must have names that end in “.js”, and Salesforce recommend that tests end in “.test.js.”

Jest runs JavaScript files in the __tests__ directory

Example of package.json:

{

  ...

  "scripts": {

    ...

    "test:unit": "sfdx-lwc-jest",

    "test:unit:watch": "sfdx-lwc-jest --watch",

    "test:unit:debug": "sfdx-lwc-jest --debug",

    ...

  },

  ...

}

For More Details and Examples: Click Here

Sample code to check "Hello World!" output:

import { createElement } from 'lwc';

import Hello from 'c/lwcHelloWorld';

describe('c-lwcHelloWorld', () => {

    afterEach(() => {

        // The jsdom instance is shared across test cases in a single file so reset the DOM

        while (document.body.firstChild) {

            document.body.removeChild(document.body.firstChild);

        }

    });

    it('displays greeting', () => {

        // Create element

        const element = createElement('c-lwcHelloWorld', {

            is: Hello

        });

        document.body.appendChild(element);

        // Verify displayed greeting

        const div = element.shadowRoot.querySelector('div');

        expect(div.textContent).toBe('Hello, World!');

    });

});