isDisplayed
Return true if the selected DOM-element is displayed.
info
As opposed to other element commands WebdriverIO will not wait for the element to exist to execute this command.
Usage
$(selector).isDisplayed()
Examples
- Asynchronous Mode
- Synchronous Mode
index.html
<div id="notDisplayed" style="display: none"></div>
<div id="notVisible" style="visibility: hidden"></div>
<div id="notInViewport" style="position:absolute; left: 9999999"></div>
<div id="zeroOpacity" style="opacity: 0"></div>
isDisplayed.js
it('should detect if an element is displayed', async () => {
let elem = await $('#notDisplayed');
let isDisplayed = await elem.isDisplayed();
console.log(isDisplayed); // outputs: false
elem = await $('#notVisible');
isDisplayed = await elem.isDisplayed();
console.log(isDisplayed); // outputs: false
elem = await $('#notExisting');
isDisplayed = await elem.isDisplayed();
console.log(isDisplayed); // outputs: false
elem = await $('#notInViewport');
isDisplayed = await elem.isDisplayed();
console.log(isDisplayed); // outputs: true
elem = await $('#zeroOpacity');
isDisplayed = await elem.isDisplayed();
console.log(isDisplayed); // outputs: true
});
index.html
<div id="notDisplayed" style="display: none"></div>
<div id="notVisible" style="visibility: hidden"></div>
<div id="notInViewport" style="position:absolute; left: 9999999"></div>
<div id="zeroOpacity" style="opacity: 0"></div>
isDisplayed.js
it('should detect if an element is displayed', () => {
let elem = $('#notDisplayed');
let isDisplayed = elem.isDisplayed();
console.log(isDisplayed); // outputs: false
elem = $('#notVisible');
isDisplayed = elem.isDisplayed();
console.log(isDisplayed); // outputs: false
elem = $('#notExisting');
isDisplayed = elem.isDisplayed();
console.log(isDisplayed); // outputs: false
elem = $('#notInViewport');
isDisplayed = elem.isDisplayed();
console.log(isDisplayed); // outputs: true
elem = $('#zeroOpacity');
isDisplayed = elem.isDisplayed();
console.log(isDisplayed); // outputs: 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.