Python中Playwright 页面操作基础的示例代码_Python

playwright 的页面操作非常强大且直观，核心优势在于自动等待（auto-waiting）：大多数操作会在元素真正可交互时才执行，无需手动添加 sleep() 或显式等待。下面以 node.js/typescript（playwright test 框架）为主进行讲解，同时附上 python 对应写法。

1.基本导航操作

// 导航到页面
await page.goto('https://example.com');

// 刷新页面
await page.reload();

// 前进 / 后退
await page.goback();
await page.goforward();

2.元素定位（locators）——最推荐方式

playwright 强烈推荐使用 locator 而不是直接的 page.$()，因为 locator 是惰性求值的，支持自动等待。

// 推荐的现代定位方式（自动等待 + 链式调用）
const button = page.getbyrole('button', { name: '提交' });           // 无障碍角色
const link = page.getbytext('点击这里');                            // 精确文本
const partiallink = page.getbytext('点击', { exact: false });      // 部分匹配
const input = page.getbylabel('用户名');                            // 标签关联
const placeholder = page.getbyplaceholder('请输入用户名');         // placeholder
const alt = page.getbyalttext('logo');                              // 图片 alt
const title = page.getbytitle('关闭');                              // title 属性
const testid = page.getbytestid('submit-btn');                      // data-testid（推荐！）
const css = page.locator('#login-form input[type="password"]');     // 传统 css

3.常用交互操作

// 点击
await page.getbyrole('button', { name: '登录' }).click();

// 双击 / 右键
await button.dblclick();
await button.click({ button: 'right' });

// 输入文本
await page.getbylabel('用户名').fill('admin');           // 清空后输入（推荐）
await page.getbylabel('密码').type('123456');            // 逐字符输入（模拟真人）

// 清除输入框
await input.clear();

// 勾选 / 取消勾选 checkbox 或 radio
await page.getbyrole('checkbox', { name: '记住我' }).check();
await page.getbyrole('checkbox').uncheck();

// 下拉选择 select
await page.getbylabel('国家').selectoption('cn');                 // value 值
await page.getbylabel('国家').selectoption({ label: '中国' });    // 可见文本
await page.getbylabel('国家').selectoption({ index: 2 });         // 索引

// 上传文件
await page.getbylabel('上传头像').setinputfiles('path/to/file.jpg');
// 多文件
await input.setinputfiles(['file1.jpg', 'file2.png']);
// 清除上传
await input.setinputfiles([]);

4.鼠标与键盘操作

// 鼠标悬停
await page.getbytext('菜单').hover();

// 拖拽
await page.locator('#source').dragto(page.locator('#target'));

// 键盘操作
await page.keyboard.press('enter');
await page.keyboard.press('control+a');      // 组合键
await page.keyboard.type('hello world');    // 输入文本
await page.keyboard.down('shift');          // 按住
await page.keyboard.up('shift');            // 释放

5.页面信息获取

// 获取页面标题和 url
const title = await page.title();
const url = await page.url();

// 获取元素文本
const text = await page.getbyrole('heading').textcontent();
const alltexts = await page.getbyrole('listitem').alltextcontents();

// 获取输入框值
const value = await page.getbylabel('用户名').inputvalue();

// 获取属性
const href = await page.getbyrole('link').getattribute('href');

6.截图与录屏

// 全页面截图
await page.screenshot({ path: 'full.png', fullpage: true });

// 元素截图
await page.getbyrole('button').screenshot({ path: 'button.png' });

// 录制视频（需在 playwright.config.ts 中启用）
await page.video().saveas('video.webm');

7.python 同步版对应示例

# 点击
page.get_by_role("button", name="登录").click()

# 输入
page.get_by_label("用户名").fill("admin")
page.get_by_label("密码").fill("123456")

# 选择下拉
page.get_by_label("国家").select_option("cn")

# 上传文件
page.get_by_label("上传").set_input_files("file.jpg")

# 截图
page.screenshot(path="screenshot.png", full_page=true)