From 224ea0b0b6b42e2e250ec97e0b11f1e5ef5c9fab Mon Sep 17 00:00:00 2001 From: David Gnanasekaran Date: Sat, 26 Aug 2017 14:24:56 +0530 Subject: [PATCH 1/3] Modified .csproject to emit the wwwroot/dist folder, if the folder is not created yet --- Asp2017.csproj | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/Asp2017.csproj b/Asp2017.csproj index db3c39eb..1bebcdf2 100644 --- a/Asp2017.csproj +++ b/Asp2017.csproj @@ -23,6 +23,20 @@ + + + + + + + + + + + + + From 3ade01ea392de5fd2d5aeb5e0a7b8803fab99779 Mon Sep 17 00:00:00 2001 From: davidsekar Date: Mon, 4 Sep 2017 19:54:43 +0530 Subject: [PATCH 2/3] Remove Jest and added Karma test runner for executing unit test cases --- Asp2017.csproj | 2 +- ClientApp/test/boot-tests.js | 30 +++++++ ClientApp/test/jestGlobalMocks.ts | 15 ---- ClientApp/test/karma.conf.js | 46 +++++++++++ ClientApp/test/setupJest.ts | 2 - ClientApp/test/webpack.config.test.js | 112 ++++++++++++++++++++++++++ package.json | 30 +++---- 7 files changed, 201 insertions(+), 36 deletions(-) create mode 100644 ClientApp/test/boot-tests.js delete mode 100644 ClientApp/test/jestGlobalMocks.ts create mode 100644 ClientApp/test/karma.conf.js delete mode 100644 ClientApp/test/setupJest.ts create mode 100644 ClientApp/test/webpack.config.test.js diff --git a/Asp2017.csproj b/Asp2017.csproj index 1bebcdf2..d944c48d 100644 --- a/Asp2017.csproj +++ b/Asp2017.csproj @@ -54,7 +54,7 @@ - + diff --git a/ClientApp/test/boot-tests.js b/ClientApp/test/boot-tests.js new file mode 100644 index 00000000..eba839d2 --- /dev/null +++ b/ClientApp/test/boot-tests.js @@ -0,0 +1,30 @@ +Error.stackTraceLimit = Infinity; +// Load required polyfills and testing libraries +require('reflect-metadata'); +require('zone.js'); +require('zone.js/dist/long-stack-trace-zone'); +require('zone.js/dist/proxy.js'); +require('zone.js/dist/sync-test'); +require('zone.js/dist/jasmine-patch'); +require('zone.js/dist/async-test'); +require('zone.js/dist/fake-async-test'); +const testing = require('@angular/core/testing'); +const testingBrowser = require('@angular/platform-browser-dynamic/testing'); + +// Prevent Karma from running prematurely +__karma__.loaded = function () {}; + +// First, initialize the Angular testing environment +testing.getTestBed().initTestEnvironment( + testingBrowser.BrowserDynamicTestingModule, + testingBrowser.platformBrowserDynamicTesting() +); + +// Then we find all the tests +const context = require.context('../', true, /\.spec\.ts$/); + +// And load the modules +context.keys().map(context); + +// Finally, start Karma to run the tests +__karma__.start(); diff --git a/ClientApp/test/jestGlobalMocks.ts b/ClientApp/test/jestGlobalMocks.ts deleted file mode 100644 index e5e90ebc..00000000 --- a/ClientApp/test/jestGlobalMocks.ts +++ /dev/null @@ -1,15 +0,0 @@ -const mock = () => { - let storage = {}; - return { - getItem: key => key in storage ? storage[key] : null, - setItem: (key, value) => storage[key] = value || '', - removeItem: key => delete storage[key], - clear: () => storage = {} - }; -}; - -Object.defineProperty(window, 'localStorage', {value: mock()}); -Object.defineProperty(window, 'sessionStorage', {value: mock()}); -Object.defineProperty(window, 'getComputedStyle', { - value: () => ['-webkit-appearance'] -}); diff --git a/ClientApp/test/karma.conf.js b/ClientApp/test/karma.conf.js new file mode 100644 index 00000000..0ae99871 --- /dev/null +++ b/ClientApp/test/karma.conf.js @@ -0,0 +1,46 @@ +// Karma configuration file, see link for more information +// https://karma-runner.github.io/0.13/config/configuration-file.html + +module.exports = function (config) { + config.set({ + basePath: '.', + frameworks: ['jasmine'], + exclude: [], + files: [ + './boot-tests.js' + ], + preprocessors: { + './boot-tests.js': ['coverage', 'webpack', 'sourcemap'] + }, + client: { + captureConsole: false + }, + coverageReporter: { + type: 'in-memory' + }, + remapCoverageReporter: { + 'text-summary': null, + json: './coverage/coverage.json', + html: './coverage/html' + }, + reporters: ['mocha', 'coverage', 'remap-coverage'], + port: 9876, + colors: true, + logLevel: config.LOG_WARN, + autoWatch: false, + browsers: ['Chrome'], + mime: { + 'application/javascript': ['ts', 'tsx'] + }, + singleRun: true, + webpack: require('./webpack.config.test.js')({ + env: 'test' + }), + webpackMiddleware: { + noInfo: true, + stats: { + chunks: false + } + } + }); +}; diff --git a/ClientApp/test/setupJest.ts b/ClientApp/test/setupJest.ts deleted file mode 100644 index 1d3bd024..00000000 --- a/ClientApp/test/setupJest.ts +++ /dev/null @@ -1,2 +0,0 @@ -import 'jest-preset-angular'; -import './jestGlobalMocks'; diff --git a/ClientApp/test/webpack.config.test.js b/ClientApp/test/webpack.config.test.js new file mode 100644 index 00000000..6818b46c --- /dev/null +++ b/ClientApp/test/webpack.config.test.js @@ -0,0 +1,112 @@ +const ContextReplacementPlugin = require('webpack/lib/ContextReplacementPlugin'); +const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin'); + +var path = require('path'); +var rootPath = path.join.bind(path, path.resolve(__dirname, '../../')); + +module.exports = function (options) { + return { + devtool: 'inline-source-map', + resolve: { + extensions: ['.ts', '.js'], + modules: [rootPath('ClientApp'), 'node_modules'] + }, + module: { + rules: [{ + enforce: 'pre', + test: /\.js$/, + loader: 'source-map-loader', + exclude: [ + rootPath('node_modules/rxjs'), + rootPath('node_modules/@angular') + ] + }, + { + test: /\.ts$/, + use: [{ + loader: 'awesome-typescript-loader', + query: { + sourceMap: false, + inlineSourceMap: true, + compilerOptions: { + removeComments: true + } + }, + }, + 'angular2-template-loader' + ], + exclude: [/\.e2e\.ts$/] + }, + { + test: /\.css$/, + loader: ['to-string-loader', 'css-loader'] + }, + { + test: /\.scss$/, + loader: ['raw-loader', 'sass-loader'] + }, + { + test: /\.html$/, + loader: 'raw-loader' + }, + { + enforce: 'post', + test: /\.(js|ts)$/, + loader: 'istanbul-instrumenter-loader', + options: { + esModules: true + }, + include: rootPath('ClientApp'), + exclude: [ + /ClientApp\\test/, + /\.(e2e|spec)\.ts$/, + /node_modules/ + ] + } + + ] + }, + plugins: [ + new ContextReplacementPlugin( + /** + * The (\\|\/) piece accounts for path separators in *nix and Windows + */ + /angular(\\|\/)core(\\|\/)@angular/, + rootPath('ClientApp'), // location of your src + { + /** + * your Angular Async Route paths relative to this root directory + */ + } + ), + new LoaderOptionsPlugin({ + debug: false, + options: { + /** + * legacy options go here + */ + } + }), + + ], + performance: { + hints: false + }, + + /** + * Include polyfills or mocks for various node stuff + * Description: Node configuration + * + * See: https://webpack.github.io/docs/configuration.html#node + */ + node: { + global: true, + process: false, + crypto: 'empty', + module: false, + clearImmediate: false, + setImmediate: false + } + + }; +} diff --git a/package.json b/package.json index 66b937c3..6072e16c 100644 --- a/package.json +++ b/package.json @@ -2,8 +2,8 @@ "name": "angular4-aspnetcore-universal", "version": "1.0.0-rc3", "scripts": { - "test": "jest", - "test:watch": "npm run test -- --watch", + "test": "karma start ClientApp/test/karma.conf.js", + "test:watch": "npm run test -- --auto-watch --no-single-run", "test:ci": "npm run test -- --runInBand", "test:coverage": "npm run test -- --coverage", "build:dev": "npm run build:vendor && npm run build:webpack", @@ -11,19 +11,6 @@ "build:prod": "npm run build:vendor -- --env.prod && npm run build:webpack -- --env.prod", "build:vendor": "webpack --config webpack.config.vendor.js --progress --color" }, - "jest": { - "preset": "jest-preset-angular", - "setupTestFrameworkScriptFile": "./ClientApp/test/setupJest.ts", - "globals": { - "__TS_CONFIG__": "ClientApp/tsconfig.spec.json", - "__TRANSFORM_HTML__": true - }, - "coveragePathIgnorePatterns": [ - "/node_modules/", - "/ClientApp/test/.*.ts" - ], - "coverageDirectory": "coverage" - }, "dependencies": { "@angular/animations": "^4.3.0", "@angular/common": "^4.3.0", @@ -81,12 +68,19 @@ "@ngtools/webpack": "^1.3.0", "@types/chai": "^3.4.34", "@types/jasmine": "^2.5.37", - "@types/jest": "^19.2.3", "chai": "^3.5.0", "codelyzer": "^3.0.0", + "istanbul-instrumenter-loader": "^3.0.0", "jasmine-core": "^2.5.2", - "jest": "^20.0.0", - "jest-preset-angular": "^2.0.1", + "karma": "^1.7.1", + "karma-chai": "^0.1.0", + "karma-chrome-launcher": "^2.2.0", + "karma-coverage": "^1.1.1", + "karma-jasmine": "^1.1.0", + "karma-mocha-reporter": "^2.2.4", + "karma-remap-coverage": "^0.1.4", + "karma-sourcemap-loader": "^0.3.7", + "karma-webpack": "^2.0.3", "tslint": "^5.0.0" } } From 135899cc765fcb051190c82b90e8cd09fb4fa451 Mon Sep 17 00:00:00 2001 From: davidsekar Date: Thu, 7 Sep 2017 20:08:47 +0530 Subject: [PATCH 3/3] Added PhantomJS for running test in CI environments. Removed deprecated tslint rules and amended existing rules. --- ClientApp/test/boot-tests.js | 2 +- ClientApp/test/karma.conf.js | 19 +++++++++++++++ ClientApp/test/webpack.config.test.js | 5 ++++ package.json | 7 ++++-- tsconfig.json | 2 ++ tslint.json | 33 ++++++--------------------- 6 files changed, 39 insertions(+), 29 deletions(-) diff --git a/ClientApp/test/boot-tests.js b/ClientApp/test/boot-tests.js index eba839d2..647b8c02 100644 --- a/ClientApp/test/boot-tests.js +++ b/ClientApp/test/boot-tests.js @@ -1,6 +1,6 @@ Error.stackTraceLimit = Infinity; // Load required polyfills and testing libraries -require('reflect-metadata'); +require('core-js'); // Added for Phantomjs require('zone.js'); require('zone.js/dist/long-stack-trace-zone'); require('zone.js/dist/proxy.js'); diff --git a/ClientApp/test/karma.conf.js b/ClientApp/test/karma.conf.js index 0ae99871..b54ce8f9 100644 --- a/ClientApp/test/karma.conf.js +++ b/ClientApp/test/karma.conf.js @@ -7,6 +7,7 @@ module.exports = function (config) { frameworks: ['jasmine'], exclude: [], files: [ + '../../wwwroot/dist/vendor.js', './boot-tests.js' ], preprocessors: { @@ -41,6 +42,24 @@ module.exports = function (config) { stats: { chunks: false } + }, + // you can define custom flags + customLaunchers: { + 'PhantomJS_custom': { + base: 'PhantomJS', + options: { + windowName: 'test-window', + settings: { + webSecurityEnabled: false + } + }, + flags: ['--load-images=true'], + // debug: true + } + }, + phantomjsLauncher: { + // Have phantomjs exit if a ResourceError is encountered (useful if karma exits without killing phantom) + exitOnResourceError: true } }); }; diff --git a/ClientApp/test/webpack.config.test.js b/ClientApp/test/webpack.config.test.js index 6818b46c..3a14d96d 100644 --- a/ClientApp/test/webpack.config.test.js +++ b/ClientApp/test/webpack.config.test.js @@ -1,6 +1,7 @@ const ContextReplacementPlugin = require('webpack/lib/ContextReplacementPlugin'); const LoaderOptionsPlugin = require('webpack/lib/LoaderOptionsPlugin'); +const webpack = require('webpack'); var path = require('path'); var rootPath = path.join.bind(path, path.resolve(__dirname, '../../')); @@ -67,6 +68,10 @@ module.exports = function (options) { ] }, plugins: [ + new webpack.DllReferencePlugin({ + context: __dirname, + manifest: require(rootPath('wwwroot', 'dist', 'vendor-manifest.json')) + }), new ContextReplacementPlugin( /** * The (\\|\/) piece accounts for path separators in *nix and Windows diff --git a/package.json b/package.json index 8259417b..b35ac7ab 100644 --- a/package.json +++ b/package.json @@ -2,9 +2,11 @@ "name": "angular4-aspnetcore-universal", "version": "1.0.0-rc3", "scripts": { - "test": "karma start ClientApp/test/karma.conf.js", + "lint": "tslint -p tsconfig.json", + "test": "npm run build:vendor && karma start ClientApp/test/karma.conf.js", "test:watch": "npm run test -- --auto-watch --no-single-run", - "test:ci": "npm run test -- --runInBand", + "test:ci": "npm run test -- --browsers PhantomJS_custom", + "test:ci:watch": "npm run test:ci -- --auto-watch --no-single-run", "test:coverage": "npm run test -- --coverage", "build:dev": "npm run build:vendor && npm run build:webpack", "build:webpack": "webpack --progress --color", @@ -78,6 +80,7 @@ "karma-coverage": "^1.1.1", "karma-jasmine": "^1.1.0", "karma-mocha-reporter": "^2.2.4", + "karma-phantomjs-launcher": "^1.0.4", "karma-remap-coverage": "^0.1.4", "karma-sourcemap-loader": "^0.3.7", "karma-webpack": "^2.0.3", diff --git a/tsconfig.json b/tsconfig.json index 0e68aae4..23317dc5 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -3,12 +3,14 @@ "moduleResolution": "node", "module": "es2015", "target": "es5", + "alwaysStrict": true, "noImplicitAny": false, "sourceMap": true, "experimentalDecorators": true, "emitDecoratorMetadata": true, "skipDefaultLibCheck": true, "skipLibCheck": true, + "allowUnreachableCode": false, "lib": [ "es2016", "dom" diff --git a/tslint.json b/tslint.json index bfbd3f5a..657d49b6 100644 --- a/tslint.json +++ b/tslint.json @@ -8,32 +8,20 @@ "check-space" ], "component-class-suffix": true, - "component-selector-name": [ + "component-selector": [ true, + "element", + "app", "kebab-case" ], - "component-selector-prefix": [ - true, - "app" - ], - "component-selector-type": [ - true, - "element" - ], "curly": false, "directive-class-suffix": true, - "directive-selector-name": [ + "directive-selector": [ true, + "attribute", + "app", "camelCase" ], - "directive-selector-prefix": [ - true, - "app" - ], - "directive-selector-type": [ - true, - "attribute" - ], "eofline": true, "forin": true, "import-destructuring-spacing": true, @@ -44,7 +32,6 @@ "interface-name": false, "jsdoc-format": true, "label-position": true, - "label-undefined": true, "max-line-length": [ true, 200 @@ -73,7 +60,6 @@ "no-construct": true, "no-constructor-vars": false, "no-debugger": true, - "no-duplicate-key": true, "no-duplicate-variable": true, "no-empty": false, "no-eval": true, @@ -88,7 +74,6 @@ "no-string-literal": false, "no-switch-case-fall-through": true, "no-trailing-whitespace": false, - "no-unreachable": true, "no-unused-expression": true, "no-unused-variable": false, "no-use-before-declare": true, @@ -153,10 +138,6 @@ "use-life-cycle-interface": true, "use-output-property-decorator": true, "use-pipe-transform-interface": true, - "use-strict": [ - true, - "check-module" - ], "variable-name": [ true, "check-format", @@ -175,4 +156,4 @@ "rulesDirectory": [ "node_modules/codelyzer" ] -} \ No newline at end of file +}