feat: Adds test id to flashbar dom selector

[orangevolon]

Description

Adds testId prop to flash items inside the flashbar component.

Related links, issue #, if available:

Collective PR: #2985
Project: Improving test utils API

How has this been tested?

Tests added to cover the change.

Review checklist

The following items are to be evaluated by the author(s) and the reviewer(s).

Correctness

• Changes include appropriate documentation updates.
• Changes are backward-compatible if not indicated, see CONTRIBUTING.md.
• Changes do not include unsupported browser features, see CONTRIBUTING.md.
• Changes were manually tested for accessibility, see accessibility guidelines.

Security

• If the code handles URLs: all URLs are validated through the checkSafeUrl function.

Testing

• Changes are covered with new/existing unit tests?
• Changes are covered with new/existing integration tests?

---

By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.

[orangevolon]

This is residual snapshot change from #2855.

Since we are merging to the project branch feat/test-utils-project-m2 rather than main, this wasn't caught by the Github checks.

You can ignore this one.

[orangevolon]

There's a bit of an inconsistency when it comes to FlashWrapper.

FlashWrapper should point to the list item and not the flash component itself:

components/src/test-utils/dom/flashbar/flash.ts

Line 10 in 672e7f8

static rootSelector: string = styles['flash-list-item'];

But the existing findFlashByType returns the flash rather than the parent <li />:

components/src/test-utils/dom/flashbar/index.ts

Line 29 in 672e7f8

return this.findAll(`.${styles['flash-list-item']} .${styles[`flash-type-${type}`]}`).map(

To make sure than this mistake doesn't happen with testId I omitted that from the FlashProps so that it is not assigned by mistake in the future.

[gethinwebster]

Existing similar places use escapeSelector from test-utils (https://github.com/cloudscape-design/test-utils/blob/f49a5a90ce077253f74d82659f1cb6e83092a2a4/src/core/utils.ts#L7), which ensures that this is polyfilled. Might be good to use that here too for consistency

[orangevolon]

Good point! Replaced it. Also replaced one more occurrence that was using CSS.escape from before!