Using the suggested query by text breaks when the text includes parenthesis

[gndelia]

Bug Report 🐛

The "Suggested Query" box breaks when trying to load a getByText query if the text includes parenthesis (). I assume this are not being escaped in this scenario, but they are when showing the example in getByRole

To Reproduce ✔️

playground link

it's a simple HTML with the following content

<h1>some text (and note)</h1>

the (correct) suggested query is

screen.getByRole('heading', {
  name: /some text \(and note\)/i
})

The "suggested box" shows getByText as a clickable option. However, when I click it, I get

// sorry, I failed to provide something useful

and the suggestion box disappears

Expected behavior 🤔

It should show

screen.getByText(/some text \(and note\)/i)

in the query box (bottom left). If I type it manually it works, and it suggests the getByRole as before, and I can click it. Clicking again the getByText breaks

Suggested solution 🔦

Not sure, I'd have to dig the code 😅 I'd like to take this bug if possible. I guess other regex characters should be escaped as well

Your Environment 💻

• browser: Chrome 85
• os: Windows 10

[marcosvega91]

Hi @gndelia thanks for reaching us 😄 .

It was a problem with a previous version of @testing-library/dom. It'll be fixed when we'll release a new version of testing-playground.

The problem was that the regex were not escaped.

Stay tuned 👍

[marcosvega91]

A new version with the fix has been released ☺️