> For the complete documentation index, see [llms.txt](https://ordino-ai.gitbook.io/ordino-ai/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://ordino-ai.gitbook.io/ordino-ai/sdk-reference/components/link.md).

# Link

The Link class provides a clean interface for interacting with generic container elements such as \<link> blocks. It includes methods for selection, assertions, and scrolling into view.

### Usage : `link`

### 🧩 Code

The Link class is designed to interact with common link element

To insert a code block with syntax highlighting:

{% tabs %}
{% tab title="Cypress" %}

```javascript
import { oi } from "@ordino.ai/spartify-engine";

oi.ui.link(this.lnk_element).click()
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
import { oi } from "@ordino.ai/spartify-engine";

await oi.ui(this.page).link(this.lnk_element).click()
```

{% endtab %}
{% endtabs %}

### Methods

**click(): void**\
Clicks the link.

**@returns** `void`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_element).click()
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_element).click()
```

{% endtab %}
{% endtabs %}

**forceClick(): void**\
Forces a click on the link.

**@returns** `void`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_element).forceClick()
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_element).forceClick()
```

{% endtab %}
{% endtabs %}

**doubleClick(forceClick:boolean): void**\
Double-clicks the link\
@param forceClick {boolean} the value to match.(Optional)

**@returns** `void`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_element).doubleClick(true)
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_element).doubleClick(true)
```

{% endtab %}
{% endtabs %}

**rightClick(forceClick:boolean): void**\
Right-clicks the link.\
@param forceClick {boolean} the value to match.(Optional)

**@returns** `void`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_element).rightClick(true)
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_element).rightClick(true)
```

{% endtab %}
{% endtabs %}

**clickLinkAtCoordinates(x: number, y: number, forceClick:boolean): void**\
Clicks the link at the specified coordinates.\
@param x - The x-coordinate.\
@param y - The y-coordinate.

**@returns** `void`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_element).clickLinkAtCoordinates(1,2)
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_element).clickLinkAtCoordinates(1,2)
```

{% endtab %}
{% endtabs %}

**centerClick(forceClick:boolean): void**\
Clicks the link at its center.

**@returns** `void`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_element).centerClick(true)
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_element).centerClick(true)
```

{% endtab %}
{% endtabs %}

**clickFirst(forceClick:boolean): void**\
Clicks the first link.

**@returns** `void`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_element).clickFirst(true)
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_element).clickFirst(true)
```

{% endtab %}
{% endtabs %}

**clickLast(forceClick:boolean): void**\
Clicks the last link.

**@returns** `void`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_element).clickLast(true)
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_element).clickLast(true)
```

{% endtab %}
{% endtabs %}

**getLinkHref(): void**\
Gets the href attribute of the link.

**@returns** `promise` &#x20;

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_element).getLinkHref()
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_element).getLinkHref()
```

{% endtab %}
{% endtabs %}

### Assertions

**isVisible(): boolean**\
Asserts that the link is visible.

**@returns** `boolean`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.txt_element).isVisible()
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_element).isVisible()
```

{% endtab %}
{% endtabs %}

**isHidden(): boolean**\
Asserts that the link is hidden

**@returns** `boolean`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_element).isHidden()
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_element).isHidden()
```

{% endtab %}
{% endtabs %}

**assertLinkHrefContains(text: string): void**\
Asserts that the href attribute of the link contains the specified text.\
@param text - the text to check for in the href attribute.

**@returns** `void`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_username).assertLinkHrefContains('text')
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_element).assertLinkHrefContains('text')
```

{% endtab %}
{% endtabs %}

**assertLinkHrefEquals(href: string): void**\
Asserts that the href attribute of the link equals the specified href.\
@param href - the href to compare with the link’s href attribute

**@returns** `void`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_element).assertLinkHrefEquals('text')
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_element).assertLinkHrefEquals('text')
```

{% endtab %}
{% endtabs %}

**assertLinkText(text: string): void**\
Asserts that the text of the link equals the specified text.\
@param text - the text to compare with the link’s text.

**@returns** `void`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_element).assertLinkText('text')
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_element).assertLinkText('text')
```

{% endtab %}
{% endtabs %}

**isDisabled(): void**\
Checks if the element is disabled.

**@returns** `boolean`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_username).isDisabled()
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_username).isDisabled()
```

{% endtab %}
{% endtabs %}

**isDisplayed(): Promise\<boolean>**\
Checks if the element is displayed

**@returns** `boolean`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_username).isDisplayed()
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_username).isDisplayed()
```

{% endtab %}
{% endtabs %}

**isFocused(): Promise\<boolean>**\
Checks if the element is focused

**@returns** `boolean`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_username).isFocused()
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_username).isFocused()
```

{% endtab %}
{% endtabs %}

**isHidden():** **Promise\<boolean>**\
Asserts that the link is hidden.

**@returns** `void`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_username).isHidden()
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_username).isHidden()
```

{% endtab %}
{% endtabs %}

**isEnabled(): Promise\<boolean>**\
Checks if the element is enabled

**@returns** `boolean`

{% tabs %}
{% tab title="Cypress" %}

```javascript
oi.ui.link(this.lnk_username).isEnabled()
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).link(this.lnk_username).isEnabled()
```

{% endtab %}
{% endtabs %}

### Scrolling Actions <a href="#scrolling-actions" id="scrolling-actions"></a>

**scrollToElement(): void**

Scrolls to the link element.

**@returns** `void`

{% tabs %}
{% tab title="Cypress" %}

<pre class="language-javascript"><code class="lang-javascript"><strong>oi.ui.button(this.lnk_element).scrollToElement()
</strong></code></pre>

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).button(this.element).scrollToElement()
```

{% endtab %}
{% endtabs %}

### Custom Events <a href="#scrolling-actions" id="scrolling-actions"></a>

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()`).

```javascript
// Generic pattern
element(locator): object
```

### <sub>Ordino Custom Mode</sub>

Using Ordino’s direct tool method reference:

```javascript
// Ordino direct-to-tool approach
oi.ui.element('@xpath').click()
```

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

```javascript
// Enter username
oi.ui.element('//input[@id="username"]').forceClick()

// Enter password
oi.ui.element('//input[@id="password"]').isVisible()

// Click login button
oi.ui.element('(//*[contains(text(),"Login")])[1]').click()
```

***

### Key Notes

* 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.