标签: playwright

我正在尝试在我的部署目标计算机上安装 playwright 以便运行 UI 测试。

# Install the CLI once.
dotnet tool install --global Microsoft.Playwright.CLI

playwright install

然而，当使用 playwright CLI 包括 playwright 安装时，我得到：

找不到使用 Playwright 的项目。确保项目或解决方案存在于 C:\users\myuser 中，或使用 -p 提供另一个路径。

如何在虚拟机上安装 playwright？

编辑：

不幸的是，剧作家的 .NET nuget 包设计得不是很好。虽然 API 很棒，但部署却是一场噩梦。

您不仅无法在部署服务器上使用 CLI 安装浏览器，而且该软件包还向您的项目以及引用它的所有项目添加了 3x NodeJS 运行时 (200MB)。

阻止这些文件被发布是很重要的，并且每个构建的构建工件可以轻松增长到 1GB！

您无法配置 NodeJS 或剧作家本身的路径。

您可以在这里投票修复此问题： https ://github.com/microsoft/playwright-dotnet/issues/1850

在本地，我可以执行以下操作：

import { test, expect } from '@playwright/test';

test('should work', async ({ page }) => {
  await page.goto(`https://playwright.dev`);
  expect(await page.screenshot()).toMatchSnapshot('test.png');
});

npx playwright test --update-snapshots

这工作正常，但我想通过 Docker 生成文件，以便它们与在 CI 中运行时相同。在文档上，命令是：

docker run --rm --network host -v $(pwd):/work/ -w /work/ -it mcr.microsoft.com/playwright:v1.12.3-focal /bin/bash
npm install
npx playwright test --update-snapshots

这失败了，只显示红色测试。文档没有提到更多，这里的解决方案是什么？我现在用的是 M1 Mac，如果这有什么区别的话。

    browserContext.newPage: Browser closed.
    ==================== Browser output: ====================
    [pid=600][err] #8 0x00400667b49e <unknown>
    [pid=600][err] #9 0x00400343b226 <unknown>
    [pid=600][err] #10 0x00400ef190b3 <unknown>
    [pid=600][err] #11 0x00400343b02a <unknown>
    [pid=600][err] Crash keys:
    [pid=600][err]   "switch-7" = …

这是该对象的 html：

<div class="filter-component filter-component-1">
   <p class="usa-accordion__heading">
     <button aria-selected="false" class="filtered assignment usa-accordion__button filter-dropdown ds-c-button ds-u-padding-left--1 ds-u-padding-right--4 ds-u-padding-y--1" aria-expanded="false" aria-controls="a1">
       <span>Medicare-approved payment: Full Payment </span>
       <div class="filter-arrow down"></div>
     </button>
   </p>
</div>

我的目标是获取类中的 divfilter-component-1并将其存储在变量中

1 单击该 div 2 单击该 div 中的按钮

我觉得我需要做类似的事情

A NOTE: I have altered how we structure these tests so that they run in aws lambda. The normal sytax of test('test description') etc does not work here. Hence the awaits. Please just focus on the playwright syntax …

我有这个代码来定位链接，使用 python playwright：

nfo_link = page.locator('the xpath').get_attribute('href')
nfo_link = 'https://somesite.com' + nfo_link
logger_play.info('nfo_link: %s', nfo_link)

如果存在则工作正常，但如果不存在则会出现错误：

waiting for selector

我努力了：

 if (page.locator('the xpath').get_attribute('href')) == None:
       pass
 else:
       nfo_link = page.locator('the xpath').get_attribute('href')

和其他代码，但似乎都不起作用，我想，如果发现好，如果不继续，有人可以指出我正确的方法吗？

我正在努力使用 Playwright 正确设置报道。它报告所有文件的覆盖率均为 0（测试文件本身除外，如果我包含它们）。

我从https://playwright.dev/docs/api/class-coverage和https://github.com/bgotink/playwright-coverage/blob/main/src/fixtures.ts中获得灵感。我们的项目是一个单一存储库，其中文件夹中的测试e2e-tests/在其他相邻文件夹中包含的服务器上运行端到端测试，例如frontend/.

page当前设置在每个测试文件中使用如下所示的固定装置：

// frontend.spec.ts
import { test, expect } from "../fixtures";

test("something", ({ page ) => {
    // Do test stuff with page
});

其中夹具定义为

// fixtures/page.ts
import { Page, TestInfo } from "@playwright/test";

const pageWithCoverage = async (
  { page, browserName }: { page: Page; browserName: string },
  use: (page: Page) => Promise<void>,
  testInfo: TestInfo
) => {
  if (!page.coverage) throw new Error(`Could not collect coverage with …

我目前有一个包含超过 50 个文件的测试包。其中 49 个文件将使用相同的身份验证，因此我在我的剧作家配置文件中设置了以下内容：

                storageState: 'myauth.json',

这允许我存储状态并在所有测试中使用它，问题是我不想在我的一个测试中使用此状态。人们会怎样做呢？

我知道我可以将状态传递到 49 个文件中，而忽略其中一个文件，但这似乎是错误的想法。

我有一个 Ionic React 应用程序，它使用react-router5 显示各个页面。

该应用程序默认为登录表单，但如果用户转到支持页面，则会有一个联系表单。

我正在尝试使用如下代码测试 Playwright 中的联系表单：

  await page.fill('input[name=mail]', 'playwright@example.com');\n

但是，我收到错误：

=========================== logs ===========================\nwaiting for selector "input[name=mail]"\n  selector resolved to 2 elements. Proceeding with the first one.\n  selector resolved to hidden <input name="mail" type="email" placeholder="" autocorr\xe2\x80\xa6/>\nelementHandle.fill("playwright@example.com")\n  waiting for element to be visible, enabled and editable\n    element is not visible - waiting...\n

问题在于，Playwright 看到登录表单上输入的第一个电子邮件地址（该地址不可见），然后尝试填写该地址，而不是联系页面上输入的可见电子邮件地址。

显然，我从来不想填充不可见的元素，那么我如何强制剧作家只尝试填充可见元素呢？

我尝试了这一切，

page.on("console", lambda msg: print(f"error: {msg.text}") if msg.type == "error" else None)
page.on("console", lambda msg: print(msg.text))
page.on("pageerror", lambda exc: print(f"uncaught exception: {exc}"))

没有任何作用

端子输出

python main.py 
/home/xxx/.local/lib/python3.9/site-packages/trio/_core/_multierror.py:511: RuntimeWarning: You seem to already have a custom sys.excepthook handler installed. I'll skip installing Trio's custom handler, but this means MultiErrors will not show full tracebacks.
  warnings.warn(

我正在尝试做什么

测试需要剧作家访问麦克风的网站

问题

有问题的弹出窗口出现，并且似乎忽略了所谓的授予的权限。可以手动授予权限，但这似乎违背了自动化的精神。

我尝试过的

with sync_playwright() as p:

    browser = p.chromium.launch(headless=False)
    context = browser.new_context(permissions=['microphone'])
...

由于某种原因，通过上下文授予权限不起作用。权限弹出窗口仍然出现。

我还尝试使用剧作家录制脚本录制演练，但它没有录制授予麦克风权限。

我正在使用 playwright 来测试 PWA（渐进式 Web 应用程序），并且我想测试离线行为。

browserContext 有一个setOffline方法。

当调用 playwright 作为库时，我可以browserContext这样设置：

// example.js
const playwright = require('playwright');

(async () => {
  const browser = await playwright.chromium.launch({
    channel: 'msedge',
  });
  const context = await browser.newContext();
  const page = await context.newPage();
  await page.goto('https://www.microsoft.com/edge');
  await context.setOffline(true);
  await page.screenshot({ path: 'example.png' });

  await browser.close();
})();

但对于我的 PWA，我使用的是捆绑的剧作家测试运行程序。

我已将测试运行器配置为使用 5 种设备：桌面 Chrome、Firefox 和 Webkit，以及移动 Webkit 和移动 Chrome。我想在测试中进入和退出所有模式的离线模式，以确认我的 PWA 的行为。

如何browserContext在测试运行器中设置？测试中似乎不可用。