You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
We are moving to Angular 13 and are now finding that out existing E2E tests (stored in an e2e folder) are failing because we use imports from other Angular 13 packages and from the src folder within the same repo.
We have seen some similar issues and realised that one of our issues is because Angular 13 no longer compiles to CommonJS e.g.
/Users/liam.docherty/CodeRepos/angular-13-playwright-demo-consumer/node_modules/@angular/common/fesm2015/common.mjs:7
import * as i0 from '@angular/core';
^^^^^^
SyntaxError: Cannot use import statement outside a module
Error: Directory import '/Users/liam.docherty/CodeRepos/angular-13-playwright-demo-consumer/src/constants' is not supported resolving ES modules imported from /Users/liam.docherty/CodeRepos/angular-13-playwright-demo-consumer/e2e/specs/example.spec.ts
I can resolve this by changing that import to use the full path and add the a file extension. E.g.
import { title } from '../../src/constants';
to
import { title } from '../../src/constants/title.js';
However this then causes another issue:
Error: Directory import '/Users/liam.docherty/CodeRepos/angular-13-playwright-demo-consumer/src/mocks' is not supported resolving ES modules imported from /Users/liam.docherty/CodeRepos/angular-13-playwright-demo-consumer/src/constants/title.ts
Which is caused by us using imports from from index.ts files within the src code. We have many instances of this within our real use case.
We are looking for some advice on our options?
The text was updated successfully, but these errors were encountered:
@liamdocherty10 Unfortunately, there are no good options here. The reason is:
To import an ESM-only package, you have to use an import statement, because require does not load ES modules. Since angular is only shipping an ESM package, you must import.
We are moving to Angular 13 and are now finding that out existing E2E tests (stored in an e2e folder) are failing because we use imports from other Angular 13 packages and from the
src
folder within the same repo.We have seen some similar issues and realised that one of our issues is because Angular 13 no longer compiles to CommonJS e.g.
I have put together a simple repo to demonstrate the issue: https://github.com/liam-docherty/angular-13-playwright-demo-consumer.
In our company's use case we use an internal package but the issues can be easily replicated by using
@angular/common
as an import.The tests will fail to run because I have included an import from
@angular/common
in https://github.com/liam-docherty/angular-13-playwright-demo-consumer/blob/master/e2e/specs/example.spec.ts.I have then created a follow up branch where I changed to
"type": "module"
in package.json: https://github.com/liam-docherty/angular-13-playwright-demo-consumer/compare/module-typeHowever I then get the following error:
I can resolve this by changing that import to use the full path and add the a file extension. E.g.
to
However this then causes another issue:
Which is caused by us using imports from from
index.ts
files within thesrc
code. We have many instances of this within our real use case.We are looking for some advice on our options?
The text was updated successfully, but these errors were encountered: