Question

我尝试使用Mocha和Angular进行单元测试项目。因为我必须把它变成一个控制台（用Jenkins的jUnit报告），我将JsDom添加到我的项目中。不幸的是，我没有成功加载我的Angular应用程序。

这是我的package.json（npm）：

{
    "name": "subs-tech-saas-js.test",
    "version": "0.0.0",
    "description": "SubsTechSaasJS.Test",
    "main": "app.js",
    "author": {
        "name": "admlocal",
        "email": ""
    },
    "scripts": {
        "test": "mocha *Test.js --reporter mocha-junit-reporter"
    },
    "devDependencies": {
        "angular": "1.5.5",
        "angular-resource": "1.5.5",
        "angular-messages": "1.5.5",
        "angular-animate": "1.5.5",
        "angular-aria": "1.5.5",
        "angular-sanitize": "1.5.5",
        "angular-route": "1.5.5",
        "angular-cookies": "1.5.5",
        "angular-filter": "*",
        "angular-mocks": "1.5.5",
        "mocha": "^3.5.0",
        "mocha-junit-reporter": "latest",
        "jsdom": "^11.1.0"
    }
}

这是我的mock-browser.js文件：

const { JSDOM } = require("jsdom");
const DEFAULT_HTML = 
"<!DOCTYPE html>" +
"<html>" +
    "<head>" +
    "</head>" +
    "<body>" +
        //"<div id=\"mocha\"></div>" +
        //"<script src=\"node_modules/mocha/mocha.js\"></script>" +
        //"<script>" +
        //    "if (!mocha) {" +
        //        "console.log(\"You need a mocha framework. get it with 'npm install' using npm.\");" +
        //    "}" +
        //    "mocha.setup(\"bdd\");" +
        //"</script>" +
        //"<script src=\"node_modules/angular/angular.min.js\"></script>" +
        //"<script src=\"node_modules/angular-resource/angular-resource.min.js\"></script>" +
        //"<script src=\"node_modules/angular-messages/angular-messages.min.js\"></script>" +
        //"<script src=\"node_modules/angular-animate/angular-animate.min.js\"></script>" +
        //"<script src=\"node_modules/angular-aria/angular-aria.min.js\"></script>" +
        //"<script src=\"node_modules/angular-sanitize/angular-sanitize.min.js\"></script>" +
        //"<script src=\"node_modules/angular-route/angular-route.min.js\"></script>" +
        //"<script src=\"node_modules/angular-cookies/angular-cookies.min.js\"></script>" +
        //"<script src=\"node_modules/angular-filter/index.js\"></script>" +
        //"<script src=\"node_modules/angular-mocks/angular-mocks.js\"></script>" +
        //"<script src=\"../CollectorWebSite/dist/Scripts/substech-external.min.js\"></script>" +
        //"<script src=\"../CollectorWebSite/dist/Scripts/substech-custom-tools.min.js\"></script>" +
        //"<script src=\"../CollectorWebSite/dist/Scripts/substech-collector.min.js\"></script>" +
        //"<script src=\"../CollectorWebSite/dist/Scripts/substech-kendo.min.js\"></script>" +
        //"<script src=\"../CollectorWebSite/dist/Scripts/jsonata.js\"></script>" +
        //"<script>mocha.run();</script>" +
    "</body>" +
"</html>";
const jsdom = new JSDOM(DEFAULT_HTML);
const { window } = jsdom;

global.document = jsdom;
global.window = window;
global.navigator = {
    userAgent: "node.js"
};

const props = Object.getOwnPropertyNames(window)
                .filter(prop => typeof global[prop] === "undefined")
                .map(prop => Object.getOwnPropertyDescriptor(window, prop));
Object.defineProperties(global, props);

/*
 * Only for NPM users
 */
require("angular/angular");
require("angular-mocks/angular-mocks");
require("angular-resource/angular-resource");
require("angular-messages/angular-messages");
require("angular-animate/angular-animate");
require("angular-aria/angular-aria");
require("angular-sanitize/angular-sanitize");
require("angular-route/angular-route");
require("angular-cookies/angular-cookies");
require("angular-filter/index");

global.angular = window.angular;
global.inject = global.angular.mock.inject;
global.ngModule = global.angular.mock.module;

这是我的UnitTest.js文件：

const mockBrowser = require("./mock-browser");
const Mocha = require("mocha");
const assert = require("assert");
const mocha = new Mocha();

describe("Collector", function () {
    var SubsFormCtrl = null;

    angular.mock.module("subsTechSaasApp");

    beforeEach(function () {
       /* inject(function ($controller) {
            SubsFormCtrl = $controller("SubsFormCtrl");
        });*/
    });

    describe("SubsFormCtrl Unit Test", function () {
        it("xxxxx:", function () {

        });
    });
});

我有一个最后一个文件，那个文件包含我的Angular应用程序。所以，我有两个困难： - 如何在项目中添加我的Angular文件？ - 我怎样才能正确添加角度模拟？每次我尝试添加一个模块（即使我的模块代码不包括在内），我也有这个错误：＆＃34; TypeError：angular.mock.module不是函数＆＃34;

谢谢：）

Answer 1

您可以在此处找到角度为4的工作示例：https://github.com/ericminio/learning-typescript

它是用测试的打字稿和mocha的垫片的javascript编写的。

这个例子中的关键点是提供一个自定义资源加载器，它从文件系统中读取模板，尽管我们在大多数假设服务器正在运行的教程中都看到，它试图通过http请求获取它。 / p>

testing.TestBed.configureCompiler({
    providers: [ {
        provide:require('@angular/compiler').ResourceLoader,
        useValue:{
            get:function(url) {
                var content = require('fs').readFileSync('./app/lib/' + url)
                                           .toString();
                return content;
            }
        } 
    }],
    useJit: true
});

希望有助于早期版本

如何进行单元测试？（摩卡+ JsDom + Angular）

1 个答案:

如何进行单元测试？ （摩卡+ JsDom + Angular）

1 个答案:

如何进行单元测试？（摩卡+ JsDom + Angular）