Property 'getAllByRole' does not exist on type 'Screen'. TS2339-CodePudding

I'm working on a web application in which frontend is built using ReactJs. When I run the code, I'm getting this error as mentioned.

 TypeScript error in H:/IdeaProjects/my_project/src/unitTestUtils.tsx(79,27):
[frontend] Property 'getAllByRole' does not exist on type 'Screen'.  TS2339
[frontend]
[frontend]     77 |
[frontend]     78 | export const agGridHelper = (scope: Screen): GridHelper => {
[frontend]   > 79 |   const rowGroups = scope.getAllByRole("rowgroup");
[frontend]        |                           ^
[frontend]     80 |   const columnHeaders = within(rowGroups[0]).getAllByRole("columnheader").map(header => header.textContent?.trim() ?? "");
[frontend]     81 |   const dataCells: HTMLElement[][] = within(rowGroups[rowGroups.length - 1])
[frontend]     82 |     .getAllByRole("row")

When I suppress the error with // @ts-ignore, everything is working fine. Please tell me how to get resolve this error.

CodePudding user response：

Make sure that you are using Screen type form @testing-library/react. There is a Screen type in lib.dom.d.ts and it is resolved by tsconfig