如何使用剧作家期望来精确匹配两个可能值之一？

Question

如何使用剧作家expect来检查两个精确匹配之一？

这是我的功能。

export const assertThirdPartyInternetPath = async (
  page: Page,
  path: string,
) => {
  expect(page.url()).toBe(path);
};

我用它来测试维基百科页面的链接。

await this.assertThirdPartyInternetPath('https://en.wikipedia.org/wiki/Larry_Sanger'

但是，维基百科等一些网站会将移动设备（包括剧作家设备）重定向到子m域。

所以我想断言用户位于https://en.wikipedia.org/wiki/Larry_Sanger或https://en.m.wikipedia.org/wiki/Larry_Sanger。我怎样才能做到这一点？

请注意，我想要进行精确匹配；我知道我可以使用expect(string.toContain(myPattern)，但我有很多东西要匹配，我想做精确匹配。

Answer 1

可以按照 Jest 匹配器中的建议反转比较以匹配三个值中的任何一个，但这会使断言消息和整体流程有点尴尬。

expect([
  "https://en.wikipedia.org/wiki/Larry_Sanger",
  "https://en.m.wikipedia.org/wiki/Larry_Sanger",
]).toContain(page.url());

我更喜欢使用正则表达式，因为它使断言保持正常方向：

expect(page.url())
  .toMatch(/^https:\/\/en\.(?:m\.)?wikipedia\.org\/wiki\/Larry_Sanger$/);

问题在于可读性和记住转义正则表达式字符并添加锚点。您可以使用普通字符串并使用一些额外的实用程序代码对其进行转义。

另一种选择是编写自定义匹配器：

import {expect, test} from "@playwright/test"; // ^1.39.0

expect.extend({
  async toBeAnyOf(received, ...possibilities) {
    if (possibilities.includes(received)) {
      return {
        message: () => "passed",
        pass: true,
      };
    }

    return {
      message: () =>
        `failed: '${received}' was not any of ${possibilities}`,
      pass: false,
    };
  },
});

test("is on the normal site", async ({page}) => {
  await page.goto("https://en.wikipedia.org/wiki/Larry_Sanger");
  expect(page.url()).toBeAnyOf(
    "https://en.wikipedia.org/wiki/Larry_Sanger",
    "https://en.m.wikipedia.org/wiki/Larry_Sanger",
  );
});

test("is on the mobile site", async ({page}) => {
  await page.goto("https://en.m.wikipedia.org/wiki/Larry_Sanger");
  expect(page.url()).toBeAnyOf(
    "https://en.wikipedia.org/wiki/Larry_Sanger",
    "https://en.m.wikipedia.org/wiki/Larry_Sanger",
  );
});

如果您需要自动等待，正则表达式将在以下情况下工作toHaveURL：

await expect(page).toHaveURL(
  /^https:\/\/en\.(?:m\.)?wikipedia\.org\/wiki\/Larry_Sanger$/
);

Promise.race()也是可以的。这避免了正则表达式，并且非常容易阅读，但缺点是有点冗长：

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

test("navigate to one of two URLs", async ({page}) => {
  const url = "https://en.wikipedia.org/wiki/Larry_Sanger";
  const mobile = "https://en.m.wikipedia.org/wiki/Larry_Sanger";
  await page.goto(Math.random() >= 0.5 ? url : mobile);
  await Promise.race([
    expect(page).toHaveURL(url),
    expect(page).toHaveURL(mobile),
  ]);
});