As a web performance consultant, I need to track which page views were viewed with the cookies accepted and which ones with cookie refused, so that I will be able to quickly check on the impact of third parties.

In order to do that, we require that, when users make a choice by clicking on the cookie layer "accept" "refuse", etc. the data-wp-page-cookie attribute of the <main> tag is updated via JavaScript with the resulting value.

The value data-wp-page-cookie is a string, containing any value that would make us able to distinguish which page views were made after users accepted what.

Some examples could be:

• all-accepted
• none-accepted
• an array of accepted cookie types, e.g. marketing, technical, ...

Sample code, just to give you the idea:

const acceptedCookies = someFunctionToGetTheValues();
let elementWithTheCookieAttribute = document.querySelector('[data-wp-page-cookie]');

if (!elementWithTheCookieAttribute) {
  // this should never be the case because the attribute 
  // is already in the `main` tag
 elementWithTheCookieAttribute = document.createElement(`div`);
 document.body.appendChild(elementWithTheCookieAttribute);
}

elementWithTheCookieAttribute.setAttribute('data-wp-page-cookie', acceptedCookies.join());

Related ticket: #72.