使用 Playwright，page.url() 获取的是以前的 url 而不是当前的 url答案

【问题标题】：Using Playwright, page.url() is getting a previous url instead of the current url使用 Playwright，page.url() 获取的是以前的 url 而不是当前的 url
【发布时间】：2021-09-29 22:36:43
【问题描述】：

我正在使用expect(page.url()).toContain('/nav'); 测试我们网站上的导航。浏览代码时，我可以清楚地看到我们在点击后点击了那个 url 字符串。

我已经尝试将我的代码放入和排除相同错误的承诺：

Expected substring: "/nav"
Received string:    "https://website.com/about"

      283 |     page.waitForNavigation();
      284 |     await page.hover('nav >> text=Nav');
      285 |     await page.click('nav >> text=Nav');
      286 |     console.log(page.url());
    > 287 |     expect(page.url()).toContain('/nav');
          |                        ^
      288 |
      289 |     page.click('text=Next Nav')
      290 |     expect(page.url()).toContain('/nextNav');

链接本身是一个简单的<a href="/nav" class="list__item__link" data-v-0df6efc8>Nav</a>。

控制台日志显示https://website.com/about。

这是一个与 cmets 相关的 sn-p：

////##OURSTORY##////
    page.hover('nav >> text=Our Story');
    page.waitForNavigation();
    await page.click('nav >> text=About');
    expect(page.url()).toContain('story');

    //await page.pause();

    await page.hover('nav >> text=Our Story');
    await page.hover('nav >> text=360° Wellness');
    await page.click('nav >> text=360° Wellness'); 
    console.log(page.url());
    await page.waitForNavigation();
    expect(page.url()).toContain('/360-wellness');

【问题讨论】：

你试过把url转换成字符串吗？
如果url() 已经返回一个字符串，那么page.url() 之前缺少的await 可能会解决它吗？请让我们知道这是否有效。
我在page.url() 之前添加了一个await 并没有帮助。我的 IDE 甚至说不需要。 page.url() 已经将其转换为字符串，这是一个内置功能。
我明白了。而且您肯定该网址实际上包含/nav 文本？你用headless: false测试过这个吗？
是的，我可以确认。当使用await page.pause() 并单步执行代码时，我可以在url 中明显看到/nav，然后得到上面的错误。而且我总是在headless: false 中运行我的测试。

标签： automation playwright

【解决方案1】：

好的，所以我从一开始就对使用page.waitForNavigation() 有点谨慎，所以我再次考虑是否需要在这里使用它。事实证明，我们真的不需要它。考虑到加载时间的变化，我添加了一个 waitForSelector()，它应该允许它 30 秒（或者您可以使用 setTimeout 来设置自定义等待时间）。

另外，这里有一点关于 waitForNavigation() 方法的信息 -

page.waitForNavigation() 返回一个仅在导航完成后才解析的承诺。文档提到 -

如果导航到不同的锚点或导航由于 History API 用法，导航将解析为null。

由于网站开发方法可能不明确，最好避免使用上述功能。特别是因为它还声明 -

当您运行会间接导致页面导航

...老实说，我并不清楚它的用例。

无论如何，这是有效的；完整的test.spec.ts 文件 -

import { Page } from "playwright-core";

describe("Test Suite for a patient random guy on Stack Overflow", () => {
  it("Test Gen: [URL Text] Testing the correct URL path", async () => {
    let page: Page;
    page = await context.newPage();
    await page.goto("https://ariix.newage.com");
    page.hover("nav >> text=Our Story");
    await page.waitForSelector("nav >> text=About");
    await page.click("nav >> text=About");
    console.log(page.url());
    expect(page.url()).toContain("story");
    //await page.pause();
    await page.hover("nav >> text=Our Story");
    await page.waitForSelector("nav >> text=360° Wellness");
    await page.click("nav >> text=360° Wellness");
    console.log(page.url());
    expect(page.url()).toContain("/360-wellness");
  });
});

它似乎在做/打印你的目标 -

希望这最终解决了这个问题。让我们知道:)

【讨论】：