CCM-9142: Restore preview letters UI component test

Author: m-salaudeen

tests/test-team/template-mgmt-component-tests/letter/template-mgmt-preview-letter-page.component.spec.ts

@@ -0,0 +1,112 @@
+import { test, expect } from '@playwright/test';
+import { TemplateStorageHelper } from '../../helpers/db/template-storage-helper';
+import { TemplateFactory } from '../../helpers/factories/template-factory';
+import {
+  assertBackToAllTemplatesBottomLink,
+  assertBackToAllTemplatesTopLink,
+} from '../template-mgmt-preview-common.steps';
+import {
+  assertFooterLinks,
+  assertSignOutLink,
+  assertNotifyBannerLink,
+  assertSkipToMainContent,
+} from '../template-mgmt-common.steps';
+import { Template } from '../../helpers/types';
+import {
+  createAuthHelper,
+  TestUserId,
+} from '../../helpers/auth/cognito-auth-helper';
+import { TemplateMgmtPreviewLetterPage } from '../../pages/letter/template-mgmt-preview-letter-page';
+
+async function createTemplates() {
+  const user = await createAuthHelper().getTestUser(TestUserId.User1);
+  return {
+    empty: {
+      id: 'preview-page-invalid-letter-template',
+      version: 1,
+      createdAt: new Date().toISOString(),
+      updatedAt: new Date().toISOString(),
+      templateType: 'LETTER',
+      templateStatus: 'NOT_YET_SUBMITTED',
+      owner: user.userId,
+    } as Template,
+    valid: TemplateFactory.createLetterTemplate(
+      'valid-letter-preview-template',
+      user.userId,
+      'test-template-letter'
+    ),
+  };
+}
+
+test.describe('Preview Letter template Page', () => {
+  let templates: { empty: Template; valid: Template };
+
+  const templateStorageHelper = new TemplateStorageHelper();
+
+  test.beforeAll(async () => {
+    templates = await createTemplates();
+    await templateStorageHelper.seedTemplateData(Object.values(templates));
+  });
+
+  test.afterAll(async () => {
+    await templateStorageHelper.deleteSeededTemplates();
+  });
+
+  test('when user visits page, then page is loaded', async ({
+    page,
+    baseURL,
+  }) => {
+    const previewLetterTemplatePage = new TemplateMgmtPreviewLetterPage(page);
+
+    await previewLetterTemplatePage.loadPage(templates.valid.id);
+
+    await expect(page).toHaveURL(
+      `${baseURL}/templates/${TemplateMgmtPreviewLetterPage.pageUrlSegment}/${templates.valid.id}`
+    );
+
+    await expect(previewLetterTemplatePage.pageHeader).toContainText(
+      'test-template-letter'
+    );
+  });
+
+  test.describe('Page functionality', () => {
+    test('common page tests', async ({ page, baseURL }) => {
+      const props = {
+        page: new TemplateMgmtPreviewLetterPage(page),
+        id: templates.valid.id,
+        baseURL,
+      };
+
+      await assertSkipToMainContent(props);
+      await assertNotifyBannerLink(props);
+      await assertSignOutLink(props);
+      await assertFooterLinks(props);
+      await assertBackToAllTemplatesTopLink(props);
+      await assertBackToAllTemplatesBottomLink(props);
+    });
+  });
+
+  test.describe('Error handling', () => {
+    test('when user visits page with missing data, then an invalid template error is displayed', async ({
+      baseURL,
+      page,
+    }) => {
+      const previewLetterTemplatePage = new TemplateMgmtPreviewLetterPage(page);
+
+      await previewLetterTemplatePage.loadPage(templates.empty.id);
+
+      await expect(page).toHaveURL(`${baseURL}/templates/invalid-template`);
+    });
+
+    test('when user visits page with a fake template, then an invalid template error is displayed', async ({
+      baseURL,
+      page,
+    }) => {
+      const previewLetterTemplatePage = new TemplateMgmtPreviewLetterPage(page);
+
+      await previewLetterTemplatePage.loadPage('/fake-template-id');
+
+      await expect(page).toHaveURL(`${baseURL}/templates/invalid-template`);
+    });
+  });
+});