代码之家  ›  专栏  ›  技术社区  ›  IsraGab

我的单元测试配置有几个问题

  •  0
  • IsraGab  · 技术社区  · 6 年前

    安格拉 应用程序,使用 , 网页包 摩卡 .

    源代码位于 入口点为时的文件夹 src/索引.js :

    import angular from 'angular';
    import kramerWeb from './root/app.module';
    
    import './assets/styles/app.less';
    
    angular.module(kramerWeb);
    

    我的测试在 文件夹:

    let should = require('chai').should();
    let expect = require('chai').expect;
    
    import {K_Parser} from '../src/core/parsers/ParserFactory';
    describe('K_Parser', function () {
    
        beforeEach(function () {
        });
    
        it('should have a decode function', function () {
            K_Parser.decode.should.be.a('function');
        })
    

    Webpack.config.js网站

    const path = require('path');
    const webpack = require('webpack');
    const MiniCssExtractPlugin = require("mini-css-extract-plugin");
    const WebpackShellPlugin = require('webpack-shell-plugin');
    
    
    var outputPath;
    if (process.env.path_for_build)
        outputPath = path.resolve(__dirname, process.env.path_for_build);
    else
        outputPath = path.resolve(__dirname, 'dist');
    
    console.log(outputPath);
    const config = {
        entry: {
            root: [path.resolve(__dirname, 'src/index.js')]
        },
        output: {
            filename: '[name].main.js',
            path: outputPath,
            chunkFilename: "[name].main.js"
        },
        optimization: {
    
            splitChunks: {
                cacheGroups: {
                    vendor: {
                        test: /[\\/]node_modules[\\/]/,
                        name: "vendors",
                        priority: -20,
                        chunks: "all"
                    },
                    components:{
                        test: /[\\/]components[\\/]/,
                        name: "components",
                        priority: -20,
                        chunks: "all"
                    }
                }
            }
        },
        devServer: {
            contentBase: path.join(__dirname, 'devices')
        },
        module: {
            rules: [
                {
                    test: /\.css$/,
                    use: [
                        'vue-style-loader',
                        'css-loader'
                    ],
                },
                {
                    test: /\.less$/,
                    use: [{
                        loader: MiniCssExtractPlugin.loader//('style-loader' // creates style nodes from JS strings
                    }, {
                        loader: 'css-loader' // translates CSS into CommonJS
                    }, {
                        loader: 'resolve-url-loader'
                    }, {
                        loader: 'less-loader', // compiles Less to CSS
                        options: {
                            javascriptEnabled: true
                        }
                    }]
                },
                {
                    test: /\.(html)$/,
                    loader: 'html-loader',
                    options: {
                        loaders: {
                        }
                    }
                },
                {
                    test: /\.js$/,
                    loader: 'babel-loader',
                    include:[path.join(__dirname, 'test')],
                    exclude: /node_modules/
                },
                {
                    test: /\.(png|jpg|gif|svg)$/,
                    loader: 'file-loader',
                    options: {
                        name: '[name].[ext]?[hash]'
                    }
                },
                {
                    test: /\.(woff2?|eot|ttf|otf)$/,
                    loader: 'file-loader',
                    options: {
                        name: './fonts/[name].[ext]?[hash]'
                    }
                }
            ]
        },
        plugins: [
            // new BundleAnalyzerPlugin(),
            new WebpackShellPlugin({onBuildStart: ['echo "Webpack Start"'], onBuildEnd: ['echo "Webpack End"']}),//'copy "devices\\VS-88UT\\index.html" "devices\\VS-88UT\\dist"']}),
            new MiniCssExtractPlugin({
                filename: "[name].css",
            }),
            new webpack.ProvidePlugin({
                'window.jQuery': 'jquery',
                // Promise: 'es6-promise-promise',
                _: 'underscore'
            })
    
        ]
    };
    module.exports = config;
    

    业力配置js

    var webpackConfig = require('./webpack.config');
    
    module.exports = function(config) {
        config.set({
            browsers:   ['Chrome'],
            frameworks: ['mocha'],
            reporters:  ['mocha'],
    
            logLevel: config.LOG_INFO,
            autoWatch: true,
            singleRun: false,
            colors: true,
            port: 9876,
    
            basePath: '',
            files: [
                'webpack.karma.context.js'
            ],
            preprocessors: {
                'webpack.karma.context.js': ['webpack']
            },
            exclude: [],
            webpack: webpackConfig,
            webpackMiddleware: {
                noInfo: true
            }
        });
    };
    

    import angular from 'angular';
    import mocks from 'angular-mocks';
    
    import * as root from './src/index';
    
    let context = require.context('./test', false, /\.spec\.js$/);
    context.keys().forEach(context);
    

    我的剧本 包.json

    "mocha": "mocha --require babel-register  ./test/*.spec.js -r jsdom-global/register",
    "karma": "karma start karma.conf.js"
    

    问题: 当我运行业力脚本时,我没有任何东西,它会报告:

    当我运行mocha脚本时,我遇到了一个问题,它说:

    我花了一整天的时间在这上面,我真的很感谢你的帮助。

    谢谢你

    更新

    我修正了我的业力问题(0测试完成)。这是因为我的karma.conf.我把framework设置为jasmine而不是mocha。 但现在我有一个新问题:

    1 回复  |  直到 6 年前
        1
  •  0
  •   IsraGab    6 年前

    好的,我解决了我的问题。

    对于可能有同样问题的人,我在这里给出了答案:

    webpack.karma.context.js网站

    //I remove the import fro angular (angular is imported in the index file)
    
    import * as root from './src/index';
    import mocks from 'angular-mocks';// angular-mocks need to come AFTER the source code
    
    
    let context = require.context('./test', false, /\.spec\.js$/);
    context.keys().forEach(context);
    

    我必须做的另一件事,这是最困难的部分

    在Webpack4中,默认情况下启用优化,这似乎阻止了单元测试的工作。

    业力形态

     webpack: { ...webpackConfig, optimization: undefined },
    //instead of : webpack: webpackConfig,
    

    现在一切正常:)