React Testing Library - "messageParent" can only be used inside a worker

Question

I'm testinng a react component using the RTL, and everytime I ran a test, I get,

"messageParent" can only be used inside a worker

**Here's the code

describe('Header', () => {
  it('validates header component is rendered', () => {
    const { getByTestId } = render(<Header patientName="Jake Bland" />);
    expect(getByTestId('patient-name')).toHaveTextContent(/^Jake Bland$/);
    expect(getByTestId('dateRange')).toBe(dateRange);
  });
});

Any help on this will be greatly appreciated.

Answer 1

I was having the same issue, and it was caused by calling toBe() or toEqual() on an HTMLElement. So your most likely culprit is here, since getByTestId returns an HTMLElement:

expect(getByTestId('dateRange')).toBe(dateRange);

I fixed my issue by testing against the element's text content instead.

expect(getByTestId('dateRange')).toHaveTextContent('...');

Answer 2

Hi I had the same issue after spending some time googling around i found this: github issues forum

it turned out that this issue is caused by node12 version i downgraded my one to version 10 and everything worked i have also upgraded to version 14 and that also works.

check what is yours node version in ur terminal:

1. node -v if (version 12) upgrade it!
2. nvm install v14.8.0 (something like this or the leates one)
3. nvm use v14.8.0 (or any other version you may wish to install that is above 12)

hopefully this helps

Answer 3

I had the same bug but I was able to fix it by importing '@testing-library/jest-dom' as follows in my test file:

import '@testing-library/jest-dom'

It turned out that the package above is a peerDependency for '@testing-library/react'. Thus the error.

Answer 4

I ran into this error while testing to see if a <select> had the right number of options, when using this:

expect(container.querySelectorAll('option')).toBe(2);

@testing-library/react must be trying to do something strange to get the length of the HTML collection, I have. So I added .length to the query:

expect(container.querySelectorAll('option').length).toBe(2);

All was well.