Merge pull request #78 from sebgroup/develop

next release
sebgroup · Jun 6, 2023 · 3e5115a · 3e5115a
2 parents 7565801 + c945283
commit 3e5115a
Show file tree

Hide file tree

Showing 4 changed files with 43 additions and 15 deletions.
diff --git a/src/WizardSteps/components/WizardNavigations/WizardNavigations.scss b/src/WizardSteps/components/WizardNavigations/WizardNavigations.scss
@@ -37,7 +37,7 @@
       }
 
       a {
-        padding-inline: 1rem;
+        padding-left: 1rem;
       }
     }
 

diff --git a/src/WizardSteps/components/WizardNavigations/WizardNavigations.test.tsx b/src/WizardSteps/components/WizardNavigations/WizardNavigations.test.tsx
@@ -101,7 +101,7 @@ describe('Component: WizardNavigations', () => {
     expect(screen.getByRole('listitem')).toHaveClass('introduction');
   });
 
-  it('Should render sub navigations correctly', () => {
+  describe('sub navigations', () => {
     const navigations = [
       {
         label: 'Step 1',
@@ -131,19 +131,46 @@ describe('Component: WizardNavigations', () => {
         step: 4,
       },
     ];
-    renderWithRouter({ navigations });
-    navigations.forEach((navigation: WizardNavigationData) => {
-      assertLinkExist(navigation.label);
-      navigation.subNavigations?.forEach((subNavigation) => {
-        assertLinkExist(subNavigation.label);
+
+    function assertSubNavigationsVisibility(visible: boolean) {
+      const [, subNavigations] = screen.getAllByRole('list');
+
+      if (visible) {
+        expect(subNavigations).not.toHaveClass('d-none');
+      } else {
+        expect(subNavigations).toHaveClass('d-none');
+      }
+    }
+
+    it('Should render sub navigations correctly', () => {
+      renderWithRouter({ navigations });
+      navigations.forEach((navigation: WizardNavigationData) => {
+        assertLinkExist(navigation.label);
+        navigation.subNavigations?.forEach((subNavigation) => {
+          assertLinkExist(subNavigation.label);
+        });
       });
+      expect(screen.getAllByRole('link')).toHaveLength(
+        navigations.flatMap((navigation) => [
+          navigation,
+          ...(navigation.subNavigations ?? []),
+        ]).length
+      );
+    });
+
+    it('Should hide sub navigations when not needed', async () => {
+      renderWithRouter({ navigations });
+      assertSubNavigationsVisibility(false);
+    });
+
+    it('Should show sub navigations when needed', async () => {
+      mockedUseNavigationContext.mockImplementation(() => ({
+        ...defaultNavigationInterface,
+        activeStep: 1,
+      }));
+      renderWithRouter({ navigations });
+      assertSubNavigationsVisibility(true);
     });
-    expect(screen.getAllByRole('link')).toHaveLength(
-      navigations.flatMap((navigation) => [
-        navigation,
-        ...(navigation.subNavigations ?? []),
-      ]).length
-    );
   });
 
   it('Should inject tokens into navigation description when placeholders exists', () => {

diff --git a/src/WizardSteps/components/WizardNavigations/WizardNavigations.tsx b/src/WizardSteps/components/WizardNavigations/WizardNavigations.tsx
@@ -127,7 +127,9 @@ const WizardNavigationList = React.forwardRef(
               />
               {Array.isArray(subNavigations) && (
                 <WizardNavigationList
-                  className="list-group list-group-ordered"
+                  className={classnames('list-group list-group-ordered', {
+                    'd-none': !(isActive || isCompleted),
+                  })}
                   navigations={subNavigations}
                   setToggle={setToggle}
                 />

diff --git a/src/setupTests.ts b/src/setupTests.ts
@@ -22,5 +22,4 @@ global.defaultNavigationInterface = {
   setActiveState: jest.fn(),
   setActiveStep: jest.fn(),
   setRoutes: jest.fn(),
-  setStrict: jest.fn(),
 };