标签: playwright-test

A 将多个测试文件放入扩展名为 spec.ts 的特定文件夹中，我如何使用 Playwright 运行特定文件。当前配置设置为测试文件夹并将运行其中的所有文件（测试）：

testDir: './smokeTests',

假设这是配置文件中的某个选项，但问题是哪个选项

我目前正在尝试使用 Expect 来进行断言const { expect } = require('@playwright/test');，但每次我都会收到错误：找不到模块“@playwright/test”。这是一个非常短的脚本，但有些问题。

const { chromium } = require("playwright");
const { expect } = require('@playwright/test');
const { matchers } = require('playwright-expect');
console.log("##########", expect)

// add custom matchers
expect.extend(matchers);

(async () => {
  const browser = await chromium.launch({
    headless: false,
  });
  const page = await browser.newPage();
  await page.goto("someurl");
  await page.fill("input[name='userLoginId']", 'nnn');
  await page.fill("input[name='password']", 'nnn');
  await page.click("button[type=submit]");
})();

包.json

{
  "name": "playwright",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "node ./index.js"
  },
  "keywords": …

在我的 Playwright 测试中，我根据文档设置了base-url ：

const config: PlaywrightTestConfig = {
  projects: [
    {
      name: 'Safari MacBook Air',
      use: {
        browserName: 'webkit',
        viewport: {
          width: 2560,
          height: 1620,
        },
        contextOptions: {
          ignoreHTTPSErrors: true,
        },
      },
    },
  ],
  use: {
    baseURL: process.env.PLATFORMSH_URL,
    headless: false,
    locale: 'ja-JP',

    // Debugging artifacts.
    screenshot: 'on',
    trace: 'on',
    video: 'on',
  },
};
export default config;

这适用于goto：

await this.page.goto('/myDirectory');

但是，它失败了expect：

  expect(page.url()).toBe('/myPage');

错误是：

Expected: "/myPage"
Received: "https://www.example.com/myPage"

Run Code Online (Sandbox Code Playgroud)

我该如何使用expectwith baseURL？

我一直在尝试学习剧作家，在实现过程中，我尝试编写一个测试用例，通过名称查找输入元素并用一些值填充它

不幸的是，该元素只有类和名称属性。我一直在尝试找到一种阅读它的方法，但没有在文档中找到任何内容，或者我可能错过了

请帮忙

// foo.ts
import { test as base } from "@playwright/test";

const test = base.extend<{foo: string}>({
    foo: "hello"
});

export { test };

// bar.ts
import { test as base } from "@playwright/test";

const test = base.extend<{bar: string}>({
    bar: "bye"
});

export { test };

// index.ts
import { test } from /* BOTH_FOO_AND_BAR??? */;

test("Basic test", async ({ foo, bar }) => { // <-- I want to be able to use both foo and bar fixture here
    console.log(foo);
    console.log(bar); …

我正在使用新的剧作家测试运行程序启动文本执行。不幸的是我无法让它以全屏模式启动。

我正在使用以下代码：

const { test, expect } = require('@playwright/test');
const { HomePage } = require('../lib/Homepages');
const playwright = require('@playwright/test');

test.describe('Home Test Suite', () => {
  let homePage;

  test.beforeAll(async () => {
    const browser = await playwright.chromium.launch({ args: ['--start-maximized'] });
    const context = await browser.newContext({ viewport: null });
    const page = await context.newPage();
    homePage = new HomePage(page);
    await homePage.loadapp();
  });

  test.afterAll(async ({ browser }) => {
    await browser.close();
  });

  test.describe('test1', () => {
    test('test', async () => {
      expect(await homepage.x()).toBeTruthy();
      // …

我需要使用 x-www-form-urlencoded 主体创建剧作家 API 请求：来自邮递员的示例： 工作邮递员请求示例

我正在尝试这样做：

  async getNewApiAccesToken({request})
    {
        const postResponse = await request.post("https://login.microsoftonline.com//token",{
            ignoreHTTPSErrors: true,
            FormData: {
                'client_id': 'xyz',
                'client_secret': 'xyz',
                'grant_type': 'client_credentials',
                'scope': 'api://xyz'
            }
        })
        console.log(await postResponse.json());
        return postResponse;

但它不起作用：/你能告诉我如何在剧作家中撰写这种请求吗？

我目前有一个包含超过 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 看到登录表单上输入的第一个电子邮件地址（该地址不可见），然后尝试填写该地址，而不是联系页面上输入的可见电子邮件地址。

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

我正在使用 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在测试运行器中设置？测试中似乎不可用。