e2e: add pre-request with magic link (#760)

Author: avine

client/e2e/pages/pre-request-feedback-email.page.ts

@@ -0,0 +1,28 @@
+import { expect, Page } from '@playwright/test';
+import { Persona } from './sign-in.page';
+
+export class PreRequestFeedbackEmailPage {
+  constructor(private page: Page) {}
+
+  async goto(magicLink: string) {
+    expect(magicLink).toMatch(/\/fr\/pre-request\/token\//);
+
+    await this.page.goto(magicLink);
+  }
+
+  async checkDetails(receiverEmail: Persona, message?: string) {
+    await expect(this.page.getByText(receiverEmail)).toBeVisible();
+
+    if (message) {
+      await expect(this.page.getByText(message)).toBeVisible();
+    }
+  }
+
+  async submitEmail(giverEmail: Persona) {
+    await this.page.getByRole('textbox', { name: 'Votre email' }).fill(giverEmail);
+    await this.page.getByRole('button', { name: 'Valider' }).click();
+
+    await this.page.waitForURL('/fr/pre-request/success');
+    await expect(this.page.getByText(giverEmail)).toBeVisible();
+  }
+}

client/e2e/pages/pre-request-feedback-token.page.ts

@@ -0,0 +1,37 @@
+import { expect, Page } from '@playwright/test';
+
+export class PreRequestFeedbackTokenPage {
+  constructor(private page: Page) {}
+
+  async goto() {
+    await this.page.goto('/fr/request');
+
+    await this.page.getByRole('radio', { name: 'Avec un lien magique' }).check();
+    await expect(this.page.getByText('Emails de vos collègues')).toBeDisabled();
+  }
+
+  async generate(message = '') {
+    if (message) {
+      await this.page.getByRole('textbox', { name: 'Message' }).fill(message);
+    }
+    await this.page.getByRole('button', { name: 'Générer' }).click();
+
+    await this.page.waitForURL('/fr/request/success');
+  }
+
+  async getMagicLink(): Promise<string> {
+    await this.page.context().grantPermissions(['clipboard-read', 'clipboard-write']);
+
+    await this.page.getByRole('button', { name: 'Lien magique' }).click();
+
+    await expect(this.page.getByText('Copié dans le presse-papier !')).toBeVisible();
+
+    return await this.page.evaluate(() => navigator.clipboard.readText());
+  }
+
+  async gotoGenerateAndGetMagicLink(message = ''): Promise<string> {
+    await this.goto();
+    await this.generate(message);
+    return await this.getMagicLink();
+  }
+}

client/e2e/pages/request-feedback.page.ts

@@ -14,8 +14,7 @@ export class RequestFeedbackPage {
     await emailsField.press('Tab');
 
     if (message) {
-      const messageField = this.page.getByText('Message');
-      messageField.fill(message);
+      await this.page.getByRole('textbox', { name: 'Message' }).fill(message);
     }
 
     await this.page.getByRole('button', { name: 'Envoyer' }).click();

client/e2e/pre-request-feedback.spec.ts

@@ -0,0 +1,45 @@
+import { expect, test } from '@playwright/test';
+import { FeedbackHistoryDetailsPage } from './pages/feedback-history-details.page';
+import { FeedbackHistoryPage } from './pages/feedback-history.page';
+import { FirestorePage } from './pages/firestore.page';
+import { PreRequestFeedbackEmailPage } from './pages/pre-request-feedback-email.page';
+import { PreRequestFeedbackTokenPage } from './pages/pre-request-feedback-token.page';
+import { Persona, SignInPage } from './pages/sign-in.page';
+import { UserMenuPage } from './pages/user-menu.page';
+
+const feedbackMessage = 'Quel est votre feedback ?';
+
+test.beforeEach(({ page }) => new FirestorePage(page).reset());
+
+test('Submit spontaneous feedback', async ({ page }) => {
+  // ====== Alfred generate magic link ======
+
+  await new SignInPage(page).gotoAndSignIn(Persona.Alfred);
+
+  const magicLink = await new PreRequestFeedbackTokenPage(page).gotoGenerateAndGetMagicLink(feedbackMessage);
+
+  await new UserMenuPage(page).signOut();
+
+  // ====== Bernard use magic link (not authenticated) ======
+
+  const preRequestEmail = new PreRequestFeedbackEmailPage(page);
+  await preRequestEmail.goto(magicLink);
+  await preRequestEmail.checkDetails(Persona.Alfred, feedbackMessage);
+  await preRequestEmail.submitEmail(Persona.Bernard);
+
+  // ====== Bernard checks the requested feedback (from Alfred) is ready to be replied ======
+
+  await new SignInPage(page).gotoAndSignIn(Persona.Bernard);
+
+  const bernardHistoryPage = new FeedbackHistoryPage(page);
+  await bernardHistoryPage.goto('receivedRequest');
+
+  const alfredDetailsLink = await bernardHistoryPage.findDetailsLink(Persona.Alfred);
+  await expect(
+    alfredDetailsLink,
+    'Feedback receiver should be visible in the page "Répondre aux demandes de feedZback"',
+  ).toBeVisible();
+  await alfredDetailsLink.click();
+
+  await new FeedbackHistoryDetailsPage(page).matchPending('receivedRequest', Persona.Alfred, feedbackMessage);
+});