fix: toolbar test

Author: georgylobko

src/app-layout/__tests__/toolbar.test.tsx

@@ -1,6 +1,7 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React from 'react';
+import { waitFor } from '@testing-library/react';
 
 import AppLayout from '../../../lib/components/app-layout';
 import SplitPanel from '../../../lib/components/split-panel';
@@ -16,14 +17,16 @@ describe('toolbar mode only features', () => {
       expect(wrapper.findToolbar()).toBeFalsy();
     });
 
-    test('renders toggle buttons when drawers are closed', () => {
+    test('renders toggle buttons when drawers are closed', async () => {
       const { wrapper } = renderComponent(
         <AppLayout navigationOpen={false} toolsOpen={false} onNavigationChange={noop} onToolsChange={noop} />
       );
       expect(wrapper.findActiveDrawer()).toBeNull();
       expect(wrapper.findToolbar()).toBeTruthy();
       expect(wrapper.findToolbar()!.getElement()).toContainElement(wrapper.findNavigationToggle()!.getElement());
-      expect(wrapper.findToolbar()!.getElement()).toContainElement(wrapper.findToolsToggle()!.getElement());
+      await waitFor(() => {
+        expect(wrapper.findToolbar()!.getElement()).toContainElement(wrapper.findToolsToggle()!.getElement());
+      });
     });
 
     test('renders navigation toggle button for open state', () => {
@@ -32,15 +35,17 @@ describe('toolbar mode only features', () => {
       expect(wrapper.findNavigationToggle()).toBeTruthy();
     });
 
-    test('renders toolbar with split panel trigger', () => {
+    test('renders toolbar with split panel trigger', async () => {
       const { wrapper } = renderComponent(
         <AppLayout splitPanel={<SplitPanel header="Testing">Dummy for testing</SplitPanel>} />
       );
       expect(wrapper.findToolbar()).toBeTruthy();
-      expect(wrapper.findToolbar()!.getElement()).toContainElement(wrapper.findSplitPanelOpenButton()!.getElement());
+      await waitFor(() => {
+        expect(wrapper.findToolbar()!.getElement()).toContainElement(wrapper.findSplitPanelOpenButton()!.getElement());
+      });
     });
 
-    test('renders toolbar with split panel trigger in active state', () => {
+    test('renders toolbar with split panel trigger in active state', async () => {
       const { wrapper } = renderComponent(
         <AppLayout
           splitPanelOpen={true}
@@ -49,7 +54,9 @@ describe('toolbar mode only features', () => {
         />
       );
       expect(wrapper.findToolbar()).toBeTruthy();
-      expect(wrapper.findToolbar()!.getElement()).toContainElement(wrapper.findSplitPanelOpenButton()!.getElement());
+      await waitFor(() => {
+        expect(wrapper.findToolbar()!.getElement()).toContainElement(wrapper.findSplitPanelOpenButton()!.getElement());
+      });
       expect(wrapper.findSplitPanelOpenButton()!.getElement()).toHaveAttribute('aria-expanded', 'true');
     });