8582868223

Committed 06 Apr 2024 05:59PM UTC coverage: 88.097% (-0.1%) from 88.245%

Build # 8582868223

Build Type

Pull #696

github

Committed by

web-flow

Commit Message

Merge bceec6654 into 350313232

Pull Request Pull Request #696: feature(documentation-website): make cookie consent more specific

Run Details

459 of 676 branches covered (67.9%)

Branch coverage included in aggregate %.

44 of 57 new or added lines in 5 files covered. (77.19%)

5 existing lines in 1 file now uncovered.

4929 of 5440 relevant lines covered (90.61%)

1087.49 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

52.05

/documentation-website/src/components/cookie-consent.tsx

import React, {
  useState,
} from 'react';
import './cookie-consent.css';
import Lang from './lang';
import {
  createPortal,
} from 'react-dom';
import {
  EMPTY,
} from '../constants.ts';
import {
  has,
  get,
  set,
} from './local-consent-storage.ts';
import CookieConsentService from "./cookie-consent-service.tsx";

// eslint-disable-next-line complexity
const CookieConsent = () => {
  const types = [
    'youtube',
    'tracking',
  ];
  let wasAllAnswered = true;
  for (const type of types) {
    wasAllAnswered = wasAllAnswered && has(type,);
  }
  const [
    consentWasClosed,
    setConsentWasClosed,
  ] = useState<boolean>(wasAllAnswered,);
  if (consentWasClosed) {
    //@ts-expect-error _paq can be null
    window._paq = window?._paq || [];
    //@ts-expect-error _paq can be null
    window._paq.push([ get('tracking',)
      ? 'rememberConsentGiven'
      : 'forgetConsentGiven', ],);
  }

  const handleConsent = (accept: null|boolean,) => {
    if (typeof accept === 'boolean') {
      const elements = document
        .getElementById('consent-choices',)
        ?.getElementsByTagName('input',);
      for (let i = 0; i < (elements?.length ?? EMPTY); i ++) {
        const element = elements?.item(i,);
        if (element) {
          element.checked = accept;
        }
      }
      accept = null;
    }
    for  (const type  of types) {
      const allow = document
        .getElementById(type + '-consent',)
        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
        // @ts-expect-error
        ?.checked;
      set(type, allow);
    }
    //@ts-expect-error _paq can be null
    window?._paq?.push([ get('tracking',)
      ? 'rememberConsentGiven'
      : 'forgetConsentGiven', ],);
    setConsentWasClosed(true,);
  };

  const visible = ! consentWasClosed && ! localStorage.getItem('consent',);

  if (! visible) {
    const forget = () => {
      localStorage.setItem('consent', '',);
      setConsentWasClosed(false,);
    };
    return <button onClick={forget}>
      <Lang lnkey={'cookie-consent.open'}/>
    </button>;
  }

  return createPortal(<div className={'cookie-consent'}>
    <div className={'cookie-consent-description'}>
      <h2 className={'cookie-title'}>
        <Lang lnkey={'cookie-consent.title'} />
      </h2>
      <p className={'cookie-description'}>
        <Lang lnkey={'cookie-consent.description'} />
      </p>
    </div>
    <ul id={'consent-choices'}>
      <CookieConsentService>tracking</CookieConsentService>
      <CookieConsentService>youtube</CookieConsentService>
    </ul>
    <div className={'cookie-consent-buttons'}>
      <button
        onClick={() => handleConsent(true,)}
        className={'cookie-consent-accept-button'}
      >
        <Lang lnkey={'cookie-consent.accept'}/>
      </button>
      <button
        onClick={() => handleConsent(null,)}
        className={'cookie-consent-custom-button'}
      >
        <Lang lnkey={'cookie-consent.custom'}/>
      </button>
      <button
        onClick={() => handleConsent(false,)}
        className={'cookie-consent-decline-button'}
      >
        <Lang lnkey={'cookie-consent.decline'}/>
      </button>
    </div>
  </div>, document.body,);
};

export default CookieConsent;

1	import React, {	1✔
2	useState,	1✔
3	} from 'react';	1✔
4	import './cookie-consent.css';	1✔
5	import Lang from './lang';	1✔
6	import {	1✔
7	createPortal,	1✔
8	} from 'react-dom';	1✔
9	import {	1✔
10	EMPTY,	1✔
11	} from '../constants.ts';	1✔
12	import {	1✔
13	has,	1✔
14	get,	1✔
15	set,	1✔
16	} from './local-consent-storage.ts';	1✔
17	import CookieConsentService from "./cookie-consent-service.tsx";	1✔
18		1✔
19	// eslint-disable-next-line complexity	1✔
20	const CookieConsent = () => {	101✔
21	const types = [	301✔
22	'youtube',
23	'tracking',
24	];
25	let wasAllAnswered = true;	301✔
26	for (const type of types) {	301✔
27	wasAllAnswered = wasAllAnswered && has(type,);	602✔
28	}
29	const [
30	consentWasClosed,
31	setConsentWasClosed,
32	] = useState<boolean>(wasAllAnswered,);	301✔
33	if (consentWasClosed) {	301!
34	//@ts-expect-error _paq can be null
35	window._paq = window?._paq \|\| [];	×
36	//@ts-expect-error _paq can be null
NEW 37	window._paq.push([ get('tracking',)	×
38	? 'rememberConsentGiven'
39	: 'forgetConsentGiven', ],);
40	}
41
42	const handleConsent = (accept: null\|boolean,) => {	301✔
NEW 43	if (typeof accept === 'boolean') {	×
NEW 44	const elements = document	×
45	.getElementById('consent-choices',)
46	?.getElementsByTagName('input',);
NEW 47	for (let i = 0; i < (elements?.length ?? EMPTY); i ++) {	×
NEW 48	const element = elements?.item(i,);	×
NEW 49	if (element) {	×
NEW 50	element.checked = accept;	×
51	}
52	}
NEW 53	accept = null;	×
54	}
NEW 55	for (const type of types) {	×
NEW 56	const allow = document	×
57	.getElementById(type + '-consent',)
58	// eslint-disable-next-line @typescript-eslint/ban-ts-comment
59	// @ts-expect-error
60	?.checked;
NEW 61	set(type, allow);	×
62	}
63	//@ts-expect-error _paq can be null
NEW 64	window?._paq?.push([ get('tracking',)	×
65	? 'rememberConsentGiven'
66	: 'forgetConsentGiven', ],);
UNCOV 67	setConsentWasClosed(true,);	×
68	};
69
70	const visible = ! consentWasClosed && ! localStorage.getItem('consent',);	301✔
71
72	if (! visible) {	301!
UNCOV 73	const forget = () => {	×
74	localStorage.setItem('consent', '',);	×
75	setConsentWasClosed(false,);	×
76	};
UNCOV 77	return <button onClick={forget}>	×
78	<Lang lnkey={'cookie-consent.open'}/>
79	</button>;
80	}
81
82	return createPortal(<div className={'cookie-consent'}>	301✔
83	<div className={'cookie-consent-description'}>
84	<h2 className={'cookie-title'}>
85	<Lang lnkey={'cookie-consent.title'} />
86	</h2>
87	<p className={'cookie-description'}>
88	<Lang lnkey={'cookie-consent.description'} />
89	</p>
90	</div>
91	<ul id={'consent-choices'}>
92	<CookieConsentService>tracking</CookieConsentService>
93	<CookieConsentService>youtube</CookieConsentService>
94	</ul>
95	<div className={'cookie-consent-buttons'}>
96	<button
UNCOV 97	onClick={() => handleConsent(true,)}	×
98	className={'cookie-consent-accept-button'}
99	>
100	<Lang lnkey={'cookie-consent.accept'}/>
101	</button>
102	<button
NEW 103	onClick={() => handleConsent(null,)}	×
104	className={'cookie-consent-custom-button'}
105	>
106	<Lang lnkey={'cookie-consent.custom'}/>
107	</button>
108	<button
UNCOV 109	onClick={() => handleConsent(false,)}	×
110	className={'cookie-consent-decline-button'}
111	>
112	<Lang lnkey={'cookie-consent.decline'}/>
113	</button>
114	</div>
115	</div>, document.body,);
116	};
117		1✔
118	export default CookieConsent;	1✔

Idrinth / api-bench / 8582868223

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous