.getCssProperty() Suggest edits


Retrieve the value of a css property for a given DOM element.

getCssProperty() will automatically wait for the element to be present (until the specified timeout). If the element is not found, an error is thrown which will cause the test to fail. Starting with v1.2 you can suppress element not found errors by specifying the suppressNotFoundErrors option.

Usage

.getCssProperty(selector, cssProperty, callback)
.getCssProperty(using, selector, cssProperty, callback)

Parameters

Name Type description
using
Optional		 string

The locator strategy to use. See W3C Webdriver - locator strategies
selector string|object

The selector (CSS/Xpath) used to locate the element. Can either be a string or an object which specifies element properties.
cssProperty string

The CSS property to inspect.
callback function

Callback function which is called with the result value; not required if using await operator.

Returns

Type description
* The value of the css property

Example

module.exports = {
  demoTest(browser) {
    browser.getCssProperty('#main ul li a.first', 'display', function(result) {
      console.log('result', result);
    });

    // with explicit locate strategy
    browser.getCssProperty('css selector', '#main ul li a.first', 'display', function(result) {
      console.log('result', result);
    });

    // with selector object - see https://nightwatchjs.org/guide#element-properties
    browser.getCssProperty({
      selector: '#main ul li a.first',
      index: 1,
      suppressNotFoundErrors: true
    }, 'display', function(result) {
      console.log('result', result);
    });
  },

  demoTestAsync: async function(browser) {
    const result = await browser.getCssProperty('#main ul li a.first', 'display');
    console.log('display', result);
  }
}

W3C WebDriver spec