为什么我会收到此 Angular-Mock 错误，而 Mocha 测试不是运行

Question

我收到此处发现的确切错误：(window.beforeEach || window.setup) is not a function. However the fix did not work, the author of the tutorial series here甚至提到了相同的修复方法。

这是 Tuts+ 作者的修复：

这只是将angular-mock脚本标记放在Mochai和Chai脚本之后。我在下面这样做：

test/index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Mocha Spec Runner</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <link rel="icon" href="../app/favicon.ico">
    <link rel="apple-touch-icon" href="../app/assets/imgs/apple-touch-icon.png">
    <link href="bower_components/mocha/mocha.css" rel="stylesheet">
</head>

<body>

    <div id="mocha"></div>

    <script src="../bower_components/angular/angular.js"></script>
    <script src="../bower_components/mocha/mocha.js"></script>
    <script src="../bower_components/chai/chai.js"></script>
    <!-- see Angular-mocks is here :( -->
    <script src="../bower_components/angular-mocks/angular-mocks.js"></script>

    <script>
        mocha.setup('bdd');
    </script>

    <script src="main.spec.js"></script>

    <script>
        mocha.run();
    </script>

</body>
</html>

我的main.spec.js文件

/**
 * @name Mocha Test Runner
 * @desc Describes and runs our dashboard tests
 */

var assert = chai.assert;
var expect = chai.expect;

// This Test is designed to fail on purpose
describe('User Login', function() {
    console.log('User Login');
    describe('Login Failed', function() {
        console.log('Login Failed');
        if ('Incorrect login should fail', function() {
            module('loginController')
            inject(function($injector) {
                apiFactory = $injector.get('ApiFactory');
            });

            expect(apiFactory).to.be.an('number');
        });
    });    
});

我的 Gulp 任务

gulp.task('serve', function() {
    return browserSync.init({
        notify : false,
        port   : 3333,
        server: {
            baseDir: ['app'],
            routes: {
                '/bower_components' : 'bower_components'
            }
        }
    });
});

gulp.task('serve-test', function() {
    browserSync.init({
        notify : false,
        port   : 4444,
        server: {
            baseDir: ['test', 'app'],
            routes: {
                '/bower_components' : 'bower_components'
            }
        }
    });
});

Answer 1

在您的 index.html 文件中，您在调用 mocha.setup('bdd') 之前包含了 angular-mocks.js 脚本。 angular-mocks.js 被实现为立即调用的函数表达式，它试图使用 window.beforeEach。 (https://github.com/angular/bower-angular-mocks/blob/master/angular-mocks.js#L2586)

但是，mocha.js 不会立即被调用，必须使用 mocha.setup 函数进行初始化，以便将其魔力添加到运行时环境中。

尝试颠倒这些脚本标签的顺序，以便在 angular-mocks.js.
之前包含并初始化 mocha.js
<script src='bower_components/mocha/mocha.js'></script> <script src='bower_components/chai/chai.js'></script> <script> mocha.setup('bdd'); </script> <script src="bower_components/angular-mocks/angular-mocks.js"></script>

为什么我会收到此 Angular-Mock 错误，而 Mocha 测试不是运行

Why am I getting this Angular-Mock error and Mocha test is not running

javascript

mocha.js

angularjs

chai

angular-mock

test/index.html

我的main.spec.js文件

我的 Gulp 任务

为什么我会收到此 Angular-Mock 错误，而 Mocha 测试不是 运行

Why am I getting this Angular-Mock error and Mocha test is not running

javascript

mocha.js

angularjs

chai

angular-mock

test/index.html

我的main.spec.js文件

我的 Gulp 任务

为什么我会收到此 Angular-Mock 错误，而 Mocha 测试不是运行