与Karma / Mocha进行E2E测试（静态网站）

Question

我正在开发一个简单的静态网站，我希望自动进行e2e和单元测试。但是，我无法通过测试。我的猜测是，在mocha / karma执行我的测试之前我的页面没有完全加载。

当我访问Karma仪表板并单击Debug按钮时，我的网站正常加载，但在控制台中，我得到debug.html:38 AssertionError: expected 0 to be above 1。 0是$('.en').length的结果，当我在我的控制台中运行它时，它输出3，所以断言应该是真的。

以下是我的单元测试和我的业力配置的代码：

index.spec.js

import chai, {assert, expect} from 'chai';
import chaiAsPromised from 'chai-as-promised';
chai.use(chaiAsPromised);
chai.should();

describe('index', () => {
    before(() => {
        if (__html__) {
            const html = __html__['src/client/index.html'];
            const newDoc = document.open('text/html', 'replace');
            newDoc.write(html);
            newDoc.close();
        }
    });

    describe('changeLanguage', () => {
        it('should have French as the default language', () => {
            const frenchSections = $('.fr');
            const englishSections = $('.en');

            frenchSections.length.should.be.greaterThan(1);
            englishSections.length.should.be.greaterThan(1);
            frenchSections.each(e => $(e).is(':visible').should.be.true);
            englishSections.each(e => $(e).is(':visible').should.be.false);
        });
    });
});

karma.conf.js

module.exports = function(config) {
    config.set({
        basePath: './',

        frameworks: ['mocha', 'chai-sinon', 'browserify'],

        files: [
            client + '**/*.html',
            client + '**/*.js',
            test + '**/*.spec.js',
            'bower_components/jquery/dist/jquery.js',
            {pattern: 'bower_components/material-design-lite/material.min.css', included: false},
            'bower_components/material-design-lite/material.min.js',
            {pattern: 'bower_components/material-design-lite/material.min.js.map', included: false},
            temp + '**/*.js',
            {pattern: temp + '**/*.*', included: false},
            {pattern: client + 'fonts/**/*.*', included: false}
        ],

        exclude: [],

        proxies: {
            '/.tmp/': '/base/.tmp/',
            '/fonts/': '/base/src/client/fonts/',
            '/scripts/': '/base/scripts/',
            '/bower_components/': '/base/bower_components/'
        },

        preprocessors: {
            'src/client/**/*.js': ['browserify'],
            'test/**/*.spec.js': ['browserify'],
            'src/client/**/*.html': ['html2js']
        },

        browserify: {
            debug: true,
            transform: [
                [
                    'babelify',
                    {presets: 'es2015'}
                ],
                [
                    'browserify-istanbul',
                    {instrumenterConfig: {embedSource: true}}
                ]
            ]
        },

        coverageReporter: {
            reporters: [
                {'type': 'text-summary'},
                {'type': 'html', dir: 'coverage'}
            ]
        },

        reporters: ['progress', 'coverage', 'mocha'],

        port: 9876,

        colors: true,

        logLevel: config.LOG_INFO,

        autoWatch: false,

        browsers: ['PhantomJS'],

        singleRun: true,

        concurrency: Infinity,

        plugins: [
            'karma-browserify',
            'karma-chai-sinon',
            'karma-chrome-launcher',
            'karma-coverage',
            'karma-firefox-launcher',
            'karma-html2js-preprocessor',
            'karma-ie-launcher',
            'karma-mocha',
            'karma-mocha-reporter',
            'karma-phantomjs-launcher'
        ]
    });
};