javascript - 如何模糊 puppeteer 中的输入元素？

Question

我正在用 puppeteer 师测试形式。该表单具有在输入元素上发生模糊事件时触发的验证。但是在 puppeteer 中没有模糊元素的 API。

我正在尝试聚焦/单击 body 或 div 元素，但这无法触发我的 onBlur 验证。 page.click("body"), page.focus("body")

现在，我正在为火焰模糊事件使用虚假的点击图像。但这不是一个好方法。

export class LoginPage {
  constructor(private page: Page) {}

  async setup(): Promise<void> {
    await this.page.goto(MY_LOGIN_FORM);
  }

  async typeEmail(email: string): Promise<void> {
    await this.page.type("input[name=email]", email);
    await this.blur();
  }

  async typePassword(password: string): Promise<void> {
    await this.page.type("input[name=password]", password);
    await this.blur();
  }

  async clickLoginButton(): Promise<void> {
    await this.page.click("button");
  }

  private async blur(): Promise<void> {
    // HACK
    await this.page.click("img");
  }
}

有什么方法可以不使用 hack 来模糊输入元素吗？

Answer 1

我想使用 $eval甚至可能更干净一点:

await page.$eval('input[name=email]', e => e.blur());