Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Iterate full page examples of cookie banners in the review app #2167

Merged
merged 3 commits into from
Mar 10, 2021

Conversation

hannalaakso
Copy link
Member

Iterate the full page cookie banner examples in the review app to help us iterate the cookie banner guidance.

This PR:

  • Progressively enhances the server side example to hide the cookie banner
  • Adds an example to the review app that only uses essential cookies and doesn't collect cookie consent
  • Checks for the 'Hide' button before attaching event listener to fix a JavaScript error in the review app

This PR depends on #2164 so should be merged after it.

Closes #2160

@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-pr-2167 March 9, 2021 12:32 Inactive
@hannalaakso hannalaakso linked an issue Mar 9, 2021 that may be closed by this pull request
2 tasks
Copy link
Contributor

@36degrees 36degrees left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Makes sense to me – good stuff 👍🏻

Copy link
Contributor

@vanitabarrett vanitabarrett left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice work! 💯

Base automatically changed from enable-cookie-banner-to-set-link-as-button to master March 10, 2021 17:43
Fixes a JavaScript error currently in the review app:
```
Uncaught TypeError: Cannot read property
'addEventListener' of null`
```
If the user chooses hides the confirmation banner, progressively enhance
the cookie banner to hide with JavaScript. If JavaScript is not enabled,
the page reloads.
Add an example of a typical essential cookies only banner that works both
on client and server side. When the user hides the cookie banner, we
progressively enhance the cookie banner to hide with JavaScript. If JavaScript
is not enabled, the form is submitted and a page navigation occurs.

To enable progressive enhancement, we include a small amount of client-side
JavaScript to handle the ‘Hide’ button in the example. The cookie banner component
itself does not ship with JavaScript. Typically the service team needs to write the
code that hides the banner and integrates the collection of cookies both in JavaScript
and on the server.
@hannalaakso hannalaakso force-pushed the iterate-review-app-cookie-banner-examples branch from f92aae5 to 375ae15 Compare March 10, 2021 18:10
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-pr-2167 March 10, 2021 18:10 Inactive
@hannalaakso hannalaakso merged commit f023e60 into master Mar 10, 2021
@hannalaakso hannalaakso deleted the iterate-review-app-cookie-banner-examples branch March 10, 2021 18:16
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Iterate the full page cookie banner examples in the review app
4 participants