ArtemGovorov
commented
1 year ago There are 2 configs with custom names that are used when running Jest tests: jest.config.angular.ts and tsconfig.spec.ts.
Hello, since you are using a custom jest config file name, the docs section that you have referenced points to the article on how to override Wallaby auto-config to specify custom Jest config path:
module.exports = () => {
return {
testFramework: {
// the jest configuration file path
// (relative to project root)
configFile: './jest.config.angular.ts'
}
}
};Please try the solution and let us know if it's working for you.
node-ex
NikGovorov
smcenlly
Hello,
I have a small project that is based on Angular CLI + Jest setup (via Angular Jest Builder).
ng testworks, but Wallaby.js does not, even though, according to documentation, it should work with Automatic configuration.Here is the only test in the project:
It fails on the first
importwith an errorSyntaxError: Cannot use import statement outside a module. It looks like*.spec.tsfiles are not transpiled into the JS form that can be read by Jest.There are 2 configs with custom names that are used when running Jest tests:
jest.config.angular.tsandtsconfig.spec.ts.Could you, please, help me make this setup work with Wallaby.js?
Wallaby diagnostics report
Wallaby diagnostics report
``` { editorVersion: '1.74.2', pluginVersion: '1.0.348', editorType: 'VSCode', osVersion: 'linux 5.4.0-135-generic', nodeVersion: 'v16.17.0', coreVersion: '1.0.1365', checksum: 'NjU0ZjZhMmY2NWM4ZWExMGIyZDYyMmIxYWQxNDVmMDgsMTcwMDc4NDAwMDAwMCww', config: { diagnostics: { angular: { workspace: { '$schema': './node_modules/@angular/cli/lib/config/schema.json', version: 1, newProjectRoot: 'projects', projects: { 'angular-tic-tac-toe': { projectType: 'application', schematics: { '@schematics/angular:component': { style: 'scss' } }, root: '', sourceRoot: 'src', prefix: 'app', architect: { build: { builder: '@angular-builders/custom-webpack:browser', options: { customWebpackConfig: { path: './custom-webpack.config.ts' }, main: 'src/main.ts', index: 'src/index.html', tsConfig: 'tsconfig.app.json', outputPath: 'dist/angular-tic-tac-toe', polyfills: [ 'zone.js' ], assets: [ 'src/favicon.ico', 'src/assets', 'src/manifest.webmanifest' ], inlineStyleLanguage: 'scss', styles: [ 'node_modules/primeicons/primeicons.css', 'node_modules/primeng/resources/themes/lara-dark-blue/theme.css', 'node_modules/primeng/resources/primeng.min.css', 'src/styles.scss' ], scripts: [], serviceWorker: true, ngswConfigPath: 'ngsw-config.json' }, configurations: { production: { fileReplacements: [ { replace: 'src/environments/environment.ts', with: 'src/environments/environment.production.ts' } ], budgets: [ { type: 'initial', maximumWarning: '500kb', maximumError: '1mb' }, { type: 'anyComponentStyle', maximumWarning: '2kb', maximumError: '4kb' } ], outputHashing: 'all' }, development: { fileReplacements: [ { replace: 'src/environments/environment.ts', with: 'src/environments/environment.development.ts' } ], buildOptimizer: false, optimization: false, vendorChunk: true, extractLicenses: false, sourceMap: true, namedChunks: true } }, defaultConfiguration: 'production' }, serve: { builder: '@angular-builders/custom-webpack:dev-server', options: { browserTarget: 'angular-tic-tac-toe:build' }, configurations: { production: { browserTarget: 'angular-tic-tac-toe:build:production' }, development: { browserTarget: 'angular-tic-tac-toe:build:development' } }, defaultConfiguration: 'development' }, 'extract-i18n': { builder: '@angular-builders/custom-webpack:extract-i18n', options: { browserTarget: 'angular-tic-tac-toe:build' } }, lint: { builder: '@angular-eslint/builder:lint', options: { lintFilePatterns: [ 'src/**/*.ts', 'src/**/*.html' ] } }, deploy: { builder: '@angular/fire:deploy', options: { prerender: false, ssr: false, browserTarget: 'angular-tic-tac-toe:build:production', firebaseProject: 'angular-tic-tac-toe-eb2e5', firebaseHostingSite: 'angular-tic-tac-toe-eb2e5' } }, test: { builder: '@angular-builders/jest:run', options: { configPath: 'jest.config.angular.js', tsConfig: 'tsconfig.spec.json', assets: [ 'src/favicon.ico', 'src/assets' ], styles: [ 'src/styles.scss' ], scripts: [] } } } } }, cli: { schematicCollections: [ '@angular-eslint/schematics' ] } } }, jest: { config: { configs: [ { automock: false, cache: true, cacheDirectory: '/tmp/jest_rs', clearMocks: false, coveragePathIgnorePatterns: [ '/node_modules/' ], cwd: '