copy Copy chevron-down
code SDK Referencechevron-right toggle-off ComponentsButton The Button class provides a simplified interface for handling button interactions in test automation. It supports essential operations such as clicking, asserting button states, and scrolling events.
The Button class is designed to interact with common button element
To insert a code block with syntax highlighting:
Copy import { oi } from " @ordino.ai/spartify-engine " ;
oi . ui . button ( this . btn_element ) . click ()
Copy import { oi } from " @ordino.ai/spartify-engine " ;
await oi . ui ( this . page ) . button ( this . btn_element ) . click ()
click(): void
Simulates a click action on the button
Copy oi . ui . button ( this . btn_element ) . click ()
Copy await oi . ui ( this . page ) . button ( this . element ) . click () forceClick(): void
Forces a click action on the button, bypassing any potential blockers.
doubleClick(): void
Simulates a double-click action on the button. @param forceClick - true (optional)
@param {force} – true (optional)
rightClick(): void
Simulates a right-click action on the button.
clickAt(x: number, y: number): void
Simulates a click action at the specified coordinates relative to the button.
@param x – The x-coordinate.
@param y – The y-coordinate.
clickCenter(): void
Simulates a click action at the center of the button.
clickAll(): void
Simulates a click action on all instances of the button.
clickFirst(): void
Simulates a click action on the first instance of the button.
clickLast(): void
Simulates a click action on the last instance of the button
clickAndHold(): void
Simulates a click-and-hold action on the button.
clickByText(text: string): void
Simulates a click action on the button identified by the specified text.
@param text – The text to identify the button.
clickByIndex(index: number): void
Simulates a click action on the button identified by the specified index.
@param index – The index to identify the button.
clickWithOffset(x: number, y: number): void
Simulates a click action on the button with an offset from its top-left corner.
@param x – The x-coordinate offset.
@param y – The y-coordinate offset.
focusAndClick(): void
Focuses on the button and then simulates a click action
assertText(text: string): void
Asserts that the button contains the specified text.
@param text – The expected text content of the button.
assertColor(color: string): void
Asserts that the button has the expected color.
@param color – The expected color of the button.
assertCssProperty(property: string, value: string): void
Asserts that the button has the specified CSS property with the given value.
@param property – The CSS property to check.
@param value – The expected value of the CSS property.
scrollToElement(): void
Scrolls to the button element.
Ordino allows you to build custom actions or user journeys by directly interacting with the underlying tool’s native methods and actions.
This approach gives you full control, bypassing Ordino’s abstraction layer, and ensures you can leverage tool-specific capabilities as needed.
locator → The element locator (e.g., XPath, CSS selector, or tool-specific reference).
Returns → A tool element object on which you can invoke native actions (e.g., .click(), .type()).
Ordino Custom Mode
Using Ordino’s direct tool method reference:
Here, Ordino will call the Cypress (or other tool) element object directly, rather than going through Ordino’s wrapper.
Building User Journeys
By chaining multiple oi.ui.element() calls, you can construct full user journeys while still working with native tool methods .
Example: Login Flow
Use this mode when you need maximum control over the test framework.
This does not abstract or transform the call – it executes directly on the tool object (e.g., Cypress, Playwright, etc.).
Perfect for custom journeys, advanced locators, or tool-specific actions not exposed by Ordino’s higher-level API.
Last updated 5 months ago