Playwright带查询参数的路由Mock失败问题求助

问题原因 #

你使用的路由匹配模式*/**/city/*不符合目标路由的结构：

• 目标路由http://localhost:8080/city?zip=1234的路径是/city，没有后续子路径，而*会要求city后必须有额外路径内容，导致匹配失败。
• Playwright的page.route匹配规则基于URL的路径部分，查询参数不会参与匹配，所以不需要在模式里包含?zip=1234。

解决方案 #

方案1：匹配所有/city路径的请求（忽略查询参数） #

使用不带后缀的匹配模式，直接匹配/city路径：

await page.route('**/city', async route => {
  await route.fulfill({ status: 200, json: [] });
});

方案2：仅匹配带特定查询参数的/city请求 #

如果需要精准匹配zip=1234的请求，可以在回调中解析URL的查询参数进行判断：

await page.route('**/city', async route => {
  const requestUrl = new URL(route.request().url());
  // 判断是否包含目标查询参数
  if (requestUrl.searchParams.get('zip') === '1234') {
    await route.fulfill({ status: 200, json: [] });
  } else {
    // 非目标请求正常放行
    await route.continue();
  }
});

内容的提问来源于stack exchange，提问作者Xero