Protractor: Waiting for text to be mutable

Question

I am trying to replace text in an input field. Given the original text foo, I am trying to replace it with bar.

In most cases, this works as expected, but intermittently I am seeing an issue where the result can be foobar, fooar, foor or even foo. This seems to imply that when my sendkeys() begins to execute, the text is sometimes in an immutable state, and then becomes mutable part way through the execution of sendkeys().

I've tried using clear() to clear the input prior to sendkeys() but the behaviour doesn't change, clear() simply fails to remove the original text in some cases. I've also tried waiting for the original text to appear in the input as well as waiting for the input to become clickable and then clicking in it prior to calling sendkeys(). Again, these don't change the original behaviour.

Here is my input:

<input qva-select="" qv-enter="toggleEditMode()" type="text" maxlength="255" class="lui-input details-input ng-pristine ng-valid ng-not-empty ng-valid-maxlength ng-touched" ng-model="appModel.qTitle"> == $0

Original Protractor code was simply:

titleInput: this.element(this.by.model('appModel.qTitle'))

titleInput.sendKeys('bar')

And here's what I have now with a bunch of wait conditions and other attempted fixes:

browser.wait(EC.textToBePresentInElementValue(titleInput, 'foo'), 60000)
browser.wait(EC.elementToBeClickable(titleInput), 60000)
titleInput.click()
titleInput.sendKeys(protractor.Key.CONTROL, 'a', protractor.Key.NULL, 'bar', protractor.Key.ENTER)

Is there any other way I can be sure the text is mutable before trying to replace it?

No, it doesn't error out, it continues execution as if it were successful. — Bob B, Apr 18 '17 at 14:33
I think that root cause of your problem is `qv-enter="toggleEditMode()"` attribute of `input`. I haven't been able to find much about this online (seems to be somehow related to Qlik View), but name suggests that it is responsible for blocking any input until some condition is met. Since this is another framework, Protractor has no way of knowing that it should wait for this script to finish. It seems that custom wait is the only way forward. Knowledge of `toggleEditMode` function internals would be definitely helpful, if you can provide them. — Mirek Długosz, Apr 29 '17 at 17:16
That attribute just handles the case where a `return` character is entered into the input. It then switches the page back to `read-only`. I don't believe it plays a role in what is going on here. — Bob B, Apr 30 '17 at 18:00

alecxe · Answer 1 · 2017-04-18T14:52:05.080

3

I think you can make things more reliable by having a custom wait that will issue a .clear() method call repeatedly and stop only when the input becomes empty or a timeout is reached:

var titleInput = this.element(this.by.model('appModel.qTitle'));

browser.wait(function () {
    titleInput.clear();
    return titleInput.getAttribute('value').then(function (inputValue) {
        return !inputValue;
    });
}, 5000);

edited Apr 18 '17 at 14:52

answered Apr 18 '17 at 14:43

alecxe

462,703
120
1,088
1,195

Thanks @alecxe. I have been considering this, but ideally I'd also like to understand what the problem is in the first place :) – Bob B Apr 18 '17 at 14:58
This didn't work. I thought maybe there is a period of time when the input renders without text so I added the following, but still no luck. ` var titleInput = this.element(this.by.model('appModel.qTitle')); browser.wait(function () { return titleInput.getAttribute('value').then(function (inputValue) { return inputValue; }); }, 5000); browser.wait(function () { titleInput.clear(); return titleInput.getAttribute('value').then(function (inputValue) { return !inputValue; }); }, 5000); ` – Bob B Apr 19 '17 at 13:42
@BobB ah, interesting! What if you would try typing slowly (http://stackoverflow.com/questions/38187514/simulate-slow-typing-in-protractor)? – alecxe Apr 19 '17 at 13:46
Thanks for that! Slow typing didn't fix the problem, but it did give me a better look at what is happening. I can now see the original text disappearing from the input, and then in the delay after inputting my first character, the original text reappears! I am now suspecting Angular digest cycles at play here in my application. – Bob B Apr 19 '17 at 19:34

score 0 · Answer 2 · answered Apr 30 '17 at 18:01

0

Thanks for the input everyone! This is definitely a timing issue with the Angular application itself and not just me incorrectly using Protractor.

answered Apr 30 '17 at 18:01

Bob B

137
1
10

Protractor: Waiting for text to be mutable

2 Answers2