Surely you Jest, mutants?

Updated January 6, 2021

Using Stryker to test your Lighting Web Component Jest unit tests.

source: Cappan, via: iStock

Don’t rely on code coverage alone. This can be gamed. You need to use mutations to ensure your tests are actually testing something. Stryker is compatible with Jest. An implementation of Jest is provided by Salesforce for use with testing Lightning Web Components (LWC).

I am not going to cover general configuration or features of LWC. There are many articles and a lot of documentation already available covering this topic. I am also not going to discuss configuring lwc-jest. Again, there are a lot of articles and documentation on getting lwc-jest working for your Lightning Web Components. You will need to have lwc-jest configured and have tests running to make use of the information in this article.

The configuration below is actually pretty simple, but it came with a lot of expensive trial and error. I hope to make you journey to mutation testing much easier than mine.

Update your project to include some new development dependencies.

npm install @stryker-mutator/core --save-dev
npm install @stryker-mutator/jest-runner --save-dev

Dependencies above were updated from the original version of this article. Previously included were dependencies for the html-reporter and javascript-mutator. The HTML reporter is now included with Stryker and enabled by default. Stryker now supports mutating of JavaScript out of the box, without the need for a mutator plugin.

Also, add a command to your package.json file to run Stryker:

{
  ...
  "scripts": {
    ...
    "test:unit:lwc:mutate": "stryker run",
    ...
  },
  ...
}

You likely have several items in your scripts section. I am only showing the new item for running mutation tests.

You need to add two configuration files to your code base (if you don’t already have them):

jest.config.js

jest.config.js

• The above file is modeled off the Salesforce provided jest.config.js configuration file in their open source project, lwc-recipes.
• I added the jestConfig.testPathIgnorePatterns to keep Jest from testing temporary Stryker folders.
• I added the last item to the moduleNameMapper to help Stryker find classes under test.
• I added the collectCoverageFrom item to solve an issue on Windows with collecting jest coverage information. Nothing to do with getting Stryker to work.

stryker.conf.js

stryker.conf.js

The above configuration is really just based on Stryker documentation. More specifically, these two links will help explain most of the configuration:

• https://github.com/stryker-mutator/stryker/tree/master/packages/core
• https://github.com/stryker-mutator/stryker/tree/master/packages/jest-runner

The stryker.conf.js file above has been updated since the article was first published. The format of the configuration has changed slightly, but mostly stays the same. Below are the changes:

• The mutator option is no longer needed and has been removed. Stryker now supports mutating of JavaScript out of the box, without the need for a mutator plugin.
• I found I had to add “*” to the files option or the jest configuration was not getting picked up.
• The default temporary folder used by Stryker is named “.stryker-temp”, a hidden folder on unix. At the time of this update, there seems to be an issue with newer versions of Jest and Styker, where tests run, but no mutations are killed. I found I had to add the tempDirName option with a non-hidden folder name to solve this issue.

Once you have everything configured, you will be able to run your mutation tests by using the following command:

npm run test:unit:lwc:mutate

Be warned, if you have a lot of tests, your mutation testing may take a long time. The payoff for this extra time is the assurance you have true code coverage and not just a metric.