> 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/browser.md).

# Browser

The Browser class in Ordino AI provides a suite of browser-level automation capabilities. It allows seamless interaction with browser windows, navigation, alerts, cookies, and more.

### Usage : `browser`

### 🧩 Code

The Browser class is designed to interact with the browser

To insert a code block with syntax highlighting:

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

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

oi.ui.browser().navigateToUrl('https://ordino.ai');
```

{% endtab %}

{% tab title="Playwright" %}

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

await oi.ui(this.page).browser().navigateToUrl('https://ordino')
```

{% endtab %}
{% endtabs %}

### Navigation Methods

**navigateToUrl(url: string): void**

Navigates to the specified URL.

* **@param** `url` – The URL to navigate to.
* **@returns** `void`

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

```javascript
oi.ui.browser().navigateToUrl('https://ordino.ai');
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().navigateToUrl('https://ordino.ai');
```

{% endtab %}
{% endtabs %}

**refreshPage(): void**

Refreshes the current page.

* **@returns** `void`

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

```javascript
oi.ui.browser().refreshPage('https://ordino.ai');
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().refreshPage()
```

{% endtab %}
{% endtabs %}

**goBack(): void**

Navigates back to the previous page.

* **@returns** `void`

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

```javascript
oi.ui.browser().goBack();
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().goBack()
```

{% endtab %}
{% endtabs %}

**goForward(): void**

Navigates forward to the next page.

* **@returns** `void`

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

```javascript
oi.ui.browser().goForward();
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().goForward()
```

{% endtab %}
{% endtabs %}

**getCurrentUrl(): Chainable\<String>**

Retrieves the current URL

* **@returns** `object<promise>`

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

```javascript
oi.ui.browser().getCurrentUrl().then((url) => {
  console.log('Current URL:', url);
});
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().getCurrentUrl()
```

{% endtab %}
{% endtabs %}

**getPageTitle(): Chainable\<String>**

Retrieves the title of the current page.

* **@returns** `object<promise>`

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

```javascript
oi.ui.browser().getPageTitle().then((title) => {
  console.log('Page Title:', title);
});
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().getPageTitle()
```

{% endtab %}
{% endtabs %}

**assertUrl(expectedUrl: \<String>): void**

Asserts that the current URL matches the specified URL.

* **@param** `url` – The URL to navigate to.
* **@returns** `void`

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

```javascript
oi.ui.browser().assertUrl('https://ordino.ai');
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().assertUrl('')
```

{% endtab %}
{% endtabs %}

**assertPageTitle(expectedTitle: \<String>): void**

Asserts that the current page title matches the specified title.

* **@param** `title` – The title to assert
* **@returns** `void`

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

```javascript
oi.ui.browser().assertPageTitle('Ordino - Home');
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().assertPageTitle('')
```

{% endtab %}
{% endtabs %}

### Browser Session & Storage

**clearBrowserCache: void**

Clears the browser cache.

* **@returns** `void`

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

```javascript
oi.ui.browser().clearBrowserCache();
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().clearBrowserCache()
```

{% endtab %}
{% endtabs %}

**clearBrowserCookies: void**

Clears the browser cookies.

* **@returns** `void`

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

```javascript
oi.ui.browser().clearBrowserCookies();
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().clearBrowserCookies()
```

{% endtab %}
{% endtabs %}

**setBrowserCookie(name: string, value: string): void**

Sets a browser cookie with the specified name and value.

* **@param** `name` – The name of the cookie.
* **@param** `value` – The value of the cookie.
* **@returns** `void`

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

```javascript
oi.ui.browser().setBrowserCookie('sessionId', '12345');
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().setBrowserCookie('','')
```

{% endtab %}
{% endtabs %}

**getBrowserCookies(): Chainable\<Cookie\[]>**

Retrieves all browser cookies.

* **@returns** `object<promise>`

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

```javascript
oi.ui.browser().getBrowserCookies().then((cookies) => {
  console.log('Cookies:', cookies);
});
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().getBrowserCookies()
```

{% endtab %}
{% endtabs %}

### Window & Frame Actions

**setWindowSize(width: number, height: number): void**

Sets the size of the browser window.

* **@param** `width` – The width of the window.
* **@param** `height` – The height of the window.
* **@returns** `void`

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

```javascript
oi.ui.browser().setWindowSize(1280, 720);
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().setWindowSize(1280, 720)
```

{% endtab %}
{% endtabs %}

**switchToWindow(windowName: string): void**

Switches to the specified window.

* **@returns** `void`

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

```javascript
oi.ui.browser().switchToWindow('newWindow');
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().switchToWindow('newWindow')
```

{% endtab %}
{% endtabs %}

**switchToFrame(frameName: any): void**

Retrieves all browser cookies.

* **@param** `frame-name` - The name or index of the frame to switch to.
* **@returns** `void`

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

```javascript
ui.browser().switchToFrame('iframe-id');
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().switchToFrame('')
```

{% endtab %}
{% endtabs %}

**closeCurrentWindow(): void**

Closes the current window.

* **@returns** `void`

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

<pre class="language-javascript"><code class="lang-javascript"><strong>ui.browser().closeCurrentWindow();
</strong></code></pre>

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().closeCurrentWindow()
```

{% endtab %}
{% endtabs %}

**openNewTab(url: string): void**

Opens a new tab with the specified URL.

* **@param** `url` - The url to open in the new tab.
* **@returns** `void`

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

```javascript
ui.browser().openNewTab('https://ordino.ai');
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().openNewTab('https://ordino.ai')
```

{% endtab %}
{% endtabs %}

**assertBrowserIsOpen(): void**

Asserts that the browser is open.

* **@returns** `void`

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

```javascript
ui.browser().oi.ui.browser.assertBrowserIsOpen();
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().assertBrowserIsOpen()
```

{% endtab %}
{% endtabs %}

### Screenshots & Alerts <a href="#screenshots--alerts" id="screenshots--alerts"></a>

**takeScreenshot(fileName: string): void**

Takes a screenshot and saves it with the specified file name.

* **@param** `file-name` - The name of the file to save the screenshot as
* **@returns** `void`

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

```javascript
ui.browser().takeScreenshot('homepage');
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().takeScreenshot('')
```

{% endtab %}
{% endtabs %}

**takeFullPageScreenshot(fileName: string): void**

Takes a full-page screenshot and saves it with the specified file name.

* **@param** `frame-name` - The name of the file to save the full-page screenshot as.
* **@returns** `void`

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

```javascript
ui.browser().takeFullPageScreenshot('full-homepage');
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().takeFullPageScreenshot('')
```

{% endtab %}
{% endtabs %}

**handleAlert(alertText: string, action: string): void**

Handles an alert with the specified text and action.

* **@param** `alert-text` - the text of the alert.
* **@param** `action` - The action to take on the alert (e.g., accept, dismiss).
* **@returns** `void`

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

```javascript
ui.browser().handleAlert('Confirm Delete?', 'accept');
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().handleAlert(action: "accept" | "dismiss")
```

{% endtab %}
{% endtabs %}

### Network Handling <a href="#screenshots--alerts" id="screenshots--alerts"></a>

**waitForNetworkIdle(): void**

Waits for the network to be idle.

* **@param** `frame-name` - The name or index of the frame to switch to.
* **@returns** `void`

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

```javascript
ui.browser().waitForNetworkIdle();
```

{% endtab %}

{% tab title="Playwright" %}

```javascript
await oi.ui(this.page).browser().waitForNetworkIdle()
```

{% endtab %}
{% endtabs %}