2

Getting below error on import {FlowNavigationNextEvent} from 'lightning/flowSupport'; in jest test file.

Cannot find module 'lightning/flowSupport' from 'force-app/main/default/lwc/lwcomponent/test/lwcomponent.test.js'

   5 | import lwcomponent from 'c/lwcomponent'
   6 | import {createElement} from 'lwc'
>  7 | import {FlowNavigationNextEvent} from 'lightning/flowSupport';
     | ^
   8 |
   9 | /**
  10 |  *  @description For debugging in webkit console

Version Details:

├── @prettier/plugin-xml@0.12.0
├── @salesforce/eslint-config-lwc@0.11.1
├── @salesforce/eslint-plugin-aura@2.0.0
├── @salesforce/sfdx-lwc-jest@1.0.1
├── eslint-config-prettier@6.15.0
├── eslint@7.31.0
├── husky@4.3.8
├── lint-staged@10.5.4
├── prettier-plugin-apex@1.10.0
└── prettier@2.3.2

Any idea why flowSupport is not working in jest??
5
  • 1
    What version is your sfdx-lwc-jest ? Jul 25, 2021 at 14:33
  • @MohithShrivastava Its @salesforce/sfdx-lwc-jest@1.0.1
    – Ajay Gupta
    Jul 25, 2021 at 23:09
  • Can you share your whole test case? Jul 25, 2021 at 23:45
  • Sure, i have a lwc used in flow for which i am trying to create a jest test flie. But import flowSupport in jest while running test command is throwing error of can’t find module.
    – Ajay Gupta
    Jul 25, 2021 at 23:49
  • sorry i meant share minimum reproducible code? Jul 26, 2021 at 2:41

1 Answer 1

1

The lightning modules need to be mocked as jest doesn't have access to import modules like a lightning web component actually could. lwc-jest provides stubs to some modules that come with lwc-jest. You can see a list of the provided lightning-stubs.

As you can see, there's no flowSupport. There's actually an issue created to provide this stub in the repo, but you can always create your own stub so you can test your components.

Below is just copied from the issue above, but is an example of a stub so your LWC will be able to use new FlowNavigationNextEvent();

export const FlowAttributeChangeEventName = 'lightning__flowattributechange';

export class FlowAttributeChangeEvent extends CustomEvent {
 constructor(attributeName, attributeValue) {
    super(FlowAttributeChangeEventName, {
        composed: true,
        cancelable: true,
        bubbles: true,
        detail: {
            attributeName,
            attributeValue
        }
    });
  }
}

export const FlowNavigationNextEventName = 'lightning__flownextevent';

export class FlowNavigationNextEvent extends CustomEvent {
 constructor(attributeName, attributeValue) {
    super(FlowNavigationNextEventName, {
        composed: true,
        cancelable: true,
        bubbles: true,
        detail: {
            attributeName,
            attributeValue
        }
    });
  }
}

You'll then want to map this new stub you created for flowSupport to the actual flowSupport module in jest which is done through moduleNameMapper in the jest.config.js file.

moduleNameMapper: {
    '^lightning/flowSupport$':
        '<rootDir>/force-app/main/default/lwc/__tests__/lightning/yourFlowSupportStub'
},

In your jest test, you'll then import this module (which'll actual leverage your stub you created above)

import { FlowNavigationNextEvent } from "lightning/flowSupport";

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.