Node
interface, inheriting common element-querying capabilities.
Instances of Element are typically obtained by querying a Page or another Element.
element
element(selector: ".my-class", text: "Submit")
selector
: String - The CSS selector for the element. Example: "#username"
for <input id="username" />
.text
: String - Finds an element by its text content. Example: "Login"
for <button>Login</button>
.role
: ARIARole - Finds an element by its ARIA role. Example: "button"
for <div role="button">Submit</div>
.label
: String - Finds an element by its ARIA label. Example: "Search button"
for <button aria-label="Search button"><svg/></button>
.placeholder
: String - Finds an element by its placeholder text. Example: "Enter your email"
for <input placeholder="Enter your email" />
.altText
: String - Finds an element by its image alt text. Example: "Company logo"
for <img alt="Company logo" src="..." />
.title
: String - Finds an element by its title attribute. Example: "Close dialog"
for <span title="Close dialog">X</span>
.testId
: String - Finds an element by its data-testid attribute. Example: "submit-button"
for <button data-testid="submit-button">Go</button>
.filter
: ElementFilterOptions - Advanced filtering options for the element.elements
elements(selector: "div.product-item")
selector
: String - The CSS selector for the element. Example: "#username"
for <input id="username" />
.text
: String - Finds an element by its text content. Example: "Login"
for <button>Login</button>
.role
: ARIARole - Finds an element by its ARIA role. Example: "button"
for <div role="button">Submit</div>
.label
: String - Finds an element by its ARIA label. Example: "Search button"
for <button aria-label="Search button"><svg/></button>
.placeholder
: String - Finds an element by its placeholder text. Example: "Enter your email"
for <input placeholder="Enter your email" />
.altText
: String - Finds an element by its image alt text. Example: "Company logo"
for <img alt="Company logo" src="..." />
.title
: String - Finds an element by its title attribute. Example: "Close dialog"
for <span title="Close dialog">X</span>
.testId
: String - Finds an element by its data-testid attribute. Example: "submit-button"
for <button data-testid="submit-button">Go</button>
.filter
: ElementFilterOptions - Advanced filtering options for the element.ariaSnapshot
attribute
attribute(name: "href")
on an <a>
tag, or attribute(name: "data-custom")
on any element.
name
: String! - The name of the attribute to retrieve. Example: "class"
, "id"
, "value"
, "src"
.attributes
{ "id": "myElement", "class": "active important", "data-value": "123" }
boundingBox
innerHTML
<p>Hello <b>world</b></p>
, innerHTML would be "Hello <b>world</b>"
.
innerText
<p>Hello <b>world</b></p>
, innerText might be "Hello world"
.
markdown
screenshot
screenshot(options: { type: PNG, omitBackground: true })
options
: ScreenshotOptions - Options to configure the screenshot, such as image type, quality, or clipping. See ScreenshotOptions
.textContent
<script>
and <style>
tags.
Example: For <p>Hello <b>world</b></p>
, textContent would be "Hello world"
.
count
elements
query on a parent),
this field returns the total number of elements found by that selector.
Otherwise, it typically returns 1 if the element exists.
Example: If page.elements(selector: "li")
found 5 items, and this is one of them, count
would be 5.
first
elements
query),
this field returns the first element in that list.
Returns null if this element is not part of such a list or if the list is empty.
inputValue
<input>
, <textarea>
, or <select>
element.
For a <select multiple>
element, it returns the first selected option’s value.
Returns null if the element is not an input type that has a value.
Example: For <input type="text" value="hello">
, inputValue
would be “hello”.
isChecked
<input type="checkbox" checked>
, isChecked
would be true.
isDisabled
<button disabled>Click Me</button>
, isDisabled
would be true.
isEditable
<input>
, <textarea>
, or has the ‘contenteditable’ attribute set.
Returns true if editable, false otherwise.
isEnabled
isDisabled
.
Returns true if the element is enabled, false otherwise.
isHidden
display: none
or visibility: hidden
CSS properties,
or if it’s a details element that is closed.
Returns true if hidden, false otherwise. Note: An element can be hidden but still exist in the DOM.
isVisible
display: none
, visibility: hidden
, opacity, element size,
and whether it’s within the viewport’s visible area.
Returns true if visible, false otherwise. This is generally the opposite of isHidden
.
last
elements
query),
this field returns the last element in that list.
Returns null if this element is not part of such a list or if the list is empty.
nth
elements
query),
this field retrieves the element at the specified 0-based index within that list.
Returns null if the index is out of bounds.
Example: If page.elements(selector: "li")
returned three items, element.nth(1)
would refer to the second list item.
index
: Int! - The 0-based index of the element to retrieve from the list.selector
xpath