javascript - Protractor 异步/等待错误 : Unhandled promise rejection

Question

我正在使用 Protractor Async/Await 重构我的框架，以避免整个代码库中草率的 browser.sleep()。

测试步骤如下，并附上代码示例:

Opens ChromeBrowser
Logins with the credentials
Selects a customer
Clicks on "Manage Customer" button.

你能帮我解决以下错误吗:

Report destination:   target\e2e\screenshots\my-report.html
[12:42:21] I/launcher - Running 1 instances of WebDriver
[12:42:21] I/hosted - Using the selenium server at http://127.0.0.1:4444/wd/hub

(node:18208) UnhandledPromiseRejectionWarning: Error: Error while waiting for Protractor to sync with the page: "both angularJS testability and angular testability are undefined.  This could be either because this is a non-angular page or because you
r test involves client-side navigation, which can interfere with Protractor's bootstrapping.  See http://git.io/v4gXM for details"
    at runWaitForAngularScript.then (C:\Users\Ashish\AppData\Roaming\npm\node_modules\protractor\built\browser.js:463:23)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)Error
    at ElementArrayFinder.applyAction_ (C:\Users\Ashish\AppData\Roaming\npm\node_modules\protractor\built\element.js:459:27)
    at ElementArrayFinder.(anonymous function).args [as sendKeys] (C:\Users\Ashish\AppData\Roaming\npm\node_modules\protractor\built\element.js:91:29)
    at ElementFinder.(anonymous function).args [as sendKeys] (C:\Users\Ashish\AppData\Roaming\npm\node_modules\protractor\built\element.js:831:22)
    at customer.cusSelection (C:\Users\Ashish\Documents\Protractor\scripts\CustomerSelection.js:7:50)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)
(node:18208) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:18208) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
[12:42:25] I/launcher - 0 instance(s) of WebDriver still running
[12:42:25] I/launcher - chrome #01 passed

下面是Conf.js、Scenario_01.js及相应的模块供大家引用:

Conf.js:

var HtmlScreenshotReporter = require('protractor-jasmine2-screenshot-reporter');
var reporter = new HtmlScreenshotReporter({
  dest: 'target/e2e/screenshots',
  filename: 'my-report.html',
  ignoreSkippedSpecs: true,
  reportOnlyFailedSpecs: false,
  captureOnlyFailedSpecs: true  ,
  showSummary: true,
  showQuickLinks: true,
  showConfiguration: true,
  reportTitle: "Protractor Automation Report",
  reportFailedUrl: true,
  inlineImages: true,
});

exports.config = {
seleniumAddress: 'http://127.0.0.1:4444/wd/hub',

suites: {
    Scenario1: './Scenario_01.js', 
},

SELENIUM_PROMISE_MANAGER: false,

capabilities: {
    'shardTestFiles': false,
    'maxInstances': 1,
    'browserName': 'chrome',
    'chromeOptions': {
     'args': ['disable-extensions', 'start-maximized']  //'--headless',
    }
},
allScriptsTimeout: 11000,
getPageTimout: 10000,
restartBrowserBetweenTests: false,
framework: 'jasmine2',
jasmineNodeOpts: {
    onComplete: null,
    isVerbose: true,
    showColors: true, // is True, prints colors to terminal
    includeStackTrace: true,
    defaultTimeoutInterval: 30000, 
    print: function () {}
},
beforeLaunch: function() {
    return new Promise(function(resolve){
    reporter.beforeLaunch(resolve);
    });
},

onPrepare: function () {

    jasmine.getEnv().addReporter(reporter);
    browser.manage().window().maximize();
    browser.manage().timeouts().implicitlyWait(5000);
    jasmine.getEnv().addReporter( new Jasmine2HtmlReporter({savePath: 'target/screenshots'}));
}
};

Scenario_01.js:

describe('Scenario_01', function() {

 var common = require('./scripts/CloseBrowsers.js');    
 var Login = require('./scripts/Login.js'); 
 var customer = require('./scripts/CustomerSelection.js');

 it('Login', function() {
         browser.waitForAngularEnabled(false); 
         Login.login('admin','Adminpwd');
     });

     it('CustomerSelection', function() {
         browser.waitForAngularEnabled(true);
         customer.cusSelection();
     });

afterAll(function(){
    common.closeBrowsers();
});
});

登录.js:

var Login = function() {

     this.login = async function(username, passwordKey){
     await browser.get('http://testwebsite.com/showCust');
     await element(by.name('USER')).sendKeys(username);
     await element(by.name('PASSWORD')).sendKeys(passwordKey);
     await element(by.xpath('/html/body/table/tbody/tr[2]/td/table/tbody/tr/td/table/tbody/tr[3]/td/form/input[9]')).click();
     await element(by.name('YES')).click();
     //browser.sleep(10000);

};
}
module.exports = new Login();

CustomerSelection.js:

var customer = function(){

    this.cusSelection = async function(){

     await element(by.css(['ng-model="selectedChannel.selected"']));
     await element(by.id('customer-auto-complete')).sendKeys('TestCustomer');
     //browser.sleep(500);

     await element.all(by.css('ul[class^="ui-autocomplete"]')).first().click();
    //browser.sleep(1500);
     await element(by.partialButtonText('Manage Customer')).click();
     browser.sleep(10000);      
    };
}
module.exports = new customer();    

Answer 1

错误清楚地表明 CustomerSelection.js 中的 promise 拒绝没有得到处理。根据堆栈跟踪，await element(by.xpath(...)) 未能解决 promise 。

解决此问题的方法是在 Scenario_01.js: 中捕获 customer.cusSelection() 并在那里处理异常。

默认情况下，每个带有 async 关键字的方法的返回类型都是一个 promise。因此，您应该等待 Scenario_01.js: 中的 customer.cusSelection() 或使用 then-catch 子句进行断言。

是这样的——

 it('CustomerSelection', async function() {
     browser.waitForAngularEnabled(true);
     let response = await customer.cusSelection();
 });

 // OR this to catch exceptions.

 it('CustomerSelection', function() {
     browser.waitForAngularEnabled(true);
     customer.cusSelection()
        .then(response => console.log(response))
        .catch(error => console.error(error));
 });

Node.js 正在朝着与 uncaughtException 错误类似的方式处理 unhandled promise rejections 的方向发展。

这意味着即将到来的节点版本将在遇到 promise 拒绝 (reference) 时终止进程。

Update - Code Snippet for CustomerSelection.js

var customer = function(){

    this.cusSelection = async function(){

    await element(by.css(['ng-model="selectedChannel.selected"']));
    await element(by.id('customer-auto-complete')).sendKeys('TestCustomer');
    //browser.sleep(500);

    // updating this snippet
    // await element.all(by.css('ul[class^="ui-autocomplete"]')).first().click();

    // to following
    let elements = await element.all(by.css('ul[class^="ui-autocomplete"]'));
    elements.first().click();

    //browser.sleep(1500);
    await element(by.partialButtonText('Manage Customer')).click();
    browser.sleep(10000);      
    };
}
module.exports = new customer();