Browser script examples

The following sections showcase ready-to-use browser scripts. See Using the Zyte IDE to learn how to use them.

Search

The following example subclasses SearchKeywordInteraction() to implement search for docs.zyte.com:

import { SearchKeywordInteraction } from "smartbrowser-core-interactions/index.ts";

export default class DocsZyteComSearchKeywordInteraction extends SearchKeywordInteraction {
    domains = ["docs.zyte.com"];
    keywordCssSelector = "input.sidebar-search";
}

To try the example, use https://docs.zyte.com/ as target URL, {"keyword": "foo"} as parameters, and any geolocation.

Note

If you debug the example in real time from the Zyte IDE, for the browser script to work you must widen the browser view until the Zyte docs search box becomes visible.

This is not a problem in a Zyte API requests, where the default viewport is wide enough.

Basic form

The following example fills and submits the login form at quotes.toscrape.com:

Warning

Zyte owns toscrape.com and allows using that website for web scraping purposes, including this login form.

You should seek legal counsel before you implement login functionality for a different website.

import { BaseInteraction, Page } from "smartbrowser-core-interactions/index.ts";

interface Args {
    username: string;
    password: string;
}

export default class QuotesToScrapeComLoginInteraction extends BaseInteraction {
    domains = ["quotes.toscrape.com"];
    async do(page: Page, args: Args): Promise<void> {
        await page.type("#username", args.username);
        await page.type("#password", args.password);
        await page.waitForTimeout(2);
        await page.keyPress("Enter");
        await page.waitForSelector(".quote");
    }
}

To try the example, use https://quotes.toscrape.com/login as target URL, {"username": "admin", "password": "1234"} as parameters, and any geolocation.

Interactive form

The following example fills and submits the content filtering form at quotes.toscrape.com/search.aspx:

import { BaseInteraction, Page } from "smartbrowser-core-interactions/index.ts";

interface Args {
    author: string;
    tag: string;
}

export default class QuotesToScrapeComSearchInteraction extends BaseInteraction {
    domains = ["quotes.toscrape.com"];
    async do(page: Page, args: Args): Promise<void> {
        await page.select("#author", [args.author]);
        await page.waitForSelector({type: "css", "value": "#tag option[value]", state: "attached"});
        await page.select("#tag", [args.tag]);
        await page.waitForTimeout(3);
        await page.click('input[name="submit_button"]');
        await page.waitForSelector(".quote");
    }
}

To try the example, use https://quotes.toscrape.com/search.aspx as target URL, {"author": "Steve Martin", "tag": "humor"} as parameters, and any geolocation.