Protractor - click within For Each not behaving as expected

问题

In Following Protractor Code

const tabs = await element.all(by.id('tab'));
tabs.forEach(async tab => {
  tab.click().then(function() {
  element.all(by.id('radio1')).click();
});
}); 
 await element(by.id('saveAndContinue')).click();

radio1 is only clicked in last tab because of which last line of saveAndContinue is hidden and thus click() of it fails

While Sleep does work outside of FOR loop it doesn't when i want to allow time before radio1 click

EDIT 1: Problem is every line is executing BUT radio1 clicks for last Tab not previously clicked tab. Tab click is fast for radio1 to be clikced.

回答1:

A couple things to note, the "id" Attribute is required to be unique. You should not have multiple elements with the same id, this can cause some wacky behavior. check out this answer as a source Does ID have to be unique in the whole page?

Also, element.all() is going to return an array of elements, so you are trying to click an array of elements.

see the documentation for element.all() on protractor docs https://www.protractortest.org/#/api?view=ElementArrayFinder

Assuming the elements are being returned as an array, in spite of using duplicate html id's, you would need to click them individually like such

element.all(by.id('radio1')).then(function (myIds) {
myIds[0].click();
myIds[1].click();
});

Or of course loop thru them.

Best of luck

回答2:

Since you didn't attach HTML and a screenshot of your app, here is my shot in a dark... Try this and let me know if works

let tabs = element.all(by.id('tab'));
let radioButtons = element.all(by.id('radio1'));

let tabCount = await tabs.count();
for (let i = 0; i < tabCount; i++) {
  await tabs.get(i).click();
  let radioCount = await radioButtons.count();
  for (let j = 0; j < radioCount; j++) {
    await radioButtons.get(j).click();
  }
}
await element(by.id('saveAndContinue')).click();

回答3:

1) missed await ahead tab.click()

2) element.all().click() shouldn't work

const tabs = await element.all(by.id('tab'));
tabs.forEach(async tab => {
  await tab.click();
  await element.all(by.id('radio1')).first().click();
  // I think you should not find all radio1 of entire page, 
  // it will find radio1 of other tabs which is not visible in the active tab.
  // and protractor will fail to click on invisible radio1
  // thus you should find raido1 which is belongs to active tab

}); 
await element(by.id('saveAndContinue')).click();

回答4:

Thanks to Sergey Pleshakov above following works (after wee bit change):

async doGateway2bComplexHappyPath() {
let tabs = element.all(by.id('tab'));

let tabCount = await tabs.count();
for (let i = 0; i < tabCount; i++) {
  tabs.get(i).click();
  //browser.sleep(1000);
  element.all(by.id('radio1')).click();
  //browser.sleep(1000);
}

 //await browser.sleep(1000);
 await element(by.id('saveAndProceed')).click();
}

来源：https://stackoverflow.com/questions/57695776/protractor-click-within-for-each-not-behaving-as-expected

标签

javascript

asynchronous

foreach

protractor

click