【发布时间】：2015-11-24 12:58:08
【问题描述】：
如何将 Mock HTTP 与 Jasmine 和 Protractor 一起使用？
在我的 test.spec.js 中，我声明了一个模拟，但这个模拟不起作用。我没有任何错误。我的 api 总是响应而不是模拟。
我从未见过“mockModule！”在我的控制台中。 我的函数永远不会执行：
browser.addMockModule('modName', function() {
browser.executeScript(function() {console.log('mockModule!')});
angular.module('modName', []).value('foo', 'bar').run(function ($httpBackend) {
$httpBackend.whenPOST('http://api.webapp.net/app_dev.php/module/search?direction=asc&page=1').respond('repsond');
browser.executeScript(function() {console.log('enter mockModule!')});
});
});
在我的 app.js 中，我没有“ngMock”。
我在 index.html 中添加了这个：
node_modules/angular-mocks/angular-mocks.js
我使用“gulp protractor-local”从命令提示符运行测试：
gulp.task('protractor-local', shell.task([
'protractor protractor.conf.js --baseUrl="http://mywebapp.local.net"'
]));
所有测试都可以，但不是模拟。
test.spec.js
var loginPO = new(require('./models/login.model.js'))();
describe("hello", function() {
it("I click on the button-search button", function() {
loginPO.wait(10);
//browser.ignoreSynchronization = false;
browser.addMockModule('modName', function() {
browser.executeScript(function() {console.log('mockModule!')});
angular.module('modName', []).value('foo', 'bar').run(function ($httpBackend) {
$httpBackend.whenPOST('http://api.webapp.net/app_dev.php/module/search?direction=asc&page=1').respond('repsond');
browser.executeScript(function() {console.log('enter mockModule!')});
});
});
//browser.getRegisteredMockModules();
loginPO.clickButtonSearchButton();
loginPO.wait(10);
});
it("I am on the home page", function() {
loginPO.visit('#/');
});
...
});
models/login.model.js
'use strict';
var _ = require('lodash');
var LoginPageObject = function() {
var signInButton = element(by.id('signIn'));
_.mixin(this, require('./common/base.js').Base);
this.path = '#/';
this.clickButtonSearchButton = function() {
return browser.driver.findElement(by.id('button-search')).click();
};
...
};
module.exports = LoginPageObject;
common/base.js
function visit(path, params) {
return browser.get(this.path + (params || ''));
}
function wait(params) {
params = params * 1000;
return browser.sleep(params);
}
...
exports.Base = {
visit: visit,
wait: wait,
...
};
protractor.config.js
exports.config = {
directConnect: true,
seleniumServerJar: 'node_modules/selenium-server/lib/runner/selenium-server-standalone-2.48.2.jar',
specs: [
'jasmine/*.spec.js'
],
getPageTimeout: 30000,
capabilities: {
'browserName': 'chrome',
version: '',
platform: 'ANY'
},
framework: 'jasmine2'
};
** karma.conf.js **
// Karma configuration
module.exports = function(config) {
var configuration = {
basePath: './',
frameworks: [
'jasmine-jquery',
'jasmine',
'jasmine-matchers'
],
files: [
...
'assets/libs/angularjs/angular.min.js',
'node_modules/angular-mocks/angular-mocks.js',
...
'assets/libs/angularjs/sweetalert.min.js',
'assets/libs/angularjs/ui-bootstrap-tpls.min.js',
'app/app.js',
'app/*/*.js',
'app/*/*/*.js',
'app/*/*/*/*.js',
{
pattern: 'app/*/*/*/*/*.json',
included: false
}
],
exclude: [],
preprocessors: {
'app/**/!(*.test).js': ['coverage']
},
coverageReporter: {
type: 'text',
dir: 'coverage/'
},
reporters: ['spec'],
port: 8080,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: false,
browsers: ['PhantomJS'],
singleRun: true,
customLaunchers: {
'PhantomJS_custom': {
base: 'PhantomJS',
options: {
windowName: 'my-window',
settings: {
webSecurityEnabled: false
}
},
flags: ['--load-images=true'],
debug: true
}
},
phantomjsLauncher: {
exitOnResourceError: true
}
};
config.set(configuration);
};
package.json
{
"name": "webapp",
"version": "1.0.0",
"description": "webapp",
"dependencies": {
"angular-mocks": "^1.4.5",
"chromedriver": "^2.19.0",
"gulp-protractor": "^1.0.0",
"gulp-shell": "^0.5.0",
...
"protractor": "^2.5.1",
"selenium-server": "^2.48.2",
"selenium-standalone": "^4.7.0",
"selenium-webdriver": "^2.48.0",
}
}
【问题讨论】：
-
您是从浏览器还是命令提示符运行？
-
我从命令提示符运行测试： protractor protractor.conf.js --baseUrl="mywebapp.local.net"
-
另外请分享 KARMA 配置文件
-
Karma 运行 phamtomjs 并执行我的单元测试。
-
还有一个为什么需要带量角器的 ngMock？我们使用 ngMock 与 jasmine 或其他进行单元测试，量角器是 E2E 测试框架。不需要带量角器的 ngMock
标签： javascript angularjs jasmine protractor angularjs-e2e