Components: Fix no-node-access violations in Popover

[tyxla]

What?

With the recent work to improve the quality of tests, we fixed a bunch of ESLint rule violations. This PR fixes a no-node-access rule violation in the Popover component.

Why?

The end goal is to enable that ESLint rule once all violations have been fixed.

How?

We're using a screen query instead of element.parentElement. For this purpose, we add a data-testid to the Popover element.

Testing Instructions

Verify all tests still pass.

[mirka]

Nit: I wonder if something like <Popover role="dialog"> (and then query by role) is a more realistic spec of what needs to happen. In a sense, for this "focus on mount" feature to be at all useful, three things need to be true:

• A role can be applied
• The element with that role is an ancestor of the popover content
• The element with that role is going to be focused

expect( screen.getByTestId( 'popover-element' ) ).toHaveFocus() kind of circumvents the assertion of the relationship between the popover content and the focused element.

[tyxla]

@mirka from my understanding, we can do that, but for someone looking at the test later it could create a false assumption that the Popover always has the dialog role, which isn't always the case. By using data-testid in the test fixture, we're clear enough that this is just for the means of the test.