Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: update sfdx lwc jest #257

Merged
merged 3 commits into from
Jul 7, 2021
Merged

feat: update sfdx lwc jest #257

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
56f7f9e
feat: update sfdx lwc jest
msrivastav13 Jun 21, 2021
935a51f
fix: update sfdx-lwc-jest to 0.14.0
msrivastav13 Jul 1, 2021
e2e8f93
fix: explicitly mockup apex wire calls
msrivastav13 Jul 1, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 8 additions & 19 deletions es-space-mgmt/main/default/lwc/customerList/__tests__/customerList.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,22 +8,9 @@ import FLOW_STATUS_CHANGE_MC from '@salesforce/messageChannel/Flow_Status_Change

import { refreshApex } from '@salesforce/apex';

import {
registerApexTestWireAdapter,
registerTestWireAdapter
} from '@salesforce/sfdx-lwc-jest';

// Realistic data with a list of customers
const mockCustomerList = require('./data/getCustomerList.json');

// Register as Apex wire adapter. Some tests verify that data is retrieved.
const getCustomerListAdapter = registerApexTestWireAdapter(getCustomerList);
Copy link

@jodarove jodarove Jul 1, 2021 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@msrivastav13 the platform does not auto-mock apex methods (see my previous comment), this module will need to be mocked by test authors. One way of doing this is:

jest.mock(
    '@salesforce/apex/reservationManagerController.getCustomerList',
    () => {
        const { createApexTestWireAdapter } = require('@salesforce/sfdx-lwc-jest');
        return {
            default: createApexTestWireAdapter(jest.fn().mockImplementation(() => Promise.resolve())),
        };
    },
    { virtual: true }
);

Copy link
Contributor Author

@msrivastav13 msrivastav13 Jul 1, 2021 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@jodarove I simplified it to be like below

jest.mock(
    '@salesforce/apex/reservationManagerController.getCustomerList',
    () => {
        const { createApexTestWireAdapter } = require('@salesforce/sfdx-lwc-jest');
        return {
            default: createApexTestWireAdapter(jest.fn()),
        };
    },
    { virtual: true }
);

It worked fine.

If you do not mind could you review the commits here

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@pozil Will merge once I get approval from you.

We might want to broadcast this to a larger audience (maybe Twitter or stackexchange or Salesforce Developers Trailblazer Community)as they will be in the same boat if they are upgrading to the newer version.

Also whoever wrote this module on the trailhead, needs to be notified I guess.


// Register as a standard wire adapter because the component under test requires this adapter.
// We don't exercise this wire adapter in the tests.
// eslint-disable-next-line @lwc/lwc/no-unexpected-wire-adapter-usages
const messageContextWireAdapter = registerTestWireAdapter(MessageContext);

const SOBJECT_TYPE = 'Lead';

// mock apex refresh method
Expand Down Expand Up @@ -55,7 +42,7 @@ describe('c-customer-list', () => {
document.body.appendChild(element);

// Emit data from @wire
getCustomerListAdapter.emit(mockCustomerList);
getCustomerList.emit(mockCustomerList);

return Promise.resolve().then(() => {
const customerTileElements =
Expand All @@ -79,7 +66,7 @@ describe('c-customer-list', () => {
document.body.appendChild(element);

// Emit error from @wire
getCustomerListAdapter.error(WIRE_ERROR);
getCustomerList.error(WIRE_ERROR);

return Promise.resolve().then(() => {
const errorPanelEl =
Expand Down Expand Up @@ -111,7 +98,7 @@ describe('c-customer-list', () => {
document.body.appendChild(element);

// Emit data from @wire
getCustomerListAdapter.emit(mockCustomerList);
getCustomerList.emit(mockCustomerList);

return Promise.resolve().then(() => {
const customerTileElement =
Expand Down Expand Up @@ -158,8 +145,10 @@ describe('c-customer-list', () => {
status: 'FINISHED',
state: { sobjecttype: SOBJECT_TYPE }
};

publish(
messageContextWireAdapter,
// eslint-disable-next-line @lwc/lwc/no-unexpected-wire-adapter-usages
MessageContext,
FLOW_STATUS_CHANGE_MC,
messagePayload
);
Expand All @@ -178,7 +167,7 @@ describe('c-customer-list', () => {
document.body.appendChild(element);

// Emit data from @wire
getCustomerListAdapter.emit(mockCustomerList);
getCustomerList.emit(mockCustomerList);

return Promise.resolve().then(() => expect(element).toBeAccessible());
});
Expand All @@ -194,7 +183,7 @@ describe('c-customer-list', () => {
document.body.appendChild(element);

// Emit error from @wire
getCustomerListAdapter.error(WIRE_ERROR);
getCustomerList.error(WIRE_ERROR);

return Promise.resolve().then(() => expect(element).toBeAccessible());
});
Expand Down
18 changes: 7 additions & 11 deletions es-space-mgmt/main/default/lwc/relatedSpaces/__tests__/relatedSpaces.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import { createElement } from 'lwc';
import getRelatedSpaces from '@salesforce/apex/marketServices.getRelatedSpaces';
import { getNavigateCalledWith } from 'lightning/navigation';
import { registerApexTestWireAdapter } from '@salesforce/sfdx-lwc-jest';
import RelatedSpaces from 'c/relatedSpaces';

// Realistic data with a list of spaces
Expand All @@ -11,9 +10,6 @@ const mockRelatedSpaceRecords = require('./data/getRelatedSpaces.json');
// when there is no data to display
const mockRelatedSpacesNoRecords = require('./data/getRelatedSpacesNoRecords.json');

// Register as Apex wire adapter. Some tests verify that provisioned values trigger desired behavior.
const getRelatedSpacesAdapter = registerApexTestWireAdapter(getRelatedSpaces);

describe('c-related-spaces', () => {
afterEach(() => {
// The jsdom instance is shared across test cases in a single file so reset the DOM
Expand All @@ -32,7 +28,7 @@ describe('c-related-spaces', () => {
element.recordId = RECORD_ID;
document.body.appendChild(element);
// Emit data from @wire
getRelatedSpacesAdapter.emit(mockRelatedSpaceRecords);
getRelatedSpaces.emit(mockRelatedSpaceRecords);

// Return a promise to wait for any asynchronous DOM updates. Jest
// will automatically wait for the Promise chain to complete before
Expand All @@ -56,7 +52,7 @@ describe('c-related-spaces', () => {
element.recordId = RECORD_ID;
document.body.appendChild(element);
// Emit data from @wire
getRelatedSpacesAdapter.emit(mockRelatedSpacesNoRecords);
getRelatedSpaces.emit(mockRelatedSpacesNoRecords);

// Return a promise to wait for any asynchronous DOM updates. Jest
// will automatically wait for the Promise chain to complete before
Expand All @@ -76,7 +72,7 @@ describe('c-related-spaces', () => {
document.body.appendChild(element);

// Emit error from @wire
getRelatedSpacesAdapter.error();
getRelatedSpaces.error();

// Return a promise to wait for any asynchronous DOM updates. Jest
// will automatically wait for the Promise chain to complete before
Expand All @@ -103,7 +99,7 @@ describe('c-related-spaces', () => {
document.body.appendChild(element);

// Emit data from @wire
getRelatedSpacesAdapter.emit(mockRelatedSpaceRecords);
getRelatedSpaces.emit(mockRelatedSpaceRecords);

// Return a promise to wait for any asynchronous DOM updates. Jest
// will automatically wait for the Promise chain to complete before
Expand Down Expand Up @@ -141,7 +137,7 @@ describe('c-related-spaces', () => {
document.body.appendChild(element);

// Emit data from @wire
getRelatedSpacesAdapter.emit(mockRelatedSpaceRecords);
getRelatedSpaces.emit(mockRelatedSpaceRecords);

return Promise.resolve().then(() => expect(element).toBeAccessible());
});
Expand All @@ -156,7 +152,7 @@ describe('c-related-spaces', () => {
document.body.appendChild(element);

// Emit data from @wire
getRelatedSpacesAdapter.emit(mockRelatedSpacesNoRecords);
getRelatedSpaces.emit(mockRelatedSpacesNoRecords);

return Promise.resolve().then(() => expect(element).toBeAccessible());
});
Expand All @@ -168,7 +164,7 @@ describe('c-related-spaces', () => {
document.body.appendChild(element);

// Emit error from @wire
getRelatedSpacesAdapter.error();
getRelatedSpaces.error();

return Promise.resolve().then(() => expect(element).toBeAccessible());
});
Expand Down
34 changes: 21 additions & 13 deletions es-space-mgmt/main/default/lwc/reservationHelper/__tests__/reservationHelper.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,6 @@ import { subscribe, MessageContext, publish } from 'lightning/messageService';
import TILE_SELECTION_MC from '@salesforce/messageChannel/Tile_Selection__c';
import FLOW_STATUS_CHANGE_MC from '@salesforce/messageChannel/Flow_Status_Change__c';

import { registerTestWireAdapter } from '@salesforce/sfdx-lwc-jest';
// Register as a standard wire adapter because the component under test requires this adapter.
// We don't exercise this wire adapter in the tests.
// eslint-disable-next-line @lwc/lwc/no-unexpected-wire-adapter-usages
const messageContextWireAdapter = registerTestWireAdapter(MessageContext);

const MESSAGE_PAYLOAD = {
tileType: 'customer',
properties: {
Expand Down Expand Up @@ -79,7 +73,9 @@ describe('c-reservation-helper', () => {
element.addEventListener('customerchoice', handler);

// Simulate pulishing a message using TILE_SELECTION_MC message channel
publish(messageContextWireAdapter, TILE_SELECTION_MC, MESSAGE_PAYLOAD);
// We don't exercise this wire adapter in the tests.
// eslint-disable-next-line @lwc/lwc/no-unexpected-wire-adapter-usages
publish(MessageContext, TILE_SELECTION_MC, MESSAGE_PAYLOAD);

return Promise.resolve().then(() => {
// Validate if event got fired
Expand Down Expand Up @@ -109,14 +105,18 @@ describe('c-reservation-helper', () => {
element.addEventListener(ShowToastEventName, handler);

// Simulate pulishing a message using TILE_SELECTION_MC message channel
publish(messageContextWireAdapter, TILE_SELECTION_MC, MESSAGE_PAYLOAD);
// We don't exercise this wire adapter in the tests.
// eslint-disable-next-line @lwc/lwc/no-unexpected-wire-adapter-usages
publish(MessageContext, TILE_SELECTION_MC, MESSAGE_PAYLOAD);

return Promise.resolve()
.then(() => {
// Validate that the toast message does not fire for the first TILE_SELECTION_MC event
expect(handler).not.toHaveBeenCalled();
publish(
messageContextWireAdapter,
// We don't exercise this wire adapter in the tests.
// eslint-disable-next-line @lwc/lwc/no-unexpected-wire-adapter-usages
MessageContext,
TILE_SELECTION_MC,
MESSAGE_PAYLOAD
);
Expand All @@ -142,13 +142,17 @@ describe('c-reservation-helper', () => {
element.addEventListener('customerchoice', handler);

// Simulate pulishing a message using TILE_SELECTION_MC message channel
publish(messageContextWireAdapter, TILE_SELECTION_MC, MESSAGE_PAYLOAD);
// We don't exercise this wire adapter in the tests.
// eslint-disable-next-line @lwc/lwc/no-unexpected-wire-adapter-usages
publish(MessageContext, TILE_SELECTION_MC, MESSAGE_PAYLOAD);

return Promise.resolve()
.then(() => {
expect(handler).toHaveBeenCalledTimes(1);
publish(
messageContextWireAdapter,
// We don't exercise this wire adapter in the tests.
// eslint-disable-next-line @lwc/lwc/no-unexpected-wire-adapter-usages
MessageContext,
TILE_SELECTION_MC,
MESSAGE_PAYLOAD
);
Expand All @@ -170,7 +174,9 @@ describe('c-reservation-helper', () => {
element.addEventListener(ShowToastEventName, handler);

// Simulate pulishing a message using TILE_SELECTION_MC message channel
publish(messageContextWireAdapter, TILE_SELECTION_MC, MESSAGE_PAYLOAD);
// We don't exercise this wire adapter in the tests.
// eslint-disable-next-line @lwc/lwc/no-unexpected-wire-adapter-usages
publish(MessageContext, TILE_SELECTION_MC, MESSAGE_PAYLOAD);

return Promise.resolve().then(() => {
expect(handler).not.toHaveBeenCalled();
Expand Down Expand Up @@ -202,7 +208,9 @@ describe('c-reservation-helper', () => {

// Simulate pulishing a message using TILE_SELECTION_MC message channel
publish(
messageContextWireAdapter,
// We don't exercise this wire adapter in the tests.
// eslint-disable-next-line @lwc/lwc/no-unexpected-wire-adapter-usages
MessageContext,
TILE_SELECTION_MC,
CUSTOMER_MESSAGE_PAYLOAD
);
Expand Down
32 changes: 32 additions & 0 deletions es-space-mgmt/main/default/lwc/reservationHelperForm/__tests__/reservationHelperForm.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,26 @@
import { createElement } from 'lwc';
import { FlowNavigationNextEventName } from 'lightning/flowSupport';
import ReservationHelperForm from 'c/reservationHelperForm';
import getCustomerFields from '@salesforce/apex/customerServices.getCustomerFields';

// Mock realistic data
const APEX_GET_CUSTOMER_FIELDS_SUCCESS = {
city: 'MailingCity',
email: 'Email',
name: 'Name',
state: 'MailingState'
};

// Mocking imperative Apex method call
jest.mock(
'@salesforce/apex/customerServices.getCustomerFields',
() => {
return {
default: jest.fn()
};
},
{ virtual: true }
);
msrivastav13 marked this conversation as resolved.
Show resolved Hide resolved

describe('c-reservation-helper-form', () => {
afterEach(() => {
Expand All @@ -13,6 +33,9 @@ describe('c-reservation-helper-form', () => {
});

it('renders c-reservation-helper-form', () => {
// Assign mock value for resolved Apex promise
getCustomerFields.mockResolvedValue(APEX_GET_CUSTOMER_FIELDS_SUCCESS);

const CUSTOMERID = '00Q5500000BFveDEAT';
const OBJECTTYPE = 'Lead';
const STATE = 'CA';
Expand All @@ -37,6 +60,9 @@ describe('c-reservation-helper-form', () => {
});

it('dispatches customer update event', () => {
// Assign mock value for resolved Apex promise
getCustomerFields.mockResolvedValue(APEX_GET_CUSTOMER_FIELDS_SUCCESS);

const CUSTOMERID = '00Q5500000BFveDEAT';
const OBJECTTYPE = 'Lead';
const STATE = 'CA';
Expand Down Expand Up @@ -66,6 +92,9 @@ describe('c-reservation-helper-form', () => {
});

it('dispatches draft reservation event', () => {
// Assign mock value for resolved Apex promise
getCustomerFields.mockResolvedValue(APEX_GET_CUSTOMER_FIELDS_SUCCESS);

const CUSTOMERID = '00Q5500000BFveDEAT';
const OBJECTTYPE = 'Lead';
const STATE = 'CA';
Expand Down Expand Up @@ -96,6 +125,9 @@ describe('c-reservation-helper-form', () => {
});

it('is accessible', () => {
// Assign mock value for resolved Apex promise
getCustomerFields.mockResolvedValue(APEX_GET_CUSTOMER_FIELDS_SUCCESS);

const CUSTOMERID = '00Q5500000BFveDEAT';
const OBJECTTYPE = 'Lead';
const STATE = 'CA';
Expand Down
Loading