Problem calling clear on input fields and then sendKeys() within element.all.each() loop #2141
Description
Hi,
So I'm running into an issue where I'm trying to loop through all of the input fields on the page, clear the input for them, and then update them with a value. Here's the essential code:
element.all(by.model('part.quantity')).each(function(part_q){
part_q.clear().then(function(){
part_q.sendKeys("1");
});
}).then(function(){
...
}
This issue varies in scope (i don't mean the angular kind), but say I have 7
<input ng-model='part.quantity'> 's on the page that i'm testing. When i run my test with the code above it goes through each input and clears all of them and updates them all with the value 1, except for the first 2 input fields. In the first 2 fields it clears, but it adds the value 1 to them twice. So say I have these values before running the test:
<input ng-model='part.quantity' value="4">
<input ng-model='part.quantity' value="4">
<input ng-model='part.quantity' value="4">
<input ng-model='part.quantity' value="4">
<input ng-model='part.quantity' value="4">
<input ng-model='part.quantity' value="4">
<input ng-model='part.quantity' value="4">
afterwards those values will become
<input ng-model='part.quantity' value="11">
<input ng-model='part.quantity' value="11">
<input ng-model='part.quantity' value="1">
<input ng-model='part.quantity' value="1">
<input ng-model='part.quantity' value="1">
<input ng-model='part.quantity' value="1">
<input ng-model='part.quantity' value="1">
but the expected result for all of the values is 1.
This changes if i have five elements. If i have five it only doesn't work for the first input field, but it works for the next 4. I've tried various solutions (different locators (e.g. by.css), or running through a recursive while loop such as:
$$('.part-quantity').count().then(function(num_parts){
var idx = 0;
function alterQuantity() {
while (idx < num_parts){
$$('.part-quantity').get(idx).then(function(part_q){
part_q.clear().then(function(){
var rand_num = utils.randomIntFromInterval(2, 10).toString();
part_quantities.push(rand_num);
part_q.sendKeys(rand_num).then(function(){
idx++;
alterQuantity();
});
});
});
}
}
});
or running using filter() instead of each():
$$('.part-quantity').filter(function(part_q, idx){
return part_q.clear().then(function(){
var rand_num = utils.randomIntFromInterval(2, 10).toString()
part_quantities.push(rand_num)
console.log(rand_num);
browser.sleep(2000);
return part_q.sendKeys(rand_num);
});
}).then(function(quantity){
console.log(part_quantities);
});
but the filter() i used and the each() functions function identically. The recursive thing doesn't really work (i didn't spend too much time on it since I didn't really see too much promise in it working any better). This seems like a webdriver thing but I've hit a wall at this point and don't know what to do. I don't know if I need to be utilizing promises better? Any help would be appreciated.
Thanks.
edit: I've tested with both chrome and firefox drivers and the same thing happens