Merge pull request #1276 from dpc-sdp/release/v2.13.0

Release/v2.13.0

CHANGELOG.md

@@ -1,5 +1,45 @@
 # Changelog
 
+## v2.13.0
+
+[compare changes](https://github.com/dpc-sdp/ripple-framework/compare/v2.12.0...v2.13.0)
+
+
+### 🚀 Enhancements
+
+  - **@dpc-sdp/nuxt-ripple:** Add custom content rating text ([bdce60ca3](https://github.com/dpc-sdp/ripple-framework/commit/bdce60ca3))
+  - **@dpc-sdp/ripple-ui-core:** Make sure all table content is rtl ([7cc2831e4](https://github.com/dpc-sdp/ripple-framework/commit/7cc2831e4))
+  - **@dpc-sdp/nuxt-ripple:** Add fallback for legacy tide versions ([28d0cdce5](https://github.com/dpc-sdp/ripple-framework/commit/28d0cdce5))
+  - **@dpc-sdp/ripple-ui-core:** Support cell alignment ([63766f5cd](https://github.com/dpc-sdp/ripple-framework/commit/63766f5cd))
+  - ✨  create sdp-core content type pkg ([bb0a519a9](https://github.com/dpc-sdp/ripple-framework/commit/bb0a519a9))
+  - **@dpc-sdp/ripple-tide-search:** Add siteSearchContentTypes featureFlag ([1d2ab6f79](https://github.com/dpc-sdp/ripple-framework/commit/1d2ab6f79))
+  - **@dpc-sdp/ripple-tide-search:** Allow individual content types to be toggled on or off ([4cb50a565](https://github.com/dpc-sdp/ripple-framework/commit/4cb50a565))
+  - **@dpc-sdp/ripple-tide-search:** Allow address search function to be customised via JSON ([695b18cd1](https://github.com/dpc-sdp/ripple-framework/commit/695b18cd1))
+
+### 🩹 Fixes
+
+  - **@dpc-sdp/ripple-tide-search:** Add field_redirect_website check ([e6418d1c2](https://github.com/dpc-sdp/ripple-framework/commit/e6418d1c2))
+  - **@dpc-sdp/nuxt-ripple-analytics:** Add fallback origin in dataLayer for relative URLs ([76ee3d1de](https://github.com/dpc-sdp/ripple-framework/commit/76ee3d1de))
+  - **@dpc-sdp/ripple-tide-search:** Clear geolocation button errors on search or reset ([15e916abf](https://github.com/dpc-sdp/ripple-framework/commit/15e916abf))
+
+### 🏡 Chore
+
+  - **@dpc-sdp/ripple-ui-core:** Cleanup some console/linting warnings ([eb9311e4c](https://github.com/dpc-sdp/ripple-framework/commit/eb9311e4c))
+  - Update canary action to publish on release branches ([5aa2fec52](https://github.com/dpc-sdp/ripple-framework/commit/5aa2fec52))
+  - Remove develop branch from canary publish ([5542fe498](https://github.com/dpc-sdp/ripple-framework/commit/5542fe498))
+
+### ✅ Tests
+
+  - **nuxt-app:** Adding tests for analytics events ([33a499424](https://github.com/dpc-sdp/ripple-framework/commit/33a499424))
+  - **nuxt-app:** Adding test for field_redirect_website support ([badd972b2](https://github.com/dpc-sdp/ripple-framework/commit/badd972b2))
+
+### ❤️  Contributors
+
+- Jeffrey Dowdle <jeffrey.dowdle@dpc.vic.gov.au>
+- Dylankelly <dylan.kelly@dpc.vic.gov.au>
+- David Featherston <david.featherstone@dpc.vic.gov.au>
+- Jason Smith <jason.smith@dpc.vic.gov.au>
+
 ## v2.12.0
 
 [compare changes](https://github.com/dpc-sdp/ripple-framework/compare/v2.11.1...v2.12.0)

examples/nuxt-app/nuxt.config.ts

@@ -19,15 +19,7 @@ export default defineNuxtConfig({
     '@dpc-sdp/nuxt-ripple',
     '@dpc-sdp/nuxt-ripple-analytics',
     '@dpc-sdp/nuxt-ripple-preview',
-    '@dpc-sdp/ripple-tide-event',
-    '@dpc-sdp/ripple-tide-topic',
-    '@dpc-sdp/ripple-tide-landing-page',
-    '@dpc-sdp/ripple-tide-grant',
-    '@dpc-sdp/ripple-tide-publication',
-    '@dpc-sdp/ripple-tide-media',
-    '@dpc-sdp/ripple-tide-news',
-    '@dpc-sdp/ripple-tide-search',
-    '@dpc-sdp/ripple-tide-webform',
+    '@dpc-sdp/ripple-sdp-core',
     './layers/ripple-ui-forms-ext'
   ],
   // Nuxt devtools

examples/nuxt-app/package.json

@@ -25,15 +25,7 @@
     "@dpc-sdp/nuxt-ripple-analytics": "workspace:*",
     "@dpc-sdp/nuxt-ripple-cli": "workspace:*",
     "@dpc-sdp/nuxt-ripple-preview": "workspace:*",
-    "@dpc-sdp/ripple-tide-event": "workspace:*",
-    "@dpc-sdp/ripple-tide-grant": "workspace:*",
-    "@dpc-sdp/ripple-tide-landing-page": "workspace:*",
-    "@dpc-sdp/ripple-tide-media": "workspace:*",
-    "@dpc-sdp/ripple-tide-news": "workspace:*",
-    "@dpc-sdp/ripple-tide-publication": "workspace:*",
-    "@dpc-sdp/ripple-tide-search": "workspace:*",
-    "@dpc-sdp/ripple-tide-topic": "workspace:*",
-    "@dpc-sdp/ripple-tide-webform": "workspace:*",
+    "@dpc-sdp/ripple-sdp-core": "workspace:*",
     "@dpc-sdp/ripple-ui-maps": "workspace:*"
   },
   "devDependencies": {

examples/nuxt-app/test/features/landingpage/page-components.feature

@@ -17,6 +17,12 @@ Feature: Home page
       | Accordion #1 | Test rich text content #1 |
       | Accordion #2 | Test rich text content #2 |
     And the accordion with ID "972" should display the description "Test accordion description"
+    When I click the accordion item "Accordion #1" in accordion with ID "accordion-972"
+    When I click the accordion item "Accordion #1" in accordion with ID "accordion-972"
+    Then the dataLayer should include the following events
+      | event           | element_id        | element_text | name                 | component     |
+      | open_accordion  | accordion-972-970 | Accordion #1 | Test accordion title | rpl-accordion |
+      | close_accordion | accordion-972-970 | Accordion #1 | Test accordion title | rpl-accordion |
 
   @mockserver
   Scenario: Page component - Accordion (Open/close all)
@@ -25,6 +31,10 @@ Feature: Home page
 
     When I click the close all button on accordion with ID "accordion-972"
     Then all accordion items in accordion ID "accordion-972" should be hidden
+    And the dataLayer should include the following events
+      | event               | element_id    | element_text | name                 | component     |
+      | open_accordion_all  | accordion-972 | Open all     | Test accordion title | rpl-accordion |
+      | close_accordion_all | accordion-972 | Close all    | Test accordion title | rpl-accordion |
 
   @mockserver
   Scenario: Page component - Promo card
@@ -54,7 +64,6 @@ Feature: Home page
       | displayStyle | title               | content            | image                    |
       | featured     | Nav card (featured) | Sample description | /placeholders/medium.png |
 
-
   @mockserver
   Scenario: Page component - Key dates card
     Then a key dates card with ID "988" should exist with the title "Key calendar dates"
@@ -68,10 +77,10 @@ Feature: Home page
   Scenario: Page component - Timeline
     Then a timeline with ID "992" should exist with the title "Test timeline title"
     Then a timeline with ID "992" should exist with the following items
-      | title             | date                     | summary                   | url                 | image                    |
-      | Milestone 1 title | 2 June to 11 November    | Milestone 1 summary field | /test-destination-1 | /placeholders/small.png  |
-      | Milestone 2 title | 4 October to 17 November | Milestone 2 summary field | /test-destination-2 |                          |
-      | Milestone 3 title |                          | Milestone 3 text          |                     |                          |
+      | title             | date                     | summary                   | url                 | image                   |
+      | Milestone 1 title | 2 June to 11 November    | Milestone 1 summary field | /test-destination-1 | /placeholders/small.png |
+      | Milestone 2 title | 4 October to 17 November | Milestone 2 summary field | /test-destination-2 |                         |
+      | Milestone 3 title |                          | Milestone 3 text          |                     |                         |
 
   @mockserver
   Scenario: Page component - Call to action
@@ -106,6 +115,11 @@ Feature: Home page
     Then the active slide on "1155" should be "1"
     And the pagination button "Previous" on "1155" should be disabled
 
+    And the dataLayer should include the following events
+      | event         | element_id          | element_text | component         |
+      | paginate_next | page-component-1155 | Next         | rpl-card-carousel |
+      | paginate_prev | page-component-1155 | Previous     | rpl-card-carousel |
+
   @mockserver
   Scenario: Page component - Media Gallery
     Given a media gallery with ID "1056" should exist with the following gallery items
@@ -124,13 +138,21 @@ Feature: Home page
     And the pagination button "Next" on "1056" should be disabled
     When I click the button "Previous" on the component with ID "1056"
     Then the active slide on "1056" should be "2"
+    And the dataLayer should include the following events
+      | event         | element_id          | element_text | label           | component         |
+      | paginate_next | page-component-1056 | Next         | Media title two | rpl-media-gallery |
+      | paginate_prev | page-component-1056 | Previous     | Media title two | rpl-media-gallery |
 
   @mockserver
   Scenario: Page component - Media Gallery (Modal)
     When I click the button "View 'Media title one' fullscreen" on the component with ID "1056"
     Then the "media-gallery" modal should be "visible"
     When I click the "media-gallery" modal button "Close"
     Then the "media-gallery" modal should be "hidden"
+    And the dataLayer should include the following events
+      | event            | element_id          | element_text                      | label           | component         |
+      | enter_fullscreen | page-component-1056 | View 'Media title one' fullscreen | Media title one | rpl-media-gallery |
+      | exit_fullscreen  | page-component-1056 | Close                             | Media title one | rpl-media-gallery |
 
   @mockserver
   Scenario: Page component - Data Table
@@ -157,3 +179,29 @@ Feature: Home page
       | title    | content          | image                    | url                 |
       | Card one | Card one summary | /placeholders/medium.png | /landing-page-cc-2  |
       | Card two | Card two summary | /placeholders/medium.png | https://google.com/ |
+
+  @mockserver
+  Scenario: Page component - Complex image/Media Embed
+    Given a media embed with ID "1951" should exist
+    Then the media embed image for "1951" should be "/placeholders/medium.png"
+    When I click the action "More info" for media embed "1951"
+    Then the extra data for media embed "1951" should be visible
+    When I click the action "More info" for media embed "1951"
+    Then the extra data for media embed "1951" should be hidden
+
+    When I click the action "Fullscreen" for media embed "1951"
+    Then the "media-embed" modal should be "visible"
+    When I click the "media-embed" modal button "Close"
+    Then the "media-embed" modal should be "hidden"
+
+    And the dataLayer should include the following events
+      | event            | element_id          | element_text | label         | component       |
+      | open_data        | page-component-1951 | More info    | Complex image | rpl-media-embed |
+      | close_data       | page-component-1951 | More info    | Complex image | rpl-media-embed |
+      | enter_fullscreen | page-component-1951 | Fullscreen   | Complex image | rpl-media-embed |
+      | exit_fullscreen  | page-component-1951 | Close        | Complex image | rpl-media-embed |
+
+    When I trigger a click for the action "Download it" on the media embed "1951"
+    Then the dataLayer should include the following events
+      | event         | element_id          | element_text | label         | file_name  | file_extension | type  | component       |
+      | file_download | page-component-1951 | Download it  | Complex image | medium.png | png            | image | rpl-media-embed |

examples/nuxt-app/test/features/maps/geolocate.feature

@@ -0,0 +1,34 @@
+Feature: Custom collection map component
+
+  I want to display a map of features from an indexed data pipeline
+
+  Background:
+    Given the site endpoint returns fixture "/site/vic" with status 200
+    And the search autocomplete request is stubbed with "/search-listing/suggestions/none" fixture
+    Given I am using a "macbook-16" device
+    Given the "/api/tide/elasticsearch/elasticsearch_index_develop_node/_search" aggregation request is stubbed with fixture "/map-table/vsba/aggregations" and status 200 as alias "aggReq"
+    Given the "/test-map-shape-layer" network request is stubbed with fixture "/maps/sample-shapes"
+      | method | status |
+      | GET    | 200    |
+    Given the "https://base.maps.vic.gov.au/service*" network request is stubbed with fixture "/maps/service.png"
+      | method | status |
+      | GET    | 200    |
+
+  @mockserver
+  Scenario: The geolocate button is hidden when not enabled
+    Given I load the page fixture with "/maps/basic-page"
+    Given the geolocation button is not enabled
+    And the page endpoint for path "/map" returns the loaded fixture
+    And the "/api/tide/elasticsearch/elasticsearch_index_develop_node/_search" network request is delayed by 1000 milliseconds and stubbed with fixture "/site/search-response", status 200 and alias "searchReq"
+    Given I visit the page "/map"
+
+    Then the geolocate button is hidden
+
+  @mockserver
+  Scenario: The geolocate button is shown when enabled
+    Given I load the page fixture with "/maps/basic-page"
+    Given the geolocation button is enabled
+    And the page endpoint for path "/map" returns the loaded fixture
+    And the "/api/tide/elasticsearch/elasticsearch_index_develop_node/_search" network request is delayed by 1000 milliseconds and stubbed with fixture "/site/search-response", status 200 and alias "searchReq"
+    Given I visit the page "/map"
+    Then the geolocate button is displayed

examples/nuxt-app/test/features/publication/publication.feature

@@ -26,6 +26,10 @@ Feature: Publication page
       | title                                                    | url                                                                               | type | size    |
       | Victorian Skills Plan Implementation Update October 2023 | /sites/default/files/2023-10/16686-VSA-Implementation-Plan-Section_FA_Digital.pdf | pdf  | 4.61 MB |
       | Print full document                                      | /victorian-skills-plan-2023-implementation-update/print-all                       |      |         |
+    When I click on the document "Victorian Skills Plan Implementation Update October 2023"
+    Then the dataLayer should include the following events
+      | event         | element_text                                             | file_name                                            | file_extension | file_size | component |
+      | file_download | Victorian Skills Plan Implementation Update October 2023 | 16686-VSA-Implementation-Plan-Section_FA_Digital.pdf | pdf            | 4.61 MB   | rpl-file  |
 
   @mockserver
   Example: Publication child

examples/nuxt-app/test/features/search-listing/list.feature

@@ -20,10 +20,10 @@ Feature: List layout
     And the search network request should be called with the "/search-listing/list/request" fixture
     And the search listing results count should read "Displaying 1-9 of 124 results"
     And the search listing results should have following items:
-      | title                    | content                                       | component          |
-      | 2-BE-event-1             | The ingenious hero who travelled far and wide | tide-search-result |
-      | 5-BE-land-3 Landing Page | Outside thundered the approaching surf of war | tide-search-result |
-      | Accessibility - demo     | Accessibility information about this website. | tide-search-result |
+      | title                    | content                                       | url                                     | component          |
+      | 2-BE-event-1             | The ingenious hero who travelled far and wide | /2-be-event-1                           | tide-search-result |
+      | 5-BE-land-3 Landing Page | Outside thundered the approaching surf of war | /5-be-land-3-landing-page-complete-test | tide-search-result |
+      | Accessibility - demo     | Accessibility information about this website. | https://vic.gov.au/page                 | tide-search-result |
 
   @mockserver
   Example: A custom skeleton loader can be use for list result items

examples/nuxt-app/test/features/site/analytics.feature

@@ -0,0 +1,14 @@
+Feature: Analytics
+
+  Background:
+    Given the site endpoint returns fixture "/site/reference" with status 200
+
+  @mockserver
+  Scenario: DataLayer events
+    Given the site endpoint returns fixture "/site/reference" with status 200
+    And the page endpoint for path "/" returns fixture "/landingpage/home" with status 200
+    Given I visit the page "/"
+
+    Then the dataLayer should include the following events
+      | event       | page_title        | page_url | content_type |
+      | routeChange | Demo Landing Page | /        | landing_page |

examples/nuxt-app/test/features/site/search.feature

@@ -1,10 +1,8 @@
 Feature: Site search
 
-  Background:
-    Given the site endpoint returns fixture "/site/reference" with status 200
-
   @mockserver
   Example: Display and manage site search results
+    Given the site endpoint returns fixture "/site/reference" with status 200
     Given the "/api/tide/search/**" network request is delayed by 500 milliseconds and stubbed with fixture "/site/search-response", status 200 and alias "siteSearchReq"
     When I visit the page "/search?q=demo"
     Then the search listing skeleton should display 10 items with the class "tide-search-result-skeleton"
@@ -35,8 +33,22 @@ Feature: Site search
     Then the filters toggle should show 0 applied filters
     And the search input should have the value ""
 
+  @mockserver
+  Example: Overrides site search content types with feature flag
+    Given the "/api/tide/search/**" network request is stubbed with fixture "/site/search-response" and status 200 as alias "siteSearchReq"
+    Then I load the site fixture with "/site/reference"
+    And the feature flag "search.contentTypes.grant" is set to "false"
+    And the feature flag "search.contentTypes.product" is set to "true"
+    And the site endpoint returns the loaded fixture
+
+    When I visit the page "/search?q=demo"
+    Then I toggle the search listing filters section
+    And I clear the search filters
+    Then the network request "siteSearchReq" should be called with the "/site/search-request-content-types" fixture
+
   @mockserver
   Example: Search bar max input length
+    Given the site endpoint returns fixture "/site/reference" with status 200
     Given the "/api/tide/search/**" network request is stubbed with fixture "/site/search-response" and status 200 as alias "siteSearchReq"
     When I visit the page "/search"
     Then the search input should be have a max length of 128

examples/nuxt-app/test/features/site/shared-elements.feature

@@ -83,6 +83,28 @@ Feature: Shared site elements
       | Demo Topic | /topic/demo-topic |
       | Demo Tag   | /tags/demo-tag    |
 
+  @mockserver
+  Scenario: Content Rating (visible)
+    Given the site endpoint returns fixture "/site/shared-elements" with status 200
+    And I load the page fixture with "/landingpage/home"
+    And the content rating form is enabled
+    Then the page endpoint for path "/page" returns the loaded fixture
+
+    Given I visit the page "/page"
+    Then the content rating form should be displayed
+    And I click the content rating option labelled "Yes"
+    Then the content rating form should display the custom text "Test custom rating text."
+
+  @mockserver
+  Scenario: Content Rating (hidden)
+    Given the site endpoint returns fixture "/site/shared-elements" with status 200
+    And I load the page fixture with "/landingpage/home"
+    And the content rating form is disabled
+    Then the page endpoint for path "/page" returns the loaded fixture
+
+    Given I visit the page "/page"
+    Then the content rating form should not be displayed
+
   @mockserver
   Scenario: Footer
     Given the site endpoint returns fixture "/site/shared-elements" with status 200

examples/nuxt-app/test/fixtures/landingpage/home.json

@@ -907,6 +907,25 @@
           }
         ]
       }
+    },
+    {
+      "uuid": "5cb51ee5-a63f-433e-92a6-017b92ce37fe",
+      "component": "TideLandingPageMediaEmbed",
+      "id": "1951",
+      "props": {
+        "title": "Complex image",
+        "caption": "Source by the Department",
+        "src": "/placeholders/medium.png",
+        "dataLabel": "More info",
+        "dataContent": "<p>Ex eiusmod quis pariatur ipsum exercitation est velit eu magna.</p>",
+        "fullscreenLabel": "Fullscreen",
+        "downloadUrl": "/placeholders/medium.png",
+        "downloadLabel": "Download it",
+        "type": "image",
+        "variant": "complex",
+        "allowFullscreen": true,
+        "showTitle": true
+      }
     }
   ],
   "meta": {