Getting this error: Invalid LWC imported identifier "createElement" on a LWC test file when running force:deploy
See original GitHub issueDescription
We have added LWC Jest unit testing into our repo. In the lwc component’s test file we import “createElement”, per the Salesforce Jest documentation. When we run our tests from the terminal, they pass. We have **/__tests__/** listed in our .forceignore file, so when I run “SFDX:Deploy Source to Org” from VS Code on my lwc folder to my personal sandbox, I receive no errors.
The problem occurs when we are using our CI/CD ADO pipeline to deploy our code to our dev sandbox (command force:deploy is run). It seems the test folder is not being ignored, and we receive this deploy error:
Invalid LWC imported identifier “createElement”.
Steps to Reproduce
import { createElement } from 'lwc';
import HelperTextList from 'c/helperTextList';
describe('c-helper-text-list', () => {
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);
}
});
test('element has does not have comma when first item', () => {
const element = createElement('c-helper-text-list', { is: HelperTextList });
document.body.appendChild(element);
// Property value is assigned after the component is inserted into the DOM
element.index = 0;
const span = element.shadowRoot.querySelector('span');
// Use a promise to wait for asynchronous changes to the DOM
return Promise.resolve().then(() => {
expect(span.textContent).not.toBe(', ');
});
});
test('element has does have comma when second item', () => {
const element = createElement('c-helper-text-list', { is: HelperTextList });
element.index = 1;
document.body.appendChild(element);
// Use a promise to wait for asynchronous changes to the DOM
return Promise.resolve().then(() => {
const span = element.shadowRoot.querySelector('.comma');
expect(span.textContent).toBe(', ');
});
});
});
<!-- HTML for component under test -->
<template>
<span class="comma" if:true={hasMultiple}>, </span>
<span><slot></slot></span>
</template>
import { LightningElement, api } from 'lwc';
export default class HelperTextList extends LightningElement {
@api index;
hasMultiple = false;
renderedCallback() {
if (this.index >= 1) {
this.hasMultiple = true;
}
}
}
# List files or directories below to ignore them when running force:source:push, force:source:pull, and force:source:status
# More information: https://developer.salesforce.com/docs/atlas.en-us.sfdx_dev.meta/sfdx_dev/sfdx_dev_exclude_source.htm
#
package.xml
# LWC configuration files
**/jsconfig.json
**/.eslintrc.json
# LWC Jest
**/__tests__/**
sfdx force:deploy
Expected Results
Files are deployed to the sandbox and the test files are ignored.
Actual Results
Deployment fails, error: 2020-07-16T19:28:13.5612990Z Error force-app\main\default\lwc\helperTextList_tests_\helperTextList.test.js [Line: 1, Col: 9] LWC1518: Invalid LWC imported identifier “createElement” 2020-07-16T19:28:13.6151707Z ERROR running force:source:deploy: Deploy failed.
Version
- @salesforce/sfdx-lwc-jest: ^0.7.1
- Node: ^6.9.0
Possible Solution
Additional context/Screenshots
Issue Analytics
- State:
- Created 3 years ago
- Comments:26 (6 by maintainers)
Top Related StackOverflow Question
@paintingemily and I worked and found that their deployment pipeline was configured to drop the
.forceignorefile along the way. Ensuring the file progressed through the phases appears to have resolved the issue.Waiting on @paintingemily to confirm and close.
@aheber – Apparently that version is from my local/VS Code, I assumed it was the same as CI. In our pipeline, we do a fresh install every time of sfdx – so the last release shows version: sfdx-cli@7.66.2