Feedback "context" field: add docs and e2e-specs (#730)

* docs: add "context" field

* e2e: add "context" field

client/e2e/pages/feedback-history-details.page.ts

@@ -3,6 +3,7 @@ import { Persona } from './sign-in.page';
 
 type Details = {
   message?: string; // note: there's no message for spontaneous feedback
+  context: string;
   positive: string;
   negative: string;
   comment: string;
@@ -44,6 +45,7 @@ export class FeedbackHistoryDetailsPage {
     if (details.message) {
       await expect(this.page.getByText(details.message), 'Feedback "message" should be visible').toBeVisible();
     }
+    await expect(this.page.getByText(details.context), 'Feedback "context" should be visible').toBeVisible();
     await expect(this.page.getByText(details.positive), 'Feedback "positive" should be visible').toBeVisible();
     await expect(this.page.getByText(details.negative), 'Feedback "negative" should be visible').toBeVisible();
     await expect(this.page.getByText(details.comment), 'Feedback "comment" should be visible').toBeVisible();

client/e2e/pages/give-requested-feedback.page.ts

@@ -3,6 +3,7 @@ import { Persona } from './sign-in.page';
 
 type Details = {
   message: string;
+  context: string;
   positive: string;
   negative: string;
   comment: string;
@@ -19,6 +20,7 @@ export class GiveRequestedFeedbackPage {
       'Feedback receiver should be filled in correctly',
     ).toHaveValue(persona);
 
+    await this.page.getByText('Contexte').fill(details.context);
     await this.page.getByText('Points forts').fill(details.positive);
     await this.page.getByText("Axes d'améliorations").fill(details.negative);
     await this.page.getByText('Commentaire').fill(details.comment);

client/e2e/pages/give-spontaneous-feedback.page.ts

@@ -2,6 +2,7 @@ import { Page } from '@playwright/test';
 import { Persona } from './sign-in.page';
 
 type Details = {
+  context: string;
   positive: string;
   negative: string;
   comment: string;
@@ -17,6 +18,7 @@ export class GiveSpontaneousFeedbackPage {
   async give(persona: Persona, details: Details) {
     await this.page.getByLabel('Email de votre collègue').fill(persona);
 
+    await this.page.getByText('Contexte').fill(details.context);
     await this.page.getByText('Points forts').fill(details.positive);
     await this.page.getByText("Axes d'améliorations").fill(details.negative);
     await this.page.getByText('Commentaire').fill(details.comment);

client/e2e/pages/manager.page.ts

@@ -3,6 +3,7 @@ import { Persona } from './sign-in.page';
 
 type Details = {
   message?: string; // note: there's no message for spontaneous feedback
+  context: string;
   positive: string;
   negative: string;
   comment: string;
@@ -59,6 +60,7 @@ export class ManagerPage {
     if (details.message) {
       await expect(this.page.getByText(details.message), 'Feedback "message" should be visible').toBeVisible();
     }
+    await expect(this.page.getByText(details.context), 'Feedback "context" should be visible').toBeVisible();
     await expect(this.page.getByText(details.positive), 'Feedback "positive" should be visible').toBeVisible();
     await expect(this.page.getByText(details.negative), 'Feedback "negative" should be visible').toBeVisible();
     await expect(this.page.getByText(details.comment), 'Feedback "comment" should be visible').toBeVisible();

client/e2e/requested-feedback.spec.ts

@@ -11,6 +11,7 @@ import { UserMenuPage } from './pages/user-menu.page';
 
 const feedbackDetails = {
   message: 'Quel est votre feedback ?',
+  context: 'On a travaillé ensemble',
   positive: 'Ok',
   negative: 'Ko',
   comment: 'R.A.S',

client/e2e/spontaneous-feedback.spec.ts

@@ -9,6 +9,7 @@ import { Persona, SignInPage } from './pages/sign-in.page';
 import { UserMenuPage } from './pages/user-menu.page';
 
 const feedbackDetails = {
+  context: 'On a travaillé ensemble',
   positive: 'Ok',
   negative: 'Ko',
   comment: 'R.A.S',

client/package.json

@@ -29,6 +29,7 @@
     "server:e2e": "npm --prefix ../server run start:e2e",
     "prestack:e2e": "npm run build:e2e",
     "stack:e2e": "concurrently \"npm run firebase:e2e\" \"npm run server:e2e\"",
+    "e2e:install": "playwright install",
     "e2e:test": "playwright test",
     "e2e:report": "playwright show-report",
     "e2e:ui": "playwright test --ui",

docs-source/docs/business-cases/feedback-draft.md

@@ -26,6 +26,7 @@ const feedbackRequestDraft: FeedbackRequestDraft = {
 
   // ----------------------------
   // The relevant data start here
+  context: '', // Might be empty...
   positive: 'You did great...', // Might be empty because its just a draft
   negative: '', // Might be empty...
   comment: '', // Might be empty...
@@ -46,6 +47,7 @@ const feedbackDraft: FeedbackDraft = {
 
   // ----------------------------
   // The relevant data start here
+  context: '', // Might be empty...
   positive: 'You did great...', // Might be empty because its just a draft
   negative: '', // Might be empty...
   comment: '', // Might be empty...

docs-source/docs/business-cases/give-spontaneous-feedback.md

@@ -23,9 +23,10 @@ const feedback: Feedback = {
 
   // --------------------------------------
   // In reality, the contents are encrypted
-  positive: 'You did great...',
-  negative: 'Youd should improve...',
-  comment: 'See you...',
+  context: 'Working together...', // optional
+  positive: 'You did great...', // required
+  negative: 'Youd should improve...', // required
+  comment: 'See you...', // optional
   // --------------------------------------
 
   message: '',

docs-source/docs/business-cases/reply-to-feedback-request.md

@@ -36,6 +36,7 @@ const feedback: Feedback = {
 
   // -----------------------------------------------------
   // Added fields (in reality, the contents are encrypted)
+  context: 'Working together...', // optional
   positive: 'You did great...', // required
   negative: 'Youd should improve...', // required
   comment: '', // optional

docs-source/package.json

@@ -20,7 +20,7 @@
     "@fontsource/nunito": "^5.1.0",
     "@mdx-js/react": "^3.1.0",
     "clsx": "^2.1.1",
-    "prism-react-renderer": "^2.4.0",
+    "prism-react-renderer": "^2.4.1",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "remark-deflist": "^1.0.0"

docs/404.html

@@ -5,8 +5,8 @@
 <meta name="generator" content="Docusaurus v3.6.3">
 <title data-rh="true">Page Not Found | FeedZback</title><meta data-rh="true" name="viewport" content="width=device-width,initial-scale=1"><meta data-rh="true" name="twitter:card" content="summary_large_image"><meta data-rh="true" property="og:url" content="https://feedzback.znk.io/feedzback/404.html"><meta data-rh="true" property="og:locale" content="en"><meta data-rh="true" name="docusaurus_locale" content="en"><meta data-rh="true" name="docusaurus_tag" content="default"><meta data-rh="true" name="docsearch:language" content="en"><meta data-rh="true" name="docsearch:docusaurus_tag" content="default"><meta data-rh="true" property="og:title" content="Page Not Found | FeedZback"><link data-rh="true" rel="icon" href="/feedzback/img/favicon.svg"><link data-rh="true" rel="canonical" href="https://feedzback.znk.io/feedzback/404.html"><link data-rh="true" rel="alternate" href="https://feedzback.znk.io/feedzback/404.html" hreflang="en"><link data-rh="true" rel="alternate" href="https://feedzback.znk.io/feedzback/404.html" hreflang="x-default"><link rel="alternate" type="application/rss+xml" href="/feedzback/blog/rss.xml" title="FeedZback RSS Feed">
 <link rel="alternate" type="application/atom+xml" href="/feedzback/blog/atom.xml" title="FeedZback Atom Feed"><link rel="stylesheet" href="/feedzback/assets/css/styles.1ccd00f9.css">
-<script src="/feedzback/assets/js/runtime~main.6af447a9.js" defer="defer"></script>
-<script src="/feedzback/assets/js/main.1583c06c.js" defer="defer"></script>
+<script src="/feedzback/assets/js/runtime~main.e90dca89.js" defer="defer"></script>
+<script src="/feedzback/assets/js/main.7ab6ca32.js" defer="defer"></script>
 </head>
 <body class="navigation-with-keyboard">
 <script>!function(){function t(t){document.documentElement.setAttribute("data-theme",t)}var e=function(){try{return new URLSearchParams(window.location.search).get("docusaurus-theme")}catch(t){}}()||function(){try{return window.localStorage.getItem("theme")}catch(t){}}();t(null!==e?e:"light")}(),function(){try{const n=new URLSearchParams(window.location.search).entries();for(var[t,e]of n)if(t.startsWith("docusaurus-data-")){var a=t.replace("docusaurus-data-","data-");document.documentElement.setAttribute(a,e)}}catch(t){}}()</script><div id="__docusaurus"><div role="region" aria-label="Skip to main content"><a class="skipToContent_fXgn" href="#__docusaurus_skipToContent_fallback">Skip to main content</a></div><nav aria-label="Main" class="navbar navbar--fixed-top"><div class="navbar__inner"><div class="navbar__items"><button aria-label="Toggle navigation bar" aria-expanded="false" class="navbar__toggle clean-btn" type="button"><svg width="30" height="30" viewBox="0 0 30 30" aria-hidden="true"><path stroke="currentColor" stroke-linecap="round" stroke-miterlimit="10" stroke-width="2" d="M4 7h22M4 15h22M4 23h22"></path></svg></button><a class="navbar__brand" href="/feedzback/"><div class="navbar__logo"><img src="/feedzback/img/logo.webp" alt="FeedZback Logo" class="themedComponent_mlkZ themedComponent--light_NVdE"><img src="/feedzback/img/logo.webp" alt="FeedZback Logo" class="themedComponent_mlkZ themedComponent--dark_xIcU"></div><b class="navbar__title text--truncate">FeedZback</b></a><a class="navbar__item navbar__link" href="/feedzback/docs/audience">Docs</a></div><div class="navbar__items navbar__items--right"><a href="https://feedzback.znk.io" target="_blank" rel="noopener noreferrer" class="navbar__item navbar__link">App<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_nPIU"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a><a href="https://github.com/Zenika/feedzback" target="_blank" rel="noopener noreferrer" class="navbar__item navbar__link">GitHub<svg width="13.5" height="13.5" aria-hidden="true" viewBox="0 0 24 24" class="iconExternalLink_nPIU"><path fill="currentColor" d="M21 13v10h-21v-19h12v2h-10v15h17v-8h2zm3-12h-10.988l4.035 4-6.977 7.07 2.828 2.828 6.977-7.07 4.125 4.172v-11z"></path></svg></a><div class="toggle_vylO colorModeToggle_DEke"><button class="clean-btn toggleButton_gllP toggleButtonDisabled_aARS" type="button" disabled="" title="Switch between dark and light mode (currently light mode)" aria-label="Switch between dark and light mode (currently light mode)" aria-live="polite" aria-pressed="false"><svg viewBox="0 0 24 24" width="24" height="24" class="lightToggleIcon_pyhR"><path fill="currentColor" d="M12,9c1.65,0,3,1.35,3,3s-1.35,3-3,3s-3-1.35-3-3S10.35,9,12,9 M12,7c-2.76,0-5,2.24-5,5s2.24,5,5,5s5-2.24,5-5 S14.76,7,12,7L12,7z M2,13l2,0c0.55,0,1-0.45,1-1s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S1.45,13,2,13z M20,13l2,0c0.55,0,1-0.45,1-1 s-0.45-1-1-1l-2,0c-0.55,0-1,0.45-1,1S19.45,13,20,13z M11,2v2c0,0.55,0.45,1,1,1s1-0.45,1-1V2c0-0.55-0.45-1-1-1S11,1.45,11,2z M11,20v2c0,0.55,0.45,1,1,1s1-0.45,1-1v-2c0-0.55-0.45-1-1-1C11.45,19,11,19.45,11,20z M5.99,4.58c-0.39-0.39-1.03-0.39-1.41,0 c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0s0.39-1.03,0-1.41L5.99,4.58z M18.36,16.95 c-0.39-0.39-1.03-0.39-1.41,0c-0.39,0.39-0.39,1.03,0,1.41l1.06,1.06c0.39,0.39,1.03,0.39,1.41,0c0.39-0.39,0.39-1.03,0-1.41 L18.36,16.95z M19.42,5.99c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06c-0.39,0.39-0.39,1.03,0,1.41 s1.03,0.39,1.41,0L19.42,5.99z M7.05,18.36c0.39-0.39,0.39-1.03,0-1.41c-0.39-0.39-1.03-0.39-1.41,0l-1.06,1.06 c-0.39,0.39-0.39,1.03,0,1.41s1.03,0.39,1.41,0L7.05,18.36z"></path></svg><svg viewBox="0 0 24 24" width="24" height="24" class="darkToggleIcon_wfgR"><path fill="currentColor" d="M9.37,5.51C9.19,6.15,9.1,6.82,9.1,7.5c0,4.08,3.32,7.4,7.4,7.4c0.68,0,1.35-0.09,1.99-0.27C17.45,17.19,14.93,19,12,19 c-3.86,0-7-3.14-7-7C5,9.07,6.81,6.55,9.37,5.51z M12,3c-4.97,0-9,4.03-9,9s4.03,9,9,9s9-4.03,9-9c0-0.46-0.04-0.92-0.1-1.36 c-0.98,1.37-2.58,2.26-4.4,2.26c-2.98,0-5.4-2.42-5.4-5.4c0-1.81,0.89-3.42,2.26-4.4C12.92,3.04,12.46,3,12,3L12,3z"></path></svg></button></div><div class="navbarSearchContainer_Bca1"></div></div></div><div role="presentation" class="navbar-sidebar__backdrop"></div></nav><div id="__docusaurus_skipToContent_fallback" class="main-wrapper mainWrapper_z2l0"><main class="container margin-vert--xl"><div class="row"><div class="col col--6 col--offset-3"><h1 class="hero__title">Page Not Found</h1><p>We could not find what you were looking for.</p><p>Please contact the owner of the site that linked you to the original URL and let them know their link is broken.</p></div></div></main></div><footer class="footer"><div class="container container-fluid"><div class="footer__bottom text--center"><div class="footer__copyright">Copyright © 2024 FeedZback.</div></div></div></footer></div>