fix(@dpc-sdp/ripple-tide-api): fixed site section sometimes not displ…

…aying correct active page
dpc-sdp · Aug 20, 2024 · 3a00469 · 3a00469
1 parent ac19c27
commit 3a00469
Show file tree

Hide file tree

Showing 5 changed files with 107 additions and 117 deletions.
diff --git a/examples/nuxt-app/test/features/landingpage/site-section-nav.feature b/examples/nuxt-app/test/features/landingpage/site-section-nav.feature
@@ -0,0 +1,21 @@
+Feature: Site section navigation
+
+  Example of the site section navigation in the landing page sidebar
+
+  Background:
+    Given the page endpoint for path "/level-2-2" returns fixture "/landingpage/home" with status 200
+    And the site endpoint returns fixture "/site/reference" with status 200
+
+  @mockserver
+  Scenario: Nested item active
+    When I visit the page "/level-2-2"
+    Then the site section nav should contain the following level 1 items:
+      | text        | url        |
+      | Level 1 - 1 | /level-1-1 |
+      | Level 1 - 2 | /level-1-2 |
+
+    Then the site section nav item with label "Level 1 - 1" should be expanded
+    Then the site section nav item with label "Level 1 - 2" should be collapsed
+
+    Then the site section nav item with label "Level 1 - 1" should be inactive
+    Then the site section nav item with label "Level 2 - 2" should be active
diff --git a/examples/nuxt-app/test/fixtures/landingpage/home.json b/examples/nuxt-app/test/fixtures/landingpage/home.json
@@ -78,149 +78,52 @@
       "title": "Site-section Navigation",
       "items": [
         {
-          "text": "Demo Landing Page",
-          "url": "/demo-landing-page",
+          "text": "Level 1 - 1",
+          "url": "/level-1-1",
           "id": "c9b2419b-c89d-4a43-87de-f991291c4894",
           "parent": null,
           "weight": 0,
+          "active": true,
           "items": [
             {
-              "text": "2.1 Accessibility - demo",
-              "url": "/accessibility-demo",
+              "text": "Level 2 - 1",
+              "url": "/level-2-1",
               "id": "5c890826-dcf8-4389-b852-6fb2521443e1",
               "parent": "c9b2419b-c89d-4a43-87de-f991291c4894",
               "weight": 0
             },
             {
-              "text": "2.2 Copyright - demo",
-              "url": "/copyright-demo",
+              "text": "Level 2 - 2",
+              "url": "/level-2-2",
               "id": "9ece6be1-ecad-4c48-8a75-084c2b2ab478",
               "parent": "c9b2419b-c89d-4a43-87de-f991291c4894",
-              "weight": 0
-            },
-            {
-              "text": "2.3 Disclaimer - demo",
-              "url": "/disclaimer-demo",
-              "id": "c9b2419b-c89d-4a43-87de-f991291c5000",
-              "parent": "c9b2419b-c89d-4a43-87de-f991291c4894",
               "weight": 0,
-              "items": [
-                {
-                  "text": "3.1 Find and connect - demo",
-                  "url": "/find-connect-demo",
-                  "id": "c9b2419b-c89d-4a43-87de-f991291c9000",
-                  "parent": "c9b2419b-c89d-4a43-87de-f991291c5000",
-                  "weight": 0,
-                  "items": [
-                    {
-                      "text": "4.1 Many Talents - demo",
-                      "url": "/many-talents-demo",
-                      "id": "2db8693c-5231-44f2-83a3-0c082001fb65",
-                      "parent": "c9b2419b-c89d-4a43-87de-f991291c9000",
-                      "weight": 0,
-                      "items": [
-                        {
-                          "text": "5.1 Another menu - demo",
-                          "url": "/another-demo",
-                          "id": "2xs8693c-5231-44f2-83a3-0c082001fb65",
-                          "parent": "2db8693c-5231-44f2-83a3-0c082001fb65",
-                          "weight": 0
-                        }
-                      ]
-                    },
-                    {
-                      "text": "4.2 More Talents - demo",
-                      "url": "/more-talents-demo",
-                      "id": "2db8693c-5231-44f2-83a3-0c082001fb65",
-                      "parent": "c9b2419b-c89d-4a43-87de-f991291c9000",
-                      "weight": 0
-                    }
-                  ]
-                },
-                {
-                  "text": "3.2 Legal notes - demo",
-                  "url": "/legal-notes-demo",
-                  "id": "x9b2419b-c89d-4a43-87de-f991291c9000",
-                  "parent": "c9b2419b-c89d-4a43-87de-f991291c5000",
-                  "weight": 0
-                }
-              ]
-            },
-            {
-              "text": "2.4 Working in the CMS - demo",
-              "url": "/working-cms-demo",
-              "id": "2e517f44-8545-4806-a155-ad56a93197cd",
-              "parent": "c9b2419b-c89d-4a43-87de-f991291c4894",
-              "weight": 0
+              "active": true
             }
           ]
         },
         {
-          "text": "Events",
-          "url": "/2-be-event-1",
+          "text": "Level 1 - 2",
+          "url": "/level-1-2",
           "id": "c9b2419b-c89d-4a43-87de-f991291c4896",
           "parent": null,
           "weight": 0,
           "items": [
             {
-              "text": "Kensington Primary School - information session - demo",
-              "url": "/kensington-primary-school-information-session-demo",
+              "text": "Level 2 - 3",
+              "url": "/level-2-3",
               "id": "64978dd4-866e-4f3b-a607-38f1837fda79",
               "parent": "c9b2419b-c89d-4a43-87de-f991291c4896",
               "weight": 0
             },
             {
-              "text": "Roulette Aerial Display - demo",
-              "url": "/roulette-aerial-display-demo",
-              "id": "7df7c024-3829-4fb9-8823-2cfda6637cc0",
-              "parent": "c9b2419b-c89d-4a43-87de-f991291c4896",
-              "weight": 0
-            },
-            {
-              "text": "The Trades Fit: Young Women in Trades and Tech - demo",
-              "url": "/trades-fit-young-women-trades-and-tech-demo",
-              "id": "6b6f41a9-701f-49a0-b3e2-de5ec31d5e78",
+              "text": "Level 2 - 4",
+              "url": "/level-2-4",
+              "id": "64978dd4-866e-4f3b-a607-38f1837fda79",
               "parent": "c9b2419b-c89d-4a43-87de-f991291c4896",
               "weight": 0
             }
           ]
-        },
-        {
-          "text": "News",
-          "url": "/demo-news",
-          "id": "c9b2419b-c89d-4a43-87de-f991291c4895",
-          "parent": null,
-          "weight": 0,
-          "items": [
-            {
-              "text": "FIRST-OF-ITS-KIND EXHIBITION CELEBRATES THE SERVICE OF LGBTQ+ DEFENCE PERSONNEL - demo",
-              "url": "/first-its-kind-exhibition-celebrates-service-lgbtq-defence-personnel-demo",
-              "id": "6e71585a-e721-4e81-9ca2-30dc6dc6f747",
-              "parent": "c9b2419b-c89d-4a43-87de-f991291c4895",
-              "weight": 0
-            },
-            {
-              "text": "GovHack 2022 is coming soon - Connections Event and Hack weekend - demo",
-              "url": "/govhack-2022-coming-soon-connections-event-and-hack-weekend-demo",
-              "id": "c600e93f-023b-46a0-81c2-f2a2f29024c5",
-              "parent": "c9b2419b-c89d-4a43-87de-f991291c4895",
-              "weight": 0
-            },
-            {
-              "text": "Wage Inspectorate helps 15,000 Victorians in first year - demo",
-              "url": "/wage-inspectorate-helps-15000-victorians-first-year-demo",
-              "id": "c6f121c2-64ca-4b52-b583-4edfbad4376c",
-              "parent": "c9b2419b-c89d-4a43-87de-f991291c4895",
-              "weight": 0
-            }
-          ]
-        },
-        {
-          "text": "Publications",
-          "url": "/17-be-pub-page-1-child-page-chapter-1-page-1",
-          "id": "c9b2419b-c89d-4a43-87de-f991291c4897",
-          "parent": null,
-          "weight": 0
         }
       ]
     }

diff --git a/...ges/nuxt-ripple/mapping/base/sidebar-site-section-nav/sidebar-site-section-nav-mapping.ts b/...ges/nuxt-ripple/mapping/base/sidebar-site-section-nav/sidebar-site-section-nav-mapping.ts
@@ -18,7 +18,7 @@ export const map = async (src, tidePageApi: TidePageApi) => {
   const menu = await tidePageApi.getSiteMenu(
     tidePageApi.site,
     menuData,
-    tidePageApi.path
+    src.path?.alias || src.path?.url
   )
 
   return {

diff --git a/packages/ripple-test-utils/step_definitions/common/shared-elements.ts b/packages/ripple-test-utils/step_definitions/common/shared-elements.ts
@@ -314,3 +314,73 @@ Then('the in page navigation should include', (dataTable: DataTable) => {
 Given('I click on the document {string}', (label: string) => {
   cy.contains('.rpl-document__link', label).trigger('click')
 })
+
+Then(
+  'the site section nav should contain the following level 1 items:',
+  (dataTable: DataTable) => {
+    const table = dataTable.hashes()
+
+    cy.get(
+      '[data-sidebar-component-id="tide-sidebar-site-section-nav"] .rpl-vertical-nav__list--level-1 > li'
+    ).as('items')
+
+    table.forEach((row, i: number) => {
+      cy.get('@items')
+        .eq(i)
+        .then((link) => {
+          cy.wrap(link).as('link')
+          cy.get('@link').find('a').first().should('have.attr', 'href', row.url)
+          cy.get('@link').find('a').first().contains(row.text)
+        })
+    })
+  }
+)
+
+Then(
+  'the site section nav item with label {string} should be collapsed',
+  (label: string) => {
+    cy.contains(
+      '[data-sidebar-component-id="tide-sidebar-site-section-nav"] .rpl-vertical-nav__list--level-1 > li',
+      label
+    ).as('item')
+    cy.get('@item').should(
+      'not.have.class',
+      'rpl-vertical-nav__list-item--expanded'
+    )
+  }
+)
+
+Then(
+  'the site section nav item with label {string} should be expanded',
+  (label: string) => {
+    cy.contains(
+      '[data-sidebar-component-id="tide-sidebar-site-section-nav"] .rpl-vertical-nav__list--level-1 > li',
+      label
+    ).as('item')
+    cy.get('@item').should(
+      'have.class',
+      'rpl-vertical-nav__list-item--expanded'
+    )
+  }
+)
+
+Then(
+  'the site section nav item with label {string} should be active',
+  (label: string) => {
+    cy.get(
+      '[data-sidebar-component-id="tide-sidebar-site-section-nav"] .rpl-vertical-nav__item--active'
+    ).as('item')
+    cy.get('@item').should('have.length', 1)
+    cy.get('@item').should('contain', label)
+  }
+)
+
+Then(
+  'the site section nav item with label {string} should be inactive',
+  (label: string) => {
+    cy.get(
+      '[data-sidebar-component-id="tide-sidebar-site-section-nav"] .rpl-vertical-nav__item--active'
+    ).as('item')
+    cy.get('@item').should('not.contain', label)
+  }
+)
diff --git a/packages/ripple-tide-api/src/services/tide-page.ts b/packages/ripple-tide-api/src/services/tide-page.ts
@@ -18,12 +18,10 @@ export default class TidePageApi extends TideApiBase {
     [key: string]: IRplTideDynamicComponentMapping
   }
   site: string
-  path: string
 
   constructor(tide: RplTideModuleConfig, logger: ILogger) {
     super(tide, logger)
     this.site = tide.site
-    this.path = ''
     this.contentTypes = {}
     this.dynamicComponents = {}
     this.logLabel = 'TidePage'
@@ -91,8 +89,6 @@ export default class TidePageApi extends TideApiBase {
     headers = {},
     logId?: string
   ) {
-    this.path = path
-
     const routeUrl = `/route?site=${site}&path=${path}`
 
     return this.get(routeUrl, { headers, _logId: logId })