test(ui-client): clear up runtime warnings (#40772)

Author: tassoevan

packages/ui-client/src/components/InfoPanel/InfoPanelLabel.tsx

@@ -6,7 +6,7 @@ type InfoPanelLabelProps = ComponentPropsWithoutRef<typeof Box>;
 const InfoPanelLabel = ({ title, children, ...props }: InfoPanelLabelProps) => (
 	<Box mb={8} fontScale='p2m' color='default' {...props}>
 		{children}
-		{title && <Icon name='info' color='font-secondary-info' mi={4} size='x16' title={title} />}
+		{title && <Icon name='info' color='secondary-info' mi={4} size='x16' title={title} />}
 	</Box>
 );
 

packages/ui-client/src/components/Modal/GenericModal/GenericModal.spec.tsx

@@ -1,3 +1,4 @@
+import { mockAppRoot } from '@rocket.chat/mock-providers';
 import { useSetModal } from '@rocket.chat/ui-contexts';
 import { act, screen, renderHook } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
@@ -12,11 +13,13 @@ const renderModal = (modalElement: ReactElement) => {
 	const {
 		result: { current: setModal },
 	} = renderHook(() => useSetModal(), {
-		wrapper: ({ children }) => (
-			<Suspense fallback={null}>
-				<ModalProviderWithRegion>{children}</ModalProviderWithRegion>
-			</Suspense>
-		),
+		wrapper: mockAppRoot()
+			.wrap((children) => (
+				<Suspense fallback={null}>
+					<ModalProviderWithRegion>{children}</ModalProviderWithRegion>
+				</Suspense>
+			))
+			.build(),
 	});
 
 	act(() => {

packages/ui-client/src/components/Wizard/Wizard.spec.tsx

@@ -1,3 +1,4 @@
+import { mockAppRoot } from '@rocket.chat/mock-providers';
 import { composeStories } from '@storybook/react';
 import { render } from '@testing-library/react';
 import { axe } from 'jest-axe';
@@ -7,12 +8,16 @@ import * as stories from './Wizard.stories';
 const testCases = Object.values(composeStories(stories)).map((Story) => [Story.storyName || 'Story', Story]);
 
 test.each(testCases)(`renders %s without crashing`, async (_storyname, Story) => {
-	const { baseElement } = render(<Story />);
+	const { baseElement } = render(<Story />, {
+		wrapper: mockAppRoot().build(),
+	});
 	expect(baseElement).toMatchSnapshot();
 });
 
 test.each(testCases)('%s should have no a11y violations', async (_storyname, Story) => {
-	const { container } = render(<Story />);
+	const { container } = render(<Story />, {
+		wrapper: mockAppRoot().build(),
+	});
 
 	const results = await axe(container);
 	expect(results).toHaveNoViolations();

packages/ui-client/src/components/Wizard/WizardActions.spec.tsx

@@ -1,3 +1,4 @@
+import { mockAppRoot } from '@rocket.chat/mock-providers';
 import { composeStories } from '@storybook/react';
 import { render } from '@testing-library/react';
 import { axe } from 'jest-axe';
@@ -7,12 +8,12 @@ import * as stories from './WizardActions.stories';
 const testCases = Object.values(composeStories(stories)).map((Story) => [Story.storyName || 'Story', Story]);
 
 test.each(testCases)(`renders %s without crashing`, async (_storyname, Story) => {
-	const tree = render(<Story />);
-	expect(tree.baseElement).toMatchSnapshot();
+	const view = render(<Story />, { wrapper: mockAppRoot().build() });
+	expect(view.baseElement).toMatchSnapshot();
 });
 
 test.each(testCases)('%s should have no a11y violations', async (_storyname, Story) => {
-	const { container } = render(<Story />);
+	const { container } = render(<Story />, { wrapper: mockAppRoot().build() });
 
 	const results = await axe(container);
 	expect(results).toHaveNoViolations();

packages/ui-client/src/providers/ModalProvider/ModalProvider.spec.tsx

@@ -1,3 +1,4 @@
+import { mockAppRoot } from '@rocket.chat/mock-providers';
 import { useSetModal } from '@rocket.chat/ui-contexts';
 import { act, render, screen } from '@testing-library/react';
 import type { ForwardedRef, ReactElement } from 'react';
@@ -11,7 +12,9 @@ import { imperativeModal } from '../../helpers/imperativeModal';
 
 const renderWithSuspense = (ui: ReactElement) =>
 	render(ui, {
-		wrapper: ({ children }) => <Suspense fallback={null}>{children}</Suspense>,
+		wrapper: mockAppRoot()
+			.wrap((children) => <Suspense fallback={null}>{children}</Suspense>)
+			.build(),
 	});
 
 describe('via useSetModal', () => {