@ons/design-system 74.0.0-next.14 → 74.0.0-next.15

package/js/cookies-functions.js

@@ -74,7 +74,6 @@ export function getConsentCookie() {
 }
 
 export function setConsentCookie(options) {
-    const domain = getDomain(document.domain);
     let cookieConsent = getConsentCookie();
     if (!cookieConsent) {
         cookieConsent = JSON.parse(JSON.stringify(DEFAULT_COOKIE_CONSENT).replace(/'/g, '"'));
@@ -85,10 +84,6 @@ export function setConsentCookie(options) {
             for (let cookies in COOKIE_CATEGORIES) {
                 if (COOKIE_CATEGORIES[cookies] === cookieType) {
                     cookie(cookies, null);
-                    if (cookie(cookies)) {
-                        const cookieString = cookies + '=; expires=' + new Date() + '; domain=' + domain + '; path=/';
-                        document.cookie = cookieString;
-                    }
                 }
             }
         }
@@ -127,27 +122,25 @@ export function checkConsentCookie(cookieName, cookieValue) {
 }
 
 export function setCookie(name, value, options) {
-    const domain = getDomain(document.domain);
-    let setDomain = '';
+    if (typeof options === 'undefined') {
+        options = {};
+    }
 
-    if (domain.indexOf('localhost') === -1) {
-        setDomain = '; domain=' + domain;
+    if (options.days && options.days < 0) {
+        deleteCookie(name);
+        return;
     }
 
     if (checkConsentCookie(name, value)) {
-        if (typeof options === 'undefined') {
-            options = {};
-        }
+        const secure = getSecureAttribute();
 
-        let cookieString = name + '=' + value + setDomain + '; path=/';
+        let cookieString = name + '=' + value + getCookieDomainAttribute() + '; path=/';
         if (options.days) {
             const date = new Date();
             date.setTime(date.getTime() + options.days * 24 * 60 * 60 * 1000);
             cookieString = cookieString + '; expires=' + date.toGMTString();
         }
-        if (document.location.protocol === 'https:') {
-            cookieString = cookieString + '; Secure';
-        }
+        cookieString = cookieString + secure;
         document.cookie = cookieString;
     }
 }
@@ -167,38 +160,51 @@ export function getCookie(name) {
     return null;
 }
 
-function getCookieDomainPolicy() {
+function getCookieDomain() {
     const banner = document.querySelector('.ons-cookies-banner');
-    const policy = banner ? banner.getAttribute('data-ons-cookie-domain-policy') : null;
+    const configuredDomain = banner ? banner.getAttribute('data-ons-cookie-domain') : null;
 
-    // plan: add 'exact-host' policy in future and retire 'legacy' and 'day1'
-    switch (policy) {
-        case 'legacy':
-        case 'day1':
-            return policy;
-        default:
-            return 'legacy';
+    if (configuredDomain !== null) {
+        return configuredDomain;
+    } else {
+        return extractDomainFromUrl(document.location.hostname);
     }
 }
 
-export function getDomain(domain, cookieHandler = document) {
-    const cookieDomainPolicy = getCookieDomainPolicy();
+export function extractDomainFromUrl(url) {
+    if (url.indexOf('localhost') >= 0 || url.indexOf('127.0.0.1') >= 0) {
+        return 'localhost';
+    }
+
+    const pattern = '(\\.co\\.uk|\\.onsdigital\\.uk|\\.gov\\.uk)';
+    const tlds = new RegExp(pattern);
 
-    if (cookieDomainPolicy === 'legacy' && domain.startsWith('www.')) {
-        domain = domain.substring(4);
+    const isKnownDomain = tlds.test(url);
+
+    if (isKnownDomain) {
+        return url;
     }
 
-    let i = 0,
-        domainName = domain,
-        p = domainName.split('.'),
-        s = '_gd' + new Date().getTime();
-    while (i < p.length - 1 && cookieHandler.cookie.indexOf(s + '=' + s) == -1) {
-        // Loop until we find a valid cookie set at the domain or until we've checked all possible domains
-        domainName = p.slice(i, p.length).join('.');
-        cookieHandler.cookie = s + '=' + s + ';domain=' + domainName + ';';
+    return '';
+}
 
-        i++;
+function getCookieDomainAttribute() {
+    const domain = getCookieDomain();
+
+    if (!domain) {
+        return '';
     }
-    cookieHandler.cookie = s + '=;expires=Thu, 01 Jan 1970 00:00:01 GMT;domain=' + domainName + ';';
-    return domainName;
+
+    return '; domain=' + domain;
+}
+
+function deleteCookie(name) {
+    const expires = new Date(0).toGMTString();
+    const secure = getSecureAttribute();
+
+    document.cookie = name + '=' + getCookieDomainAttribute() + '; path=/; expires=' + expires + secure;
+}
+
+function getSecureAttribute() {
+    return document.location.protocol === 'https:' ? '; Secure' : '';
 }

package/js/cookies-functions.spec.js

@@ -1,65 +1,122 @@
-/** @jest-environment jsdom */
+/**
+ * @jest-environment jsdom
+ * @jest-environment-options {"url":"https://www.ons.gov.uk/"}
+ */
 
-import { getDomain } from './cookies-functions';
+import { extractDomainFromUrl, setConsentCookie, setCookie } from './cookies-functions';
+
+let cookieAssignments = [];
 let mockCookieStore = {};
 
-// Mocking document.cookie which is used for setting domain name in `getDomain()`
-export const setMockcookie = {
-    get cookie() {
-        return Object.entries(mockCookieStore)
-            .map(([key, value]) => `${key}=${value}`)
-            .join('; ');
-    },
-    set cookie(value) {
-        const domainMatch = value.match(/domain=([^;]+)/i);
-        const domain = domainMatch?.[1]?.trim();
-
-        // Simulate failure to set cookie on this domain
-        if (domain === 'new-website.ons.gov.uk') return;
-
-        const [key, val] = value.split('=');
-        mockCookieStore[key] = val.split(';')[0];
-    },
-};
-
-describe('script: getDomain()', () => {
+function setCookieDomain(domain) {
+    const banner = document.createElement('div');
+    banner.className = 'ons-cookies-banner';
+    banner.setAttribute('data-ons-cookie-domain', domain);
+    document.body.appendChild(banner);
+}
+
+function getLastCookieAssignment() {
+    return cookieAssignments[cookieAssignments.length - 1];
+}
+
+describe('script: cookies-functions', () => {
     beforeEach(() => {
-        mockCookieStore = {}; // clear the cookie between tests
+        cookieAssignments = [];
+        mockCookieStore = {};
         document.body.innerHTML = '';
+
+        Object.defineProperty(document, 'cookie', {
+            get() {
+                return Object.entries(mockCookieStore)
+                    .map(([key, value]) => `${key}=${value}`)
+                    .join('; ');
+            },
+            set(value) {
+                cookieAssignments.push(value);
+
+                const [key, val] = value.split('=');
+                if (value.includes('expires=Thu, 01 Jan 1970')) {
+                    delete mockCookieStore[key];
+                } else {
+                    mockCookieStore[key] = val.split(';')[0];
+                }
+            },
+            configurable: true,
+        });
     });
 
-    test('should return service-manual.ons.gov.uk as the domain name when cookies can be set at the full subdomain', () => {
-        const result = getDomain('service-manual.ons.gov.uk', setMockcookie);
-        expect(result).toBe('service-manual.ons.gov.uk');
+    test('uses the Go port domain rule for known hosts', () => {
+        expect(extractDomainFromUrl('www.ons.gov.uk')).toBe('www.ons.gov.uk');
+        expect(extractDomainFromUrl('eq.census.gov.uk')).toBe('eq.census.gov.uk');
+        expect(extractDomainFromUrl('service.onsdigital.uk')).toBe('service.onsdigital.uk');
+        expect(extractDomainFromUrl('service.co.uk')).toBe('service.co.uk');
     });
 
-    test('should remove `www` from the domain name www.ons.gov.uk', () => {
-        const result = getDomain('www.ons.gov.uk', setMockcookie);
-        expect(result).toBe('ons.gov.uk');
+    test('uses the Go port domain rule for local and unrecognised hosts', () => {
+        expect(extractDomainFromUrl('localhost')).toBe('localhost');
+        expect(extractDomainFromUrl('127.0.0.1')).toBe('localhost');
+        expect(extractDomainFromUrl('service.example.com')).toBe('');
     });
 
-    test('removes `www` when cookieDomainPolicy is `legacy`', () => {
-        const banner = document.createElement('div');
-        banner.className = 'ons-cookies-banner';
-        banner.setAttribute('data-ons-cookie-domain-policy', 'legacy');
-        document.body.appendChild(banner);
+    test('sets a domain cookie by default on a known hostname', () => {
+        setCookie('ons_cookie_policy', 'test-value', { days: 365 });
 
-        const result = getDomain('www.ons.gov.uk', setMockcookie);
-        expect(result).toBe('ons.gov.uk');
+        expect(cookieAssignments).toHaveLength(1);
+        expect(getLastCookieAssignment()).toContain('ons_cookie_policy=test-value; domain=www.ons.gov.uk; path=/');
     });
 
-    test('does not remove `www` when cookieDomainPolicy is `day1`', () => {
-        const banner = document.createElement('div');
-        banner.className = 'ons-cookies-banner';
-        banner.setAttribute('data-ons-cookie-domain-policy', 'day1');
-        document.body.appendChild(banner);
+    test('does not expire other scopes before setting banner state', () => {
+        setCookie('ons_cookie_message_displayed', 'true', { days: 365 });
 
-        const result = getDomain('www.ons.gov.uk', setMockcookie);
-        expect(result).toBe('www.ons.gov.uk');
+        expect(cookieAssignments).toHaveLength(1);
+        expect(getLastCookieAssignment()).toContain('ons_cookie_message_displayed=true; domain=www.ons.gov.uk; path=/');
     });
 
-    test('returns `ons.gov.uk` as the domain name when cookies can not be set at subdomain `new-website.ons.gov.uk`', () => {
-        const result = getDomain('new-website.ons.gov.uk', setMockcookie);
-        expect(result).toBe('ons.gov.uk');
+    test('does not expire other scopes before setting other cookie categories', () => {
+        setCookie('_ga', 'test-value', { days: 365 });
+
+        expect(cookieAssignments).toHaveLength(1);
+        expect(getLastCookieAssignment()).toContain('_ga=test-value; domain=www.ons.gov.uk; path=/');
+    });
+
+    test('sets domain cookies when `domain` is provided', () => {
+        setCookieDomain('census.gov.uk');
+
+        setCookie('ons_cookie_policy', 'test-value', { days: 365 });
+
+        expect(getLastCookieAssignment()).toContain('ons_cookie_policy=test-value; domain=census.gov.uk; path=/');
+    });
+
+    test('sets host-only cookies when `domain` is explicitly false', () => {
+        setCookieDomain('');
+
+        setCookie('ons_cookie_policy', 'test-value', { days: 365 });
+
+        expect(cookieAssignments).toHaveLength(1);
+        expect(getLastCookieAssignment()).toContain('ons_cookie_policy=test-value; path=/');
+        expect(getLastCookieAssignment()).not.toMatch(/; domain=/i);
+    });
+
+    test('deletes only the default domain scope', () => {
+        setCookie('_ga', null, { days: -1 });
+
+        expect(cookieAssignments).toEqual(['_ga=; domain=www.ons.gov.uk; path=/; expires=Thu, 01 Jan 1970 00:00:00 GMT; Secure']);
+    });
+
+    test('deletes only the configured domain scope', () => {
+        setCookieDomain('census.gov.uk');
+
+        setCookie('_ga', null, { days: -1 });
+
+        expect(cookieAssignments).toEqual(['_ga=; domain=census.gov.uk; path=/; expires=Thu, 01 Jan 1970 00:00:00 GMT; Secure']);
+    });
+
+    test('deletes category cookies when consent is rejected', () => {
+        mockCookieStore.ons_cookie_policy = "{'essential':true,'settings':true,'usage':true,'campaigns':true}";
+        mockCookieStore._ga = 'test-value';
+
+        setConsentCookie({ usage: false });
+
+        expect(cookieAssignments).toContain('_ga=; domain=www.ons.gov.uk; path=/; expires=Thu, 01 Jan 1970 00:00:00 GMT; Secure');
     });
 });

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@ons/design-system",
     "description": "ONS Design System built CSS, JS, and Nunjucks templates",
-    "version": "74.0.0-next.14",
+    "version": "74.0.0-next.15",
     "main": "index.js",
     "license": "MIT",
     "author": {