-
-
Notifications
You must be signed in to change notification settings - Fork 311
Jest Tests Failing - "Cannot find module 'apollo-angular'" #1854
-
Hello!
I'm in the processing of upgrading from Angular 12 to Angular 14 (yes I know 15 was released recently haha...). I'm having the hardest time getting my tests to function. I ran all of the migrations via Nx and they were successful. However I'm still receiving the same error. I've been at this issue for over a week now and could really use some insight. My application builds and runs fine. But tests are not seeing a specific apollo-angular module in my node_modules folder:
Cannot find module 'apollo-angular' from '../data-access-team/src/lib/team/services/team-graphql/team-graphql.service.ts'
> 1 | import { Injectable } from '@angular/core';
> 2 | import { Apollo, ApolloBase, gql, MutationResult } from 'apollo-angular';
| ^
3 | import { Observable } from 'rxjs';
4 | import { map, tap } from 'rxjs/operators';
I'm not finding much on SO regarding this issue.. But any test that uses the apollo-angular as a dependency are failing now.
Here the relevant package versions:
"ts-jest": "^29.0.3",
"typescript": "4.8.4",
"jest": "28.1.1",
"jest-preset-angular": "^12.2.2",
"apollo-angular": "^4.1.0",
"@apollo/client": "^3.7.1",
"graphql": "^16.6.0",
"graphql-ws": "^5.11.2",
I'm trying this on both node 14 and 16.
I read something about apollo-angular using mjs and tried a few things to allow for that. But to be frank, I don't know much about mjs/ES modules and how it impacts jest.
I've and tried a few things but nothing seems to have worked:
https://thymikee.github.io/jest-preset-angular/docs/11.1/guides/angular-13+/
I've also tried changing the transformIgnorePatterns property in the jest.config.ts for the library I'm working in to this pattern:
transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$|apollo-angular)'],
This was recommended by a few SO/forum posts. However I have had no luck with this solution.
Not sure if anyone has run into this before.. but hoping for some insight/ideas?
Any help would be greatly appreciated.
Beta Was this translation helpful? Give feedback.
All reactions
A solution has appeared! After a ton of research, I found that adding the following resolver to my jest.config.ts allowed the tests to execute successfully.
/* eslint-disable */
import { pathsToModuleNameMapper } from 'ts-jest';
const { paths } = require('../../../tsconfig.base.json').compilerOptions;
export default {
displayName: 'shared-data-access-auth',
preset: 'jest-preset-angular',
setupFilesAfterEnv: ['../../../jest-setup.ts'],
moduleNameMapper: pathsToModuleNameMapper(paths, {
prefix: '<rootDir>/../../..',
}),
globals: {
'ts-jest': {
tsconfig: '<rootDir>/tsconfig.spec.json',
},
},
transform: {
'^.+.(ts|mjs|js|html)$': 'jest-preset-angular',
...Replies: 1 comment
-
A solution has appeared! After a ton of research, I found that adding the following resolver to my jest.config.ts allowed the tests to execute successfully.
/* eslint-disable */
import { pathsToModuleNameMapper } from 'ts-jest';
const { paths } = require('../../../tsconfig.base.json').compilerOptions;
export default {
displayName: 'shared-data-access-auth',
preset: 'jest-preset-angular',
setupFilesAfterEnv: ['../../../jest-setup.ts'],
moduleNameMapper: pathsToModuleNameMapper(paths, {
prefix: '<rootDir>/../../..',
}),
globals: {
'ts-jest': {
tsconfig: '<rootDir>/tsconfig.spec.json',
},
},
transform: {
'^.+.(ts|mjs|js|html)$': 'jest-preset-angular',
},
transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$)'],
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json'],
resolver: 'jest-preset-angular/build/resolvers/ng-jest-resolver.js',
};
The key factors of this fix were the transformIgnorePatterns of ['node_modules/(?!.*\\.mjs$)'], and the resolver of 'jest-preset-angular/build/resolvers/ng-jest-resolver.js',
Hope this helps someone else!
Beta Was this translation helpful? Give feedback.