chore(tests): Migrate from Enzyme to RTL (1st batch)

[loonskai]

Description

Tests with Enzyme migrated: 23/61

This PR is a part of Box-wide migration to the newer React v18.

• The most of the scenarios were rewritten with consideration of RTL practices (thanks @nmkedziora for pointing this out). Some components required fireEvent executed on top of specific selectors instead of recommended userEvent. Some of these tradeoffs could be avoided (possibly) but would extend the timelines of this PR. I suggest improve these test iteratively as we work on them.
• Semantic selectors were used in most cases. data-testid attributes were added mostly for container elements to quickly validate if container is rendered.
• This PR doesn't introduce any runtime changes (except data-testid changes mentioned above)

This PR will be followed with the next steps:

• Rewrite the rest of test scenarios from Enzyme to RTL and cleanup Enzyme-related setup (dependencies, adapter etc.)
• Add eslint-plugin-testing-library and eslint-plugin-jest-dom as ESLint rules

Screenshots

[rafalmaksymiuk]

This is a massive PR - tremendous work but hard to review. I know it is difficult to push each PR separately, but is way easier to meaningfully review so maybe split more next time :)?

Another thought - or rather question. I do know that EUA uses special tooling based on RTL. Don't remember details, but it integrates Redux somehow. Do you know why it was needed there and if it might be here?

[nmkedziora]

This is a massive PR - tremendous work but hard to review. I know it is difficult to push each PR separately, but is way easier to meaningfully review so maybe split more next time :)?

+1 for me.
Amazing job and great effort 🎉

Splitting the PR by feature or folder would make a significant difference. It would not only make it easier to review but also easier for you to work on the changes (in terms of time and capacity) and quicker to merge bit by bit instead of blocking the merge for the entire PR due to comments on a single file.

[nmkedziora]

Nit: you could do screen.getAllByRole('button') only once:

Suggested change

	expect(screen.getAllByRole('button').at(1).textContent).toContain('test');
	const buttons = screen.getAllByRole('button')
	expect(buttons.at(1).textContent).toContain('test');