I am using Wallabyjs with Visual Studio, Angular 5, Webpack and Typescript. After it now happend a few times, that code was pushed to the repository although there was a compilation error in the spec files, I wanted to activate noEmitOnError with
compilerOptions.noEmitOnError = true;
compilerOptions.useStandardDefaults = true;
in my wallaby.js configuration file. Unfortunately, I am now getting three errors and I cannot get rid of them. (Without setting noEmitOnError to true, everything works fine!) The errors are:
Postprocessor run failure: TypeScript compiler errors:
- Error C:/Users/[NAME]/AppData/Local/Temp/.wallaby/projects/.../somefile.ts: Cannot find module '@angular/platform-browser'.
- Error: Cannot find type definition file for 'jasmine'.
- Error: Cannot find type definition file for 'node'.
The file the first error is referring to is a normal .ts file with a reduced content:
import { SafeUrl } from "@angular/platform-browser";
If I remove this line, the error is gone. And as the "normal" typescript compilation is working it is perhaps redundant to say but in the folder node_modules/@types there are two folders for jasmine and node.
Any ideas? I searched the internet but didn't find much. On one page I found something like this
Promise.all([System.import('@angular/core/testing'), System.import('@angular/platform-browser-dynamic/testing')])
.then(function (results) {
var testing = results[0];
var browser = results[1];
testing.setBaseTestProviders(
but I have no clue on how to do something like this in my setup with webpack and typescript...
As it may help, here is my wallaby configuration:
var wallabyWebpack = require('wallaby-webpack');
var path = require('path');
var compilerOptions = Object.assign(
require('./tsconfig.json').compilerOptions,
require('./src/tsconfig.spec.json').compilerOptions);
compilerOptions.module = 'CommonJs';
compilerOptions.noEmitOnError = true; // you may skip it if it's already set in tsconfig
compilerOptions.useStandardDefaults = true;
module.exports = function (wallaby) {
var webpackPostprocessor = wallabyWebpack({
entryPatterns: [
'src/wallabyTest.js',
'src/**/*spec.js'
],
module: {
rules: [
{ test: /\.css$/, loader: ['raw-loader', 'css-loader'] },
{ test: /\.html$/, loader: 'raw-loader' },
{ test: /\.ts$/, loader: '@ngtools/webpack', include: /node_modules/, query: { tsConfigPath: 'tsconfig.json' } },
{ test: /\.js$/, loader: 'angular2-template-loader', exclude: /node_modules/ },
{ test: /\.json$/, loader: 'json-loader' },
{ test: /\.styl$/, loaders: ['raw-loader', 'stylus-loader'] },
{ test: /\.less$/, loaders: ['raw-loader', 'less-loader'] },
{ test: /\.scss$|\.sass$/, loaders: ['raw-loader', 'sass-loader'] },
{ test: /\.(jpg|png)$/, loader: 'url-loader?limit=128000' }
]
},
resolve: {
extensions: ['.js', '.ts'],
modules: [
path.join(wallaby.projectCacheDir, 'src/app'),
path.join(wallaby.projectCacheDir, 'src'),
'node_modules'
]
},
node: {
fs: 'empty',
net: 'empty',
tls: 'empty',
dns: 'empty'
}
});
return {
files: [
{ pattern: 'src/**/*.+(ts|css|less|scss|sass|styl|html|json|svg)', load: false },
{ pattern: 'mocks/**/*.ts', load: false },
{ pattern: 'src/**/*.d.ts', ignore: true },
{ pattern: 'src/**/*spec.ts', ignore: true },
'!src/test.ts',
'!src/main.ts'
],
tests: [
{ pattern: 'src/**/*spec.ts', load: false },
{ pattern: 'src/**/*e2e-spec.ts', ignore: true }
],
testFramework: 'jasmine',
compilers: {
'**/*.ts': wallaby.compilers.typeScript(compilerOptions)
},
middleware: function (app, express) {
var path = require('path');
app.use('/favicon.ico', express.static(path.join(__dirname, 'src/favicon.ico')));
app.use('/assets', express.static(path.join(__dirname, 'src/assets')));
},
env: {
kind: 'chrome'
},
postprocessor: webpackPostprocessor,
setup: function () {
window.__moduleBundler.loadTests();
},
debug: false
};
};
And my tsconfig.json looks like this:
{
"compileOnSave": false,
"compilerOptions": {
"preserveSymlinks": true,
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"plugins": [
{
"name": "tslint-language-service",
"defaultSeverity": "error",
"ignoreDefinitionFiles": true
}
],
"lib": [
"es2017",
"dom"
]
}
}
Thanks a lot for any help! Cheers