Release/2.17.0

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,14 +1,14 @@
-<!-- Add Jira ID Eg: SDPA-1234 or GitHub Issue Number eg: #123  -->
+<!-- Add Jira ID Eg: SD-1234 or GitHub Issue Number eg: #123 -->
 
 **Issue**:
 
 ### What I did
-<!-- Summary of changes made in the Pull Request  -->
+<!-- Summary of changes made in the Pull Request -->
 - 
 - 
 
 ### How to test
-<!-- Summary of how to test  -->
+<!-- Summary of how to test the changes -->
 - 
 - 
 
@@ -19,13 +19,13 @@
 
 #### For all PR's
 
-- [ ] I've added relevant changes to the project Readme if needed.
-- [ ] I've updated the documentation site as needed.
-- [ ] I have added unit tests to cover my changes (if not applicable, please state why in a comment)
+- [ ] I've added relevant changes to the project Readme if needed
+- [ ] I've updated the documentation site as needed
+- [ ] I have added tests to cover my changes (if not applicable, please state why in a comment)
 
-#### For new components only
+#### For new UI components only
 
-- [ ] I have added a story covering all variants
+- [ ] I have added a storybook story covering all variants
 - [ ] I have checked a11y tab in storybook passes
-- [ ] Any events are emitted on the event bus
-
+- [ ] I have added cypress component tests (if the component is interactive)
+- [ ] Any events are emitted on the event bus using `emitRplEvent`

CHANGELOG.md

@@ -1,5 +1,74 @@
 # Changelog
 
+## v2.17.0
+
+[compare changes](https://github.com/dpc-sdp/ripple-framework/compare/2.16.0...v2.17.0)
+
+
+### 🚀 Enhancements
+
+  - **@dpc-sdp/ripple-tide-webform:** Added support for CAPTCHAs in webforms ([611794fcf](https://github.com/dpc-sdp/ripple-framework/commit/611794fcf))
+  - **@dpc-sdp/ripple-tide-webform:** Updated captcha mapping after backend update ([15ddd5d41](https://github.com/dpc-sdp/ripple-framework/commit/15ddd5d41))
+  - **@dpc-sdp/ripple-tide-search:** Set pii value for search listing filters ([383195090](https://github.com/dpc-sdp/ripple-framework/commit/383195090))
+  - **@dpc-sdp/ripple-ui-forms:** Use labels for dataLayer events, add rpl-form-number dataLayer event ([ac8d207af](https://github.com/dpc-sdp/ripple-framework/commit/ac8d207af))
+  - **@dpc-sdp/ripple-tide-webform:** Captchas for content rating and support multiple on a page ([30a0f90a6](https://github.com/dpc-sdp/ripple-framework/commit/30a0f90a6))
+  - **@dpc-sdp/ripple-ui-core:** Add aria label to vertical nav toggles ([edda55e8e](https://github.com/dpc-sdp/ripple-framework/commit/edda55e8e))
+  - **@dpc-sdp/nuxt-ripple-analytics:** Add content status to routeChange event ([91d408c32](https://github.com/dpc-sdp/ripple-framework/commit/91d408c32))
+  - **@dpc-sdp/ripple-ui-core:** Add back to top event ([e9a6148c2](https://github.com/dpc-sdp/ripple-framework/commit/e9a6148c2))
+  - **@dpc-sdp/ripple-tide-webform:** Change the way captcha is configured to be less finnicky ([fa53a4719](https://github.com/dpc-sdp/ripple-framework/commit/fa53a4719))
+  - **@dpc-sdp/ripple-tide-publication:** Extend page links event ([2fc97251a](https://github.com/dpc-sdp/ripple-framework/commit/2fc97251a))
+  - **@dpc-sdp/ripple-ui-forms:** Added form_start analytics event ([9f4a26c9e](https://github.com/dpc-sdp/ripple-framework/commit/9f4a26c9e))
+  - **@dpc-sdp/ripple-tide-webform:** Handle recaptcha v2 quota exceeding gracefully ([345bdee4a](https://github.com/dpc-sdp/ripple-framework/commit/345bdee4a))
+  - **@dpc-sdp/ripple-tide-publication:** Add count and index to page link event ([cdc702e40](https://github.com/dpc-sdp/ripple-framework/commit/cdc702e40))
+  - **@dpc-sdp/ripple-tide-webform:** Logged captcha success with form id ([2ecb481bb](https://github.com/dpc-sdp/ripple-framework/commit/2ecb481bb))
+  - **@dpc-sdp/ripple-tide-webform:** Only load captcha scripts when captcha element is rendered ([a66b17710](https://github.com/dpc-sdp/ripple-framework/commit/a66b17710))
+  - **@dpc-sdp/ripple-tide-search:** Add prop for map height to match rpl-map ([372885a74](https://github.com/dpc-sdp/ripple-framework/commit/372885a74))
+  - **@dpc-sdp/ripple-ui-forms:** Added form abandon analytics event ([d4dc8c398](https://github.com/dpc-sdp/ripple-framework/commit/d4dc8c398))
+
+### 🩹 Fixes
+
+  - **@dpc-sdp/ripple-tide-webform:** Fixed rollup import error ([18d259672](https://github.com/dpc-sdp/ripple-framework/commit/18d259672))
+  - **@dpc-sdp/ripple-ui-forms:** Fixed issue with util imports in storybook ([19754e807](https://github.com/dpc-sdp/ripple-framework/commit/19754e807))
+  - **@dpc-sdp/ripple-ui-forms:** Fixed storybook tests ([b61548848](https://github.com/dpc-sdp/ripple-framework/commit/b61548848))
+  - **@dpc-sdp/ripple-ui-core:** Update download attribute ([335e36792](https://github.com/dpc-sdp/ripple-framework/commit/335e36792))
+  - **@dpc-sdp/ripple-tide-webform:** Fixed broken test after content rating form changes ([909f94402](https://github.com/dpc-sdp/ripple-framework/commit/909f94402))
+  - **@dpc-sdp/ripple-ui-core:** Remove un-needed tabindex from vertical nav ([ca11280f8](https://github.com/dpc-sdp/ripple-framework/commit/ca11280f8))
+  - **@dpc-sdp/ripple-ui-core:** 🐛  remove double render ([0466cf5c0](https://github.com/dpc-sdp/ripple-framework/commit/0466cf5c0))
+  - **@dpc-sdp/ripple-ui-core:** Update tabs story so tabs can be clicked ([8f8b2f8ae](https://github.com/dpc-sdp/ripple-framework/commit/8f8b2f8ae))
+  - **@dpc-sdp/ripple-tide-api:** Update getLinkFromField to account for internal: links ([2e23ba81f](https://github.com/dpc-sdp/ripple-framework/commit/2e23ba81f))
+  - **@dpc-sdp/ripple-ui-forms:** Fixed missing import for rplform ([e749444ca](https://github.com/dpc-sdp/ripple-framework/commit/e749444ca))
+  - **@dpc-sdp/ripple-tide-search:** Add full stop to the end of sentence ([da648273d](https://github.com/dpc-sdp/ripple-framework/commit/da648273d))
+
+### 💅 Refactors
+
+  - **@dpc-sdp/ripple-ui-core:** ♻️  rework breadcrumbs for 4+ terms ([c14334320](https://github.com/dpc-sdp/ripple-framework/commit/c14334320))
+  - **@dpc-sdp/ripple-ui-core:** ♻️  support slot usage ([88c6274fe](https://github.com/dpc-sdp/ripple-framework/commit/88c6274fe))
+  - **@dpc-sdp/ripple-ui-core:** ♻️  use a single collector index ([621ea1a9e](https://github.com/dpc-sdp/ripple-framework/commit/621ea1a9e))
+  - **@dpc-sdp/ripple-ui-core:** ♻️  improve accessibility ([94f38f122](https://github.com/dpc-sdp/ripple-framework/commit/94f38f122))
+  - **@dpc-sdp/ripple-ui-forms:** Use input instead of change event for form_start event ([2cc23d281](https://github.com/dpc-sdp/ripple-framework/commit/2cc23d281))
+  - **@dpc-sdp/ripple-ui-core:** ♻️  use prop and featureflag ([14f31aa0d](https://github.com/dpc-sdp/ripple-framework/commit/14f31aa0d))
+
+### 📖 Documentation
+
+  - **@dpc-sdp/ripple-ui-core:** 📝  add markup to story ([220219c52](https://github.com/dpc-sdp/ripple-framework/commit/220219c52))
+
+### 🏡 Chore
+
+  - Update PR template ([f16fa689d](https://github.com/dpc-sdp/ripple-framework/commit/f16fa689d))
+  - ⬆️  update nuxt to 3.13.2 ([60830c6b2](https://github.com/dpc-sdp/ripple-framework/commit/60830c6b2))
+  - ⬆️  fix formkit version and typescript error on test utils ([0db813243](https://github.com/dpc-sdp/ripple-framework/commit/0db813243))
+
+### 🎨 Styles
+
+  - **@dpc-sdp/ripple-tide-grant:** Add space between grant downloads ([b8decf191](https://github.com/dpc-sdp/ripple-framework/commit/b8decf191))
+
+### ❤️  Contributors
+
+- Dylan Kelly <[email protected]>
+- David Featherston <[email protected]>
+- Jason Smith <[email protected]>
+- Jeffrey Dowdle <[email protected]>
+
 ## v2.16.0
 
 [compare changes](https://github.com/dpc-sdp/ripple-framework/compare/2.15.0...v2.16.0)

examples/nuxt-app/package.json

@@ -34,6 +34,6 @@
     "@nuxt/devtools": "^0.6.7",
     "cypress": "13.6.6",
     "node-fetch-native": "^1.4.1",
-    "nuxt": "3.11.2"
+    "nuxt": "3.13.2"
   }
 }

examples/nuxt-app/test/features/landingpage/forms-analytics.feature

@@ -0,0 +1,12 @@
+Feature: Forms analytics events
+
+  @mockserver
+  Scenario: Form start
+    Given the mock server has started
+    And the page endpoint for path "/" returns fixture "/landingpage/full-form" with status 200
+    And the site endpoint returns fixture "/site/reference" with status 200
+    Given I visit the page "/"
+    When I type "Cat" into the input with the label "Last name"
+    Then the dataLayer should include the following events
+      | event      | form_id   | form_name | component | platform_event |
+      | form_start | full_form | Test form | rpl-form  | start          |

examples/nuxt-app/test/features/landingpage/forms.feature

@@ -65,6 +65,10 @@ Feature: Forms
       | You must accept the terms      | /kitchen-sink#i_accept_the_terms |
     Then clicking on an error summary link with text "Must choose a favourite colour" should focus on the input with ID "favourite_colour"
 
+    And the dataLayer should include the following events
+      | event       | form_id   | form_valid | element_text | component |
+      | form_submit | full_form | false      | Submit       | rpl-form  |
+
   @mockserver
   Scenario: Simple validation
     Given the mock server has started
@@ -124,10 +128,56 @@ Feature: Forms
     And I click "Green" from the select field with label "Favourite colour"
     And I click "Free admission" from the select field with label "Term select"
     And I click "Seniors" from the select field with label "Term select"
+    And I click "Dog person" from the radio group with label "Type of person"
+    And I click "London" from the checkbox group with label "Favourite Locations"
+    And I click "Tokyo" from the checkbox group with label "Favourite Locations"
     And I toggle the checkbox with label "Terms and conditions"
 
     And I submit the form with ID "full_form"
 
     Then a server message should be displayed above the form
       | status  | title          | description          |
       | success | Server success | Test success message |
+
+    And the dataLayer should include the following events
+      | event             | label               | form_id   | field_id                     | type     | value                  | component               |
+      | update_form_field | First name          | full_form | first_name                   | text     | [redacted]             | rpl-form-input          |
+      | update_form_field | Last name           | full_form | last_name                    | text     | [redacted]             | rpl-form-input          |
+      | update_form_field | Email               | full_form | email                        | email    | [redacted]             | rpl-form-input          |
+      | update_form_field | Quantity            | full_form | quantity                     | number   | [redacted]             | rpl-form-number         |
+      | update_form_field | Website             | full_form | website                      | url      | [redacted]             | rpl-form-input          |
+      | update_form_field | Mobile phone        | full_form | mobile_phone                 | tel      | [redacted]             | rpl-form-input          |
+      | update_form_field | Message             | full_form | message                      | textarea | [redacted]             | rpl-form-textarea       |
+      | open_form_field   | Favourite colour    | full_form | favourite_colour             | select   |                        | rpl-form-dropdown       |
+      | update_form_field | Favourite colour    | full_form | favourite_colour             | select   | Green                  | rpl-form-dropdown       |
+      | open_form_field   | Term select         | full_form | term_select                  | select   |                        | rpl-form-dropdown       |
+      | update_form_field | Term select         | full_form | term_select                  | select   | Free admission         | rpl-form-dropdown       |
+      | open_form_field   | Term select         | full_form | term_select                  | select   | Free admission         | rpl-form-dropdown       |
+      | update_form_field | Term select         | full_form | term_select                  | select   | Free admission,Seniors | rpl-form-dropdown       |
+      | update_form_field | Type of person      | full_form | person_type                  | radio    | Dog person             | rpl-form-radio-group    |
+      | update_form_field | Favourite Locations | full_form | favourite_locations          | checkbox | London                 | rpl-form-checkbox-group |
+      | update_form_field | Favourite Locations | full_form | favourite_locations          | checkbox | London,Tokyo           | rpl-form-checkbox-group |
+      | update_form_field | I accept the terms  | full_form | i_accept_the_terms__checkbox | checkbox | true                   | rpl-form-option         |
+
+    And the dataLayer should include the following events
+      | event         | form_id   | form_valid | element_text | component |
+      | form_submit   | full_form | true       | Submit       | rpl-form  |
+      | form_complete | full_form |            | Submit       | rpl-form  |
+
+    And the dataLayer form data for "form_complete" should include the following values
+      | key                 | value                  |
+      | first_name          | [redacted]             |
+      | last_name           | [redacted]             |
+      | role                | [redacted]             |
+      | email               | [redacted]             |
+      | quantity            | [redacted]             |
+      | website             | [redacted]             |
+      | mobile_phone        | [redacted]             |
+      | dob                 | [redacted]             |
+      | message             | [redacted]             |
+      | favourite_colour    | Green                  |
+      | term_select         | Free admission,Seniors |
+      | person_type         | Dog person             |
+      | favourite_locations | London,Tokyo           |
+      | i_accept_the_terms  | true                   |
+      | site_section        | DPC                    |

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

@@ -147,3 +147,11 @@ Feature: Custom collection map component
     When I click the exit fullscreen button
     And I wait 100 milliseconds
     Then the map should not be fullscreen
+
+  @mockserver
+  Scenario: Map height can be customised
+    Given I load the page fixture with "/maps/basic-page"
+    And the map height is set to 606
+    Then the page endpoint for path "/map" returns the loaded fixture
+    When I visit the page "/map"
+    Then the map height is 606

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

@@ -33,6 +33,7 @@ Feature: Publication page
 
   @mockserver
   Example: Publication child
+    Given the page endpoint for path "/victorian-skills-plan-2023-implementation-update/promoting-post-secondary-education-skills-and-career" returns fixture "/publication/sample-publication-page" with status 200
     When I visit the page "/victorian-skills-plan-2023-implementation-update/2022-victorian-skills-plan-actions-and-initiatives"
     Then the title should be "The Victorian Skills Plan 2022 into 2023 actions and initiatives"
     And there should be a page link with a title of "Previous" and description text of "Victorian Skills Plan Implementation Update"
@@ -41,6 +42,12 @@ 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 "Next" page link
+    Then the dataLayer should include the following events
+      | event         | element_text | link_url                                                                                               | name                                                          | count | index | component      |
+      | paginate_next | Next         | /victorian-skills-plan-2023-implementation-update/promoting-post-secondary-education-skills-and-career | Promoting post-secondary education skills and career pathways | 28    | 2     | rpl-page-links |
+
     When I click on the document "Print full document"
     Then the dataLayer should include the following events
       | event          | element_text        | link_url                                                    | component    |