A model which represents a DOM element.
The playwright page object, frame or component model to be used as the parent of this component.
A relative xpath to this component from the parent.
Optional nth: numberOptional position of this component among xpath matches. Position is 1 indexed. Negative numbers count from the end.
Readonly childA locator to the child item container
Readonly expandA locator to the expand/collapse button
Readonly labelReadonly navA locator to the navigation items root container
Protected rootThe root playwright entity from which to resolve this component model's xpath.
Readonly xpathAn absolute xpath to the DOM element that this component model represents.
This method gets a child component model with a provided type. This is useful for modelling a page where the UI is composed in a custom manner.
A ComponentModel type. e.g. ToggleButton / Modal
Optional xpath: stringAn optional xpath relative to this component. If not provided, the model's default xpath will be used.
Optional nth: numberOptional position among matches. Position is 1 indexed. Negative numbers count from the end.
This method gets a locator to the DOM element represented by this component model.
This method gets a locator to a DOM element relative to the element represented by this component model.
An xpath relative to this component.
Optional nth: numberOptional position among matches. Position is 1 indexed. Negative numbers count from the end.
Gets navigation item by position in navigation group.
1-based index. Negative numbers count from the end.
Gets navigation item by matching data-test-id attribute
Value of navigation items data-test-id attribute
1-based index. Specifies which match to return in case multiple items match data-test-id, defaults to 1
Gets navigation item by matching label text in the navigation group
Navigation item label text
1-based index. Specifies which match to return in case multiple items match label, defaults to 1
Generated using TypeDoc
Base class for UI component models. A component model is an abstraction of a playwright locator. Specific UI components can be modelled by extending this class and a UI structure can be represented through composition.
A component model is initiated with a parent object and an xpath. The DOM element which is represented by the model is found by applying the xpath relative to the parent.
The
getLocatormethod exposes a playwright locator. This method can be used with 0 arguments to get a locator directly to the DOM element the model represents, or it can be used with an xpath argument to get a relative element.Only XPATH selectors can be used. This is because xpaths are combined through string concatenation so that the selector for a component model is always absolute. An absolute xpath is convenient when debugging failed matches as it can be copied and analyzed with browser dev tools. This approach was preferred over using Playwright relative locators because relative locators are logged in test output as a series of selectors, possibly using mixed technologies.