Angular的Protractor:在测试之前等待每个页面的所有API调用

Question

我想做的是通过导航到应用程序的多个页面来测试应用程序，但我希望当我从一个页面导航到另一个页面时，我希望在执行操作之前完成所有API调用(单击按钮等(，如果API调用失败，则中断测试并触发错误。

我的量角器.conf.js

const { SpecReporter } = require('jasmine-spec-reporter');
exports.config = {
allScriptsTimeout: 11000,
specs: [
'./e2e/**/*.e2e-spec.ts'
],
capabilities: {
'browserName': 'chrome'
},
directConnect: true,
baseUrl: 'http://localhost:4200/',
framework: 'jasmine',
jasmineNodeOpts: {
showColors: true,
defaultTimeoutInterval: 30000,
print: function() {}
},
onPrepare() {
require('ts-node').register({
project: 'e2e/tsconfig.e2e.json'
});
jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
}
};

EDIT：示例：

import { AppPage } from './app.po';
import { element, by, browser } from 'protractor';
describe('my App', () => {
let page: AppPage;
beforeEach(() => {
page = new AppPage();
});
it('check log in', () => {
browser.waitForAngularEnabled(false);
page.navigateTo(); 
element(by.name('email')).sendKeys('...');
element(by.name('password')).sendKeys('...');
element(by.buttonText('Log in')).click(); 
browser.sleep(5000);
expect(element(by.id('tenantSelect')).isPresent()).toBe(true); 
});
});

所以这个测试基本上就是在我的angular应用程序中登录的场景。当我点击"登录"按钮时，它会触发API调用并导航到另一个组件tenantSelect'是我的DOM的一个元素，它在用户登录时显示，但即使我的一个HTTP请求失败，也会显示此元素。我想要的是在这个过程中捕捉http请求错误并使我的测试失败。

Answer 1

您需要的是组件的解析器。请参阅相关的Angular文档。

基本上，解析器确保在加载组件之前完成API调用(或任何其他可观察到的调用(。

直接在Protractor配置中实现一个变通方法可能会让你的测试变得绿色，但当在prod中部署时，你的应用程序不会像预期的那样工作，你会在浏览器日志中看到很多错误。