Блог

Я пытаюсь протестировать компонент angular 2, используя jasmine с Karma. Когда я запускаю скрипт npm на терминале Mac, я получаю-

 PhantomJS 2.1.1 (Mac OS X 0.0.0) ERROR
ReferenceError: Can't find variable: require
at /Users/Admin/Downloads/kamal/development/self/provat/node_modules/core-js/es6/array.js:1
PhantomJS 2.1.1 (Mac OS X 0.0.0): Executed 0 of 0 ERROR (0.274 secs / 0 secs)
Chrome 53.0.2785 (Mac OS X 10.10.4) ERROR
Uncaught ReferenceError: require is not defined
at /Users/Admin/Downloads/kamal/development/self/provat/node_modules/core-js/es6/array.js:1
Chrome 53.0.2785 (Mac OS X 10.10.4): Executed 0 of 0 ERROR (0.339 secs / 0 secs)
  

Следующий код взят из karma.conf.js —

 'use strict';

module.exports = function(config) {
config.set({
    autoWatch: true,
    browsers: ['Chrome', 'PhantomJS'],
    files: [
        '../../node_modules/core-js/es6/**.js',
        '../../node_modules/core-js/es7/reflect.js',
        '../../node_modules/zone.js/dist/zone.js',
        'karma.entry.js'
    ],
    frameworks: ['jasmine'],
    logLevel: config.LOG_INFO,
    phantomJsLauncher: {
        exitOnResourceError: true
    },
    preprocessors: {
        'karma.entry.js': ['webpack', 'sourcemap']
    },
    reporters: ['dots'],
    singleRun: false,
    webpack: require('../webpack/webpack.test.js'),
    webpackServer: {
        noInfo: true
    }
});
};
  

Следующий код взят из karma.entry.js —

 require('core-js');
require('reflect-metadata');
require('zone.js/dist/zone');
require('zone.js/dist/long-stack-trace-zone');
require('zone.js/dist/jasmine-patch');
require('zone.js/dist/async-test');
require('zone.js/dist/fake-async-test');
require('zone.js/dist/sync-test');

var browserTesting = require('@angular/platform-browser-dynamic/testing');
var coreTesting = require('@angular/core/testing');

coreTesting.setBaseTestProviders(
browserTesting.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
browserTesting.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS
);

var context = require.context('../../src/modules/', true, /.spec.ts$/);

context.keys().forEach(context);

Error.stackTraceLimit = Infinity;
jasmine.DEFAULT_TIMEOUT_INTERVAL = 2000;
  

Следующий код взят из webpack.test.js —

 'use strict';

var path = require('path');
var webpack = require('webpack');

module.exports = {
devtool: 'inline-source-map',

// resolving extensions for webpack
resolve: {
    extensions: ['', '.webpack.js', '.web.js', '.ts', '.es6', '.js', '.json'],
    modulesDirectories: ['node_modules'],
    root: path.resolve('.', 'src')
},

module: {
    preLoaders: [{
        test: /.ts$/,
        // include: srcDir,
        exclude: /node_modules/,
        loader: 'tslint-loader'
    }],
    loaders: [
        {
            test: /.(html|css)$/,
            // include: srcDir,
            // exclude: /node_modules/,
            loaders: ['raw-loader']
        },

        {
            test: /.ts$/,
            // include: srcDir,
            exclude: /node_modules/,
            loaders: ['ts-loader']
        }

    ]
},

tslint: {
    failOnHint: true,
    configuration: require('../../tslint.json'),
    emitErrors: true
},
}
  

Следующее из package.json

 {
 "name": "angular2-test",
 "version": "0.0.1",
 "description": "A collection of Angular2 UI components and beyond",
 "main": "index.js",
"scripts": {
    "start": "webpack-dev-server --inline --hot",
    "dev": "webpack --progress --profile --watch",
    "prod": "NODE_ENV=production webpack  --progress --profile",
    "prod:watch": "NODE_ENV=production webpack --progress --profile --watch",
    "test": "karma start ./testconfig/karma/karma.conf.js",
    "test:headless": "karma start ./testconfig/karma/karma.conf.js --browsers PhantomJS"
 },
"repository": {
    "type": "git",
    "url": "git https://github.com/ksharifbd/provat.git"
},
"keywords": [
    "angular2",
    "webpack"
],
"author": "Kamal Sharif",
"license": "MIT",
"bugs": {
    "url": "https://github.com/ksharifbd/provat/issues"
},
"homepage": "https://github.com/ksharifbd/provat#readme",
"dependencies": {
    "@angular/common": "2.0.1",
    "@angular/compiler": "2.0.1",
    "@angular/core": "2.0.1",
    "@angular/forms": "2.0.1",
    "@angular/http": "2.0.1",
    "@angular/platform-browser": "2.0.1",
    "@angular/platform-browser-dynamic": "2.0.1",
    "@angular/router": "3.0.1",
    "@angular/upgrade": "2.0.1",
    "core-js": "2.4.1",
    "reflect-metadata": "0.1.8",
    "rxjs": "5.0.0-beta.12",
    "ts-loader": "0.8.2",
    "typescript": "2.0.3",
    "webpack": "1.13.2",
    "zone.js": "0.6.25"
},
"devDependencies": {
    "@types/core-js": "0.9.34",
    "@types/jasmine": "2.2.34",
    "@types/node": "6.0.41",
    "autoprefixer": "6.5.0",
    "clean-webpack-plugin": "0.1.10",
    "codelyzer": "1.0.0-beta.0",
    "css-loader": "0.25.0",
    "extract-text-webpack-plugin": "1.0.1",
    "file-loader": "0.9.0",
    "html-webpack-plugin": "2.22.0",
    "jasmine-core": "2.5.2",
    "karma": "1.3.0",
    "karma-chrome-launcher": "2.0.0",
    "karma-jasmine": "1.0.2",
    "karma-phantomjs-launcher": "1.0.2",
    "karma-sourcemap-loader": "0.3.7",
    "karma-webpack": "1.8.0",
    "phantomjs-prebuilt": "2.1.12",
    "postcss-import": "8.1.2",
    "postcss-loader": "0.13.0",
    "postcss-url": "5.1.2",
    "raw-loader": "0.5.1",
    "style-loader": "0.13.1",
    "tslint": "3.15.1",
    "tslint-loader": "2.1.5",
    "url-loader": "0.5.7",
    "webpack-dev-server": "1.16.1"
}
}