From 116c6e3e0ffeaf9e427303197d5fbe0deffdcbdc Mon Sep 17 00:00:00 2001
From: Johannes Weber <jowejowe@amazon.com>
Date: Fri, 20 Mar 2026 16:15:06 +0100
Subject: [PATCH] feat: Add findItemById test-util to FlashbarWrapper

---
 .../__snapshots__/documenter.test.ts.snap     | 38 +++++++++++++++++++
 .../__integ__/find-item-by-id.test.ts         | 24 ++++++++++++
 src/flashbar/__tests__/collapsible.test.tsx   | 20 ++++++++++
 src/flashbar/__tests__/flashbar.test.tsx      | 18 +++++++++
 src/test-utils/dom/flashbar/index.ts          | 10 +++++
 5 files changed, 110 insertions(+)
 create mode 100644 src/flashbar/__integ__/find-item-by-id.test.ts

diff --git a/src/__tests__/snapshot-tests/__snapshots__/documenter.test.ts.snap b/src/__tests__/snapshot-tests/__snapshots__/documenter.test.ts.snap
index 82ee041bc7..ab6d70ccc8 100644
--- a/src/__tests__/snapshot-tests/__snapshots__/documenter.test.ts.snap
+++ b/src/__tests__/snapshot-tests/__snapshots__/documenter.test.ts.snap
@@ -37453,6 +37453,25 @@ wrapper.selectOptionByValue('option_1');
     },
     {
       "methods": [
+        {
+          "description": "Returns a flash item by its id.
+
+The id is matched against the \`id\` property of each item passed to the \`items\` property of the Flashbar component.",
+          "name": "findItemById",
+          "parameters": [
+            {
+              "flags": {
+                "isOptional": false,
+              },
+              "name": "id",
+              "typeName": "string",
+            },
+          ],
+          "returnType": {
+            "isNullable": true,
+            "name": "FlashWrapper",
+          },
+        },
         {
           "description": "Returns the individual flashes of this flashbar.
 
@@ -47284,6 +47303,25 @@ The mode selector is only rendered as a Select on narrow viewports. On wide view
     },
     {
       "methods": [
+        {
+          "description": "Returns a flash item by its id.
+
+The id is matched against the \`id\` property of each item passed to the \`items\` property of the Flashbar component.",
+          "name": "findItemById",
+          "parameters": [
+            {
+              "flags": {
+                "isOptional": false,
+              },
+              "name": "id",
+              "typeName": "string",
+            },
+          ],
+          "returnType": {
+            "isNullable": true,
+            "name": "FlashWrapper",
+          },
+        },
         {
           "description": "Returns the individual flashes of this flashbar.
 
diff --git a/src/flashbar/__integ__/find-item-by-id.test.ts b/src/flashbar/__integ__/find-item-by-id.test.ts
new file mode 100644
index 0000000000..7c9e6fba8d
--- /dev/null
+++ b/src/flashbar/__integ__/find-item-by-id.test.ts
@@ -0,0 +1,24 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import createWrapper from '../../../lib/components/test-utils/selectors';
+import { setupTest } from './pages/interactive-page';
+
+const flashbar = createWrapper().findFlashbar();
+
+describe('findItemById', () => {
+  test(
+    'finds a flash item by its id',
+    setupTest(async page => {
+      const item = flashbar.findItemById('0');
+      await expect(page.isExisting(item!.toSelector())).resolves.toBe(true);
+    })
+  );
+
+  test(
+    'returns null for non-existent id',
+    setupTest(async page => {
+      const item = flashbar.findItemById('nonexistent');
+      await expect(page.isExisting(item!.toSelector())).resolves.toBe(false);
+    })
+  );
+});
diff --git a/src/flashbar/__tests__/collapsible.test.tsx b/src/flashbar/__tests__/collapsible.test.tsx
index a6fb5f6372..515921a596 100644
--- a/src/flashbar/__tests__/collapsible.test.tsx
+++ b/src/flashbar/__tests__/collapsible.test.tsx
@@ -620,6 +620,26 @@ describe('Collapsible Flashbar', () => {
     disableMotion(true);
     testFlashDismissal({ stackItems: true });
   });
+
+  test('findItemById', () => {
+    const wrapper = createFlashbarWrapper(
+      <Flashbar
+        stackItems={true}
+        items={[
+          { content: 'Flash 1', id: 'flash-1', type: 'success' },
+          { content: 'Flash 2', id: 'flash-2', type: 'error' },
+        ]}
+      />
+    );
+    expect(wrapper.findItemById('flash-1')).not.toBeNull();
+    expect(wrapper.findItemById('flash-2')).toBeNull();
+
+    findNotificationBar(wrapper)!.click();
+
+    expect(wrapper.findItemById('flash-1')).not.toBeNull();
+    expect(wrapper.findItemById('flash-2')).not.toBeNull();
+    expect(wrapper.findItemById('nonexistent')).toBeNull();
+  });
 });
 
 // Entire interactive element including the counter and the actual <button/> element
diff --git a/src/flashbar/__tests__/flashbar.test.tsx b/src/flashbar/__tests__/flashbar.test.tsx
index 0d73331de4..7bf6fcc95d 100644
--- a/src/flashbar/__tests__/flashbar.test.tsx
+++ b/src/flashbar/__tests__/flashbar.test.tsx
@@ -443,4 +443,22 @@ describe('Flashbar component', () => {
     setAnimations(false);
     testFlashDismissal({ stackItems: false });
   });
+
+  test('findItemById', () => {
+    const wrapper = createFlashbarWrapper(
+      <Flashbar
+        items={[
+          { content: 'Flash 1', id: 'flash-1', type: 'success' },
+          { content: 'Flash 2', id: 'flash-2', type: 'error' },
+          { content: 'Flash 3', type: 'warning' },
+        ]}
+      />
+    );
+    expect(wrapper.findItemById('flash-1')).not.toBeNull();
+    expect(wrapper.findItemById('flash-1')!.findContent()!.getElement()).toHaveTextContent('Flash 1');
+    expect(wrapper.findItemById('flash-2')).not.toBeNull();
+    expect(wrapper.findItemById('flash-2')!.findContent()!.getElement()).toHaveTextContent('Flash 2');
+    expect(wrapper.findItemById('nonexistent')).toBeNull();
+    expect(wrapper.findItemById('flash-3')).toBeNull();
+  });
 });
diff --git a/src/test-utils/dom/flashbar/index.ts b/src/test-utils/dom/flashbar/index.ts
index dda96af880..04b9e242b8 100644
--- a/src/test-utils/dom/flashbar/index.ts
+++ b/src/test-utils/dom/flashbar/index.ts
@@ -18,6 +18,16 @@ export default class FlashbarWrapper extends ComponentWrapper {
     return this.findAllByClassName(styles['flash-list-item']).map(item => new FlashWrapper(item.getElement()));
   }
 
+  /**
+   * Returns a flash item by its id.
+   *
+   * The id is matched against the `id` property of each item passed to the `items` property of the Flashbar component.
+   */
+  findItemById(id: string): FlashWrapper | null {
+    const element = this.find(`[data-itemid="${CSS.escape(id)}"]`);
+    return element ? new FlashWrapper(element.getElement()) : null;
+  }
+
   /**
    * Returns the individual flashes of this flashbar given the item type.
    *