浏览器自动化

GenAIScript 提供了一个简化的API，用于通过Playwright与无头浏览器进行交互。这使您能够与网页互动、抓取数据并自动化任务。

const page = await host.browse(
    "https://github.com/microsoft/genaiscript/blob/main/packages/sample/src/penguins.csv"
)
const table = page.locator('table[data-testid="csv-table"]')
const csv = parsers.HTMLToMarkdown(await table.innerHTML())
def("DATA", csv)
$`Analyze DATA.`

安装

Playwright在执行前需要安装浏览器和依赖项。如果无法加载浏览器，GenAIScript会自动尝试安装它们。不过，您也可以使用以下命令手动安装：

npx playwright install --with-deps chromium

如果您看到此错误消息，可能需要手动安装依赖项。

╔═════════════════════════════════════════════════════════════════════════╗
║ Looks like Playwright Test or Playwright was just installed or updated. ║
║ Please run the following command to download new browsers:              ║
║                                                                         ║
║     yarn playwright install                                             ║
║                                                                         ║
║ <3 Playwright Team                                                      ║
╚═════════════════════════════════════════════════════════════════════════╝

`host.browse`

此函数启动一个新的浏览器实例，并可选择导航到某个页面。当脚本结束时，页面会自动关闭。

const page = await host.browse(url)

`incognito“

设置 incognito: true 将创建一个隔离的非持久化浏览器上下文。非持久化浏览器上下文不会向磁盘写入任何浏览数据。

const page = await host.browse(url, { incognito: true })

`recordVideo`

Playwright可以录制浏览器会话中每个页面的视频。您可以通过传递recordVideo选项来启用此功能。录制视频也意味着incognito模式，因为它需要创建一个新的浏览上下文。

const page = await host.browse(url, { recordVideo: true })

默认情况下，视频尺寸为800x600，但您可以通过将尺寸作为recordVideo选项传递来更改它。

const page = await host.browse(url, {
    recordVideo: { width: 500, height: 500 },
})

视频将在页面关闭后保存在临时目录.genaiscript/videos//下。 您需要先关闭页面才能访问视频文件。

await page.close()
const videoPath = await page.video().path()

视频文件可以使用视频工具进一步处理。

`connectOverCDP`

你可以提供一个使用Chrome DevTools Protocol的端点，通过connectOverCDP实现。

const page = await host.browse(url, { connectOverCDP: "endpointurl" })

定位器

您可以使用page.get...或page.locator方法来选择页面上的元素。

// select by Aria roles
const button = page.getByRole("button")
// select by test-id
const table = page.getByTestId("csv-table")

元素内容

你可以访问元素的innerHTML、innerText、value和textContent属性。

const table = page.getByTestId("csv-table")
const html = table.innerHTML() // without the outer <table> tags!
const text = table.innerText()
const value = page.getByRole("input").value()

您可以使用HTML中的解析器将HTML转换为Markdown。

const md = await HTML.convertToMarkdown(html)
const text = await HTML.convertToText(html)
const tables = await HTML.convertTablesToJSON(html)

截图

您可以截取当前页面或定位器的屏幕截图，并通过支持视觉功能的LLM（如gpt-4o）使用defImages功能。

const screenshot = await page.screenshot() // returns a node.js Buffer
defImages(screenshot)

(高级) 原生Playwright API

返回的page实例是一个原生的Playwright Page对象。您可以导入playwright并将该实例转换回原生Playwright对象。

import { Page } from "playwright"

const page = await host.browse(url) as Page