feat: Add findItemById test-util to FlashbarWrapper

Author: Johannes Weber

src/__tests__/snapshot-tests/__snapshots__/documenter.test.ts.snap

@@ -37439,6 +37439,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.
 
@@ -47270,6 +47289,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.
 

src/flashbar/__tests__/collapsible.test.tsx

@@ -620,6 +620,25 @@ 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();
+  });
 });
 
 // Entire interactive element including the counter and the actual <button/> element

src/flashbar/__tests__/flashbar.test.tsx

@@ -445,6 +445,21 @@ describe('Flashbar component', () => {
     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')!.findContent()!.getElement()).toHaveTextContent('Flash 1');
+    expect(wrapper.findItemById('flash-2')!.findContent()!.getElement()).toHaveTextContent('Flash 2');
+    expect(wrapper.findItemById('flash-3')).toBeNull();
+  });
+
   describe('rapid item replacement with animations', () => {
     beforeEach(() => {
       jest.useFakeTimers();

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.
    *