在运行下一步量角器之前等待几秒钟

Question

What function do you use to wait for a few seconds before running next step in protractor. I have a span with a text and I want to wait for the text to be changed from an external source before I check for it again.

HTML:

<div class="panel">
    <button type="submit" onclick="promptTransaction()">Load Transaction</button>
    <button type="submit" onclick="handleMessage()">Post Message</button>
    <select name="messageType" class="messageType">
        <option>Submit</option>
        <option>Amount</option>
    </select>
    <div class="message-box"><b>Sending message to hosted page:</b><span class="message-out">waiting...</span></div>
    <div class="message-box"><b>Receiving message from hosted page:</b><span class="message-in">waiting...</span></div>
</div>

so when I click the 'post message' button, I should receive a new text from external source and change the span with a classname 'message-in'.

Currently, my test looks like this:

        element(by.cssContainingText('button','Post Message')).click().then(function() {

            //WAIT FOR 10 seconds

            element(by.css('.message-box .message-in')).getText().then(function (text) {
                var response = JSON.parse(text);

                expect(response.type).toBe('msax-cc-result');
                expect(response.value.Transaction).toBe('Tokenize');
                expect(response.value.CardToken).not.null();
            })
        });

Also, in the text result that is returned from external source, I converted it to json object, but can't since there is a '\\' on it, is there a way to remove it before converting it into an object.

passed data:

{"type":"msax-cc-result","value":"{\"Transaction\":\"Tokenize\",\"CardToken\":\"ba9c609f-45fc-49aa-b8b2-ecaffbc56d43\"}"}

Answer 1

Usually this is browser.sleep(N) , but it is generally speaking not recommended to introduce hardcode delays between browser actions. A better mechanism is an Explicit Wait - waiting for a specific condition to be met on a page using browser.wait() which would periodically check the expected condition status until a timeout happens. Comparing to browser.sleep() , browser.wait() would stop waiting immediately after the wait condition becomes truthy.

For instance, if you know what text to wait for, textToBePresentInElement should fit:

var EC = protractor.ExpectedConditions;
var elm = $(".message-out");
browser.wait(EC.textToBePresentInElement(elm, "Some message"), 5000);

Or, you may for instance, wait for waiting... not to be present in element:

browser.wait(EC.not(EC.textToBePresentInElement(elm, "waiting...")), 5000);

where 5000 is a timeout in milliseconds.