Модульное тестирование в браузере (Typescript + Webpack) - PullRequest
0 голосов
/ 03 марта 2019

Я хочу добавить модульный тест в этот проект.Это основной проект webpack + typcript, который будет использоваться другим веб-приложением.Модульное тестирование должно выполняться в браузере.

Я пытался mocha, но просто import 'mocha' выдает ошибку компиляции.(У меня есть тестовый файл в project_folder/test/test.ts, который является записью для веб-пакета.)

WARNING in ./node_modules/mocha/lib/mocha.js 219:20-37
Critical dependency: the request of a dependency is an expression
 @ ./node_modules/mocha/browser-entry.js
 @ ./test/test.ts

WARNING in ./node_modules/mocha/lib/mocha.js 227:24-70
Critical dependency: the request of a dependency is an expression
 @ ./node_modules/mocha/browser-entry.js
 @ ./test/test.ts

WARNING in ./node_modules/mocha/lib/mocha.js 277:24-35
Critical dependency: the request of a dependency is an expression
 @ ./node_modules/mocha/browser-entry.js
 @ ./test/test.ts

WARNING in ./node_modules/mocha/lib/mocha.js 327:35-48
Critical dependency: the request of a dependency is an expression
 @ ./node_modules/mocha/browser-entry.js
 @ ./test/test.ts

WARNING in ./node_modules/mocha/lib/mocha.js 342:23-44
Critical dependency: the request of a dependency is an expression
 @ ./node_modules/mocha/browser-entry.js
 @ ./test/test.ts

ERROR in ./node_modules/mocha/lib/browser/growl.js
Module not found: Error: Can't resolve '../../package' in 'C:\Users\s1n7ax\Documents\GitHub\open-unicode-converter\node_modules\mocha\lib\browser'
 @ ./node_modules/mocha/lib/browser/growl.js 127:13-37
 @ ./node_modules/mocha/lib/mocha.js
 @ ./node_modules/mocha/browser-entry.js
 @ ./test/test.ts

ERROR in ./node_modules/mkdirp/index.js
Module not found: Error: Can't resolve 'fs' in 'C:\Users\s1n7ax\Documents\GitHub\open-unicode-converter\node_modules\mkdirp'
 @ ./node_modules/mkdirp/index.js 2:9-22
 @ ./node_modules/mocha/lib/reporters/xunit.js
 @ ./node_modules/mocha/lib/reporters/index.js
 @ ./node_modules/mocha/lib/mocha.js
 @ ./node_modules/mocha/browser-entry.js
 @ ./test/test.ts
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! open-unicode-converter@1.0.0 build: `webpack`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the open-unicode-converter@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\s1n7ax\AppData\Roaming\npm-cache\_logs\2019-03-02T20_59_10_221Z-debug.log

Если тест написан без оператора import, ошибок компиляции нет, но во время выполнения он выдает ошибку, потому что метод describe не определено.

Важно, чтобы тест был файлом машинописного текста, потому что классы машинописного текста должны быть импортированы.Есть ли библиотека, которая может использоваться с typcript + webpack и работает в браузере?

test / test.ts

import 'mocha'
describe('sample', () => {
    it('should return something', () => {
    })
});

webpack.config.js

const path = require('path');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const webpack = require('webpack');


let distPath = path.resolve(__dirname, 'dist');
let srcPath = path.resolve(__dirname, 'src');
let testPath = path.resolve(__dirname, 'test');

module.exports = {
    mode: 'development',
    devtool: 'inline-source-map',
    entry: "./test/index.test.ts",
    module: {
        rules: [
            {
                test: /\.tsx?$/,
                use: 'ts-loader',
                exclude: /node_modules/
            }
        ]
    },
    plugins: [
        // this copy index.html from test/index.html to dist
        new CopyWebpackPlugin([
            {from: path.resolve(__dirname, 'test'), to: distPath, ignore: ['*.ts', '*.tsx', '*.js']}
        ]),
    ],
    resolve: {
        extensions: ['.tsx', '.ts', '.js']
    },
    output: {
        filename: '[name].js',
        path: distPath
    },
    devServer: {
        contentBase: path.join(__dirname, 'dist'),
        compress: true,
        port: 9000
    }
};

package.json

"scripts": {
    "build": "webpack",
    "watch": "webpack --watch",
    "test:browser": "npm run build && start http://localhost:9000 && webpack-dev-server"
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...