test(jest): add a test for Branding component

3 files changed, 33 insertions, 6 deletions

diff --git a/__tests__/jest/components/Branding.test.tsx b/__tests__/jest/components/Branding.test.tsx
new file mode 100644
index 0000000..ae759a3
--- /dev/null
+++ b/__tests__/jest/components/Branding.test.tsx
@@ -0,0 +1,25 @@
+import Branding from '@components/Branding/Branding';
+import { render, screen } from '@test-utils';
+import '../__mocks__/matchMedia.mock';
+
+describe('Branding', () => {
+  it('renders the title wrapped with an h1 element on homepage', () => {
+    render(<Branding isHome={true} />);
+    expect(
+      screen.getByRole('heading', { level: 1, name: 'Armand Philippot' })
+    ).toBeInTheDocument();
+  });
+
+  it('renders the title wrapped without an h1 element on other pages', () => {
+    render(<Branding isHome={false} />);
+    expect(
+      screen.queryByRole('heading', { level: 1, name: 'Armand Philippot' })
+    ).not.toBeInTheDocument();
+  });
+
+  it('renders the baseline', () => {
+    render(<Branding isHome={false} />);
+    // Currently, only French translation is returned.
+    expect(screen.getByText('Intégrateur web')).toBeInTheDocument();
+  });
+});
diff --git a/__tests__/utils/test-utils.tsx b/__tests__/utils/test-utils.tsx
index e47bbe1..00123c3 100644
--- a/__tests__/utils/test-utils.tsx
+++ b/__tests__/utils/test-utils.tsx
@@ -1,6 +1,6 @@
 import { render, RenderOptions } from '@testing-library/react';
 import { ThemeProvider } from 'next-themes';
-import { FC } from 'react';
+import { FC, ReactElement } from 'react';
 import { IntlProvider } from 'react-intl';
 
 type ProvidersConfig = {
@@ -8,8 +8,8 @@ type ProvidersConfig = {
 };
 
 type CustomRenderOptions = {
-  providers: ProvidersConfig;
-  testingLibrary: Omit<RenderOptions, 'wrapper'>;
+  providers?: ProvidersConfig;
+  testingLibrary?: Omit<RenderOptions, 'wrapper'>;
 };
 
 /**
@@ -28,13 +28,13 @@ const AllTheProviders: FC<ProvidersConfig> = ({ children, locale = 'en' }) => {
 /**
  * Render a component with all the providers.
  *
- * @param {JSX.Element} ui - A React component.
+ * @param {ReactElement} ui - A React component.
  * @param {CustomRenderOptions} [options] - An object of render options and providers options.
  * @returns A React component wrapped with all the providers.
  */
-const customRender = (ui: JSX.Element, options?: CustomRenderOptions) =>
+const customRender = (ui: ReactElement, options?: CustomRenderOptions) =>
   render(ui, {
-    wrapper: () => <AllTheProviders {...options?.providers} />,
+    wrapper: (props) => <AllTheProviders {...props} {...options?.providers} />,
     ...options?.testingLibrary,
   });
 
diff --git a/jest.setup.js b/jest.setup.js
index 666127a..1088ac5 100644
--- a/jest.setup.js
+++ b/jest.setup.js
@@ -1 +1,3 @@
 import '@testing-library/jest-dom/extend-expect';
+
+jest.mock('next/dist/client/router', () => require('next-router-mock'));