我正在try Select 一个依赖于输入邮政编码的邮箱选项.下面是我做的

 const postcode = page.locator("#postalCode");
  const findAddress = page.getByText("Find address", {exact: true});
  const selectAddress = page.locator("#addressSelection");

 await postcode.fill("GU22 7SS");
  await findAddress.click();
  await selectAddress.selectOption("37 The Rowans");

我使用的URL是:https://app.pws.int.cruk.org/support-us/details

我试图明确地告诉编剧要 Select 哪个选项,但它超时并显示以下错误:

  Error: locator.selectOption: Target closed
    =========================== logs ===========================
    waiting for locator('#addressSelection')
      locator resolved to <select aria-invalid="false" id="addressSelection" name=…>…</select>
      selecting specified option(s)
        did not find some options - waiting... 
    ============================================================

      48 |   await postcode.fill("GU22 7SS");
      49 |   await findAddress.click();
    > 50 |   await selectAddress.selectOption("37 The Rowans");
         |                       ^
      51 |
      52 |
      53 |

有人能帮帮我吗?

推荐答案

对于此选项:

<option value="GB|RM|A|10271328" data-option="Address">37 The Rowans, Woking, GU22 7SS</option>

try 在selectOption参数中使用准确的标签:

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

test("User can make a donation", async ({page}) => {
  const url = "<Your URL>";
  await page.goto(url, {waitUntil: "domcontentloaded"});

  const postcode = page.locator("#postalCode");
  const findAddress = page.getByText("Find address", {exact: true});
  const selectAddress = page.locator("#addressSelection");

  await postcode.fill("GU22 7SS");
  await findAddress.click();
  await selectAddress.selectOption("37 The Rowans, Woking, GU22 7SS");
});

或者使用正则表达式:

await selectAddress.selectOption(/\b37 The Rowans\b/);

或者使用value="GB|RM|A|10271328":

await selectAddress.selectOption("GB|RM|A|10271328");

请注意, Select 选项后,<select>将消失,代之以一组<input>个元素,这些元素使用您 Select 的选项的一部分来填充地址行1、城镇/城市和国家/地区字段.地址行1自动填充37 The Rowans,这就是您要传递给selectOption的内容.这可能是造成一些混乱的原因.

Typescript相关问答推荐

我应该使用什么类型的React表单onsubmit事件?

我用相同的Redux—Toolkit查询同时呈现两个不同的组件,但使用不同的参数

在使用Typescribe时,是否有一种方法可以推断映射类型的键?

具有动态键的泛型类型

为什么不能使用$EVENT接收字符串数组?

错误TS2403:后续变量声明必须具有相同的类型.变量';CRYPTO';的类型必须是';CRYPATO';,但这里的类型是';CRYPATO';

使用Redux Saga操作通道对操作进行排序不起作用

使用条件类型的类型保护

使用泛型识别对象值类型

有没有办法在Zod中使用跨字段验证来判断其他字段,然后呈现条件

在TypeScript中扩展重载方法时出现问题

自动通用回调

如何避免从引用<;字符串&>到引用<;字符串|未定义&>;的不安全赋值?

在抽象类属性定义中扩展泛型类型

如何在本地存储中声明该类型?

打字脚本错误:`不扩展[Type]`,而不是直接使用`[Type]`

内联类型断言的工作原理类似于TypeScrip中的断言函数?

Typescript泛型验证指定了keyof的所有键

定义一个只允许来自另一个类型的特定字符串文字的类型的最佳方式

使用 TypeScript 在 SolidJS 中绘制 D3 力图