React Testing Library unable to find text even though screen.debug() shows the text to exist

Question

In a nutshell, if I grab a portion of the screen by it's label:

const foo = screen.getByLabelText('Some Label');

I can see that the element I'm interested in exists in the output:

debug(foo);
...
<div
  class=" css-15zcpdi-NoOptionsMessage"
>
   Something went wrong
</div>

However if I search for "Something went wrong" in the screen:

screen.getByText('Something went wrong');

RTL claims it can't find it:

TestingLibraryElementError: Unable to find an element with the text: Something went wrong. ...

I must be doing something wrong here.. What?

Answer 1

Using exact string values does not seem to work very consistently. Try a regular expression instead:

screen.getByText(/Something went wrong/);