test(frontend):Added render test CookieConsent

packages/code-du-travail-frontend/src/common/__tests__/CookieConsent.test.js

@@ -0,0 +1,10 @@
+import React from "react";
+import { render } from "@testing-library/react";
+import CookieConsent from "../CookieConsent";
+
+describe("<CookieConsent />", () => {
+  it("should render", () => {
+    const { container } = render(<CookieConsent />);
+    expect(container).toMatchSnapshot();
+  });
+});

packages/code-du-travail-frontend/src/common/__tests__/__snapshots__/CookieConsent.test.js.snap

@@ -0,0 +1,209 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<CookieConsent /> should render 1`] = `
+.c6 {
+  display: inline-block;
+  padding: 0.625rem 1.5rem;
+  font-weight: 600;
+  font-size: 1rem;
+  line-height: inherit;
+  text-align: center;
+  vertical-align: middle;
+  border: 1px solid;
+  border-radius: 1.5rem;
+  cursor: pointer;
+  -webkit-transition: background-color 250ms ease;
+  transition: background-color 250ms ease;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  padding: 1rem;
+  color: #434956;
+  line-height: 0;
+  background-color: transparent;
+  border: none;
+}
+
+.c6:hover {
+  color: #8c94a6;
+}
+
+.c1 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-pack: justify;
+  -webkit-justify-content: space-between;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+  box-sizing: border-box;
+  width: 100%;
+  min-height: 48px;
+  color: #434956;
+  background-color: #fff;
+  border-color: #e5f1fe;
+  border-style: solid;
+  border-width: 1px;
+  border-radius: 0.25rem;
+  box-shadow: 0 5px 10px 0 #ebeff3;
+  -webkit-animation: iowhYu 300ms ease-out;
+  animation: iowhYu 300ms ease-out;
+}
+
+.c2 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  padding: 1rem;
+  background-color: #e5f1fe;
+}
+
+.c3 {
+  -webkit-box-flex: 1;
+  -webkit-flex-grow: 1;
+  -ms-flex-positive: 1;
+  flex-grow: 1;
+  -webkit-align-self: center;
+  -ms-flex-item-align: center;
+  align-self: center;
+  padding: 1rem;
+  color: #434956;
+  text-align: left;
+}
+
+.c5 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-align-items: flex-start;
+  -webkit-box-align: flex-start;
+  -ms-flex-align: flex-start;
+  align-items: flex-start;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+}
+
+.c0 {
+  position: fixed;
+  bottom: 0;
+  padding: 1rem;
+  width: 100%;
+  z-index: 1000;
+}
+
+.c4 {
+  padding: 0 0.25rem;
+}
+
+<div>
+  <div
+    class="c0"
+  >
+    <div
+      class="c1"
+    >
+      <div
+        class="c2"
+      >
+        <svg
+          fill="none"
+          height="24"
+          stroke="currentColor"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+          viewBox="0 0 24 24"
+          width="24"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <circle
+            cx="12"
+            cy="12"
+            r="10"
+          />
+          <line
+            x1="12"
+            x2="12"
+            y1="16"
+            y2="12"
+          />
+          <line
+            x1="12"
+            x2="12"
+            y1="8"
+            y2="8"
+          />
+        </svg>
+      </div>
+      <div
+        class="c3"
+        role="alert"
+      >
+        En poursuivant votre navigation sur ce site, vous acceptez l’utilisation de cookies pour établir des mesures de fréquentation et d’utilisation du site.
+        <a
+          class="c4"
+          href="http://master.code-du-travail-numerique.dev.factory.social.gouv.fr/mentions-legales"
+          rel="noopener noreferrer"
+          title="Mentions legales"
+        >
+          En savoir plus
+        </a>
+      </div>
+      <div
+        class="c5"
+      >
+        <button
+          aria-label="Fermer"
+          class="c6"
+        >
+          <svg
+            fill="none"
+            height="24"
+            stroke="currentColor"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            stroke-width="2"
+            viewBox="0 0 24 24"
+            width="24"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <line
+              x1="18"
+              x2="6"
+              y1="6"
+              y2="18"
+            />
+            <line
+              x1="6"
+              x2="18"
+              y1="6"
+              y2="18"
+            />
+          </svg>
+        </button>
+      </div>
+    </div>
+  </div>
+</div>
+`;