Skip to main content

Class: CssLocator

Defined in: packages/core/src/locators/CssLocator.ts:11

Extended by​

Constructors​

Constructor​

new CssLocator(selector, initializeValue?): CssLocator

Defined in: packages/core/src/locators/CssLocator.ts:15

Parameters​

selector​

string

initializeValue?​

Partial<CssLocatorInitializer>

Returns​

CssLocator

Properties​

selector​

readonly selector: string

Defined in: packages/core/src/locators/CssLocator.ts:16

Accessors​

complexity​

Get Signature​

get complexity(): LocatorComplexity

Defined in: packages/core/src/locators/CssLocator.ts:41

Returns​

LocatorComplexity

relative​

Get Signature​

get relative(): LocatorRelativePosition

Defined in: packages/core/src/locators/CssLocator.ts:25

Returns​

LocatorRelativePosition

Methods​

and()​

and(...locators): CssLocator

Defined in: packages/core/src/locators/CssLocator.ts:75

Compose additional matchers onto the SAME element, producing one compound CSS selector — e.g. [role="button"] and [aria-label="Open"] together become [role="button"][aria-label="Open"].

This is the ergonomic, footgun-free form of same-element composition: it supersedes locatorUtil.append(byRole('button'), byAriaLabel('Open', 'Same')) — there is no 'Same' argument to remember (the relationship no longer has to be stored on the appended child) and no wrapper call. The result keeps THIS locator's position relative to its parent; the appended matchers contribute only their attribute/selector fragment.

Same-element, pure-CSS only:

  • Put a tag-name matcher (byTagName) FIRST — a CSS type selector is only valid at the start of a compound (input[type="text"], never [type="text"]input).
  • Computed accessible names (aria-labelledby / <label> / text) are not CSS-expressible and stay out of scope (see #923); compose a verbatim aria-label via byAriaLabel instead.
  • Linked locators (byLinkedElement) resolve at runtime and cannot be folded into a static compound; calling .and() on one, or passing one, throws.

Parameters​

locators​

...CssLocator[]

Additional same-element matchers to compound onto this one.

Returns​

CssLocator

Example​

const openButton = byRole('button').and(byAriaLabel('Open'));
const activeTab = byRole('tab').and(byAttribute('aria-selected', 'true'));

chain()​

chain(...locatorsToAppend): PartLocator

Defined in: packages/core/src/locators/CssLocator.ts:29

Parameters​

locatorsToAppend​

...PartLocator[]

Returns​

PartLocator

clone()​

clone(override?): CssLocator

Defined in: packages/core/src/locators/CssLocator.ts:89

Parameters​

override?​

Partial<CssLocatorInitializer>

Returns​

CssLocator