[Bug]: getByRole accessible name matching normalizes whitespace but expect toHaveAccessibleName does not

[WestonThayer]

Version

1.48.1

Steps to reproduce

Given the following test:

test("non-breaking space bug", async ({ page }) => {
  await page.setContent(`<button>foo&nbsp;bar</button>`);
  await expect(page.getByRole("button", { name: "foo bar" })).toBeVisible();
  await expect(
    page.getByRole("button", { name: "foo bar" }),
  ).toHaveAccessibleName("foo bar");
});

Expected behavior

I expect the test to pass.

Actual behavior

The test failed at expect.toHaveAccessibleName because:

Error: Timed out 5000ms waiting for expect(locator).toHaveAccessibleName(expected)

Locator: getByRole('button', { name: 'foo bar' })
Expected string: "foo bar"
Received string: "foo bar"

If you have console colors, there is a helpful highlight on the whitespace difference:

The HTML report doesn't have this feature.

Additional context

No response

Environment

System:
    OS: macOS 15.1
    CPU: (10) arm64 Apple M1 Pro
    Memory: 91.28 MB / 16.00 GB
  Binaries:
    Node: 20.17.0 - /opt/homebrew/opt/node@20/bin/node
    npm: 10.8.2 - /opt/homebrew/opt/node@20/bin/npm
  IDEs:
    VSCode: 1.94.0 - /usr/local/bin/code
  Languages:
    Bash: 3.2.57 - /bin/bash
  npmPackages:
    @playwright/test: ~1.48.1 => 1.48.1

[WestonThayer]

Potentially a duplicate of #23037.

[pavelfeldman]

HTML reporter was fixed to show where the diff is:

[WestonThayer]

Is that in 1.48.2? I just installed it, but not getting a highlight in the HTML report:

[pavelfeldman]

Is that in 1.48.2?

Nope, that's @playwright/test@next, 1.49 that will release later this week.

[WestonThayer]

Just verified, wonderful thank you. That helps mitigate this issue a bit.