waitForDisplayed

Wait for an element for the provided amount of milliseconds to be displayed or not displayed.

info

As opposed to other element commands WebdriverIO will not wait for the element to exist to execute this command.

Usage

$(selector).waitForDisplayed({ timeout, reverse, timeoutMsg, interval })

Parameters

Name	Type	Details
options optional	WaitForOptions	waitForEnabled options (optional)
options.timeout optional	Number	time in ms (default: 500)
options.reverse optional	Boolean	if true it waits for the opposite (default: false)
options.timeoutMsg optional	String	if exists it overrides the default error message
options.interval optional	Number	interval between checks (default: waitforInterval)

Examples

Asynchronous Mode

index.html

<div id="elem" style="visibility: hidden;">Hello World!</div>
<script type="text/javascript">
    setTimeout(() => {
        document.getElementById('elem').style.visibility = 'visible';
    }, 2000);
</script>

waitForDisplayedExample.js

it('should detect when element is visible', async () => {
    const elem = await $('#elem')
    await elem.waitForDisplayed({ timeout: 3000 });
});
it('should detect when element is no longer visible', async () => {
    const elem = await $('#elem')
    await elem.waitForDisplayed({ reverse: true });
});

Synchronous Mode

index.html

<div id="elem" style="visibility: hidden;">Hello World!</div>
<script type="text/javascript">
    setTimeout(() => {
        document.getElementById('elem').style.visibility = 'visible';
    }, 2000);
</script>

waitForDisplayedExample.js

it('should detect when element is visible', () => {
    const elem = $('#elem')
    elem.waitForDisplayed({ timeout: 3000 });
});
it('should detect when element is no longer visible', () => {
    const elem = $('#elem')
    elem.waitForDisplayed({ reverse: true });
});

caution

Synchronous Mode will depcrecated with Node.js v16. With an update to the underlying Chromium version it became technically impossible to provide the same synchronous behavior. We recommend to start transition to asynchronous command execution. For more information, see our RFC.