test(e2e): add storage mode e2e tests

.github/workflows/playwright.yml

@@ -20,6 +20,7 @@ jobs:
       - name: Build
         env:
           NODE_OPTIONS: '--max-old-space-size=4096 --openssl-legacy-provider'
+          REACT_APP_FORMSG_SDK_MODE: 'test'
         run: npm run build
       - name: Run Playwright tests
         run: npx playwright test

__tests__/e2e/constants/field.ts

@@ -166,15 +166,15 @@ export const ALL_FIELDS: E2eFieldMetadata[] = [
   {
     title: 'Birthday',
     fieldType: BasicField.Date,
-    val: format(new Date(), DATE_INPUT_FORMAT),
+    val: format(new Date(952970366), DATE_INPUT_FORMAT),
     dateValidation: {
       customMinDate: null,
       customMaxDate: null,
       selectedDateValidation: null,
     },
   },
   {
-    title: 'Pi',
+    title: 'What is the value of pi?',
     fieldType: BasicField.Decimal,
     ValidationOptions: {
       customMin: null,
@@ -211,7 +211,7 @@ export const ALL_FIELDS: E2eFieldMetadata[] = [
     fieldType: BasicField.HomeNo,
     val: '61234567',
   },
-  // Hide for now, because it doesn't work unless we spin up localstack.
+  // TODO: Images don't work unless we spin up localstack.
   // {
   //   title: 'Image',
   //   fieldType: BasicField.Image,
@@ -271,7 +271,7 @@ export const ALL_FIELDS: E2eFieldMetadata[] = [
     fieldType: BasicField.Section,
   },
   {
-    title: 'Name',
+    title: 'Your name',
     fieldType: BasicField.ShortText,
     ValidationOptions: {
       selectedValidation: null,

__tests__/e2e/constants/form.ts

@@ -1,3 +1,5 @@
+import { FormResponseMode } from 'shared/types'
+
 import { E2eFieldMetadata } from './field'
 import { E2eLogic } from './logic'
 import { E2eSettingsOptions } from './settings'
@@ -7,3 +9,20 @@ export type E2eForm = {
   formLogics: E2eLogic[]
   formSettings: E2eSettingsOptions
 }
+
+interface E2eFormResponseModeBase {
+  responseMode: FormResponseMode
+}
+
+interface E2eFormResponseModeEmail extends E2eFormResponseModeBase {
+  responseMode: FormResponseMode.Email
+}
+
+interface E2eFormResponseModeEncrypt extends E2eFormResponseModeBase {
+  responseMode: FormResponseMode.Encrypt
+  secretKey: string
+}
+
+export type E2eFormResponseMode =
+  | E2eFormResponseModeEmail
+  | E2eFormResponseModeEncrypt

__tests__/e2e/constants/index.ts

@@ -2,5 +2,7 @@ export * from './field'
 export * from './form'
 export * from './links'
 export * from './logic'
+export * from './response'
 export * from './settings'
+export * from './tests'
 export * from './user'

__tests__/e2e/constants/links.ts

@@ -1,6 +1,21 @@
 export const ROOT_PAGE = `${process.env.APP_URL}`
 
 export const LOGIN_PAGE = `${ROOT_PAGE}/login`
+
 export const DASHBOARD_PAGE = `${ROOT_PAGE}/dashboard`
+
 export const ADMIN_FORM_PAGE_PREFIX = `${ROOT_PAGE}/admin/form`
-export const PUBLIC_FORM_PAGE_PREFIX = ROOT_PAGE
+export const ADMIN_FORM_PAGE_CREATE = (formId: string) =>
+  `${ADMIN_FORM_PAGE_PREFIX}/${formId}`
+export const ADMIN_FORM_PAGE_SETTINGS = (formId: string) =>
+  `${ADMIN_FORM_PAGE_CREATE(formId)}/settings`
+export const ADMIN_FORM_PAGE_RESPONSES = (formId: string) =>
+  `${ADMIN_FORM_PAGE_CREATE(formId)}/results`
+export const ADMIN_FORM_PAGE_RESPONSES_INDIVIDUAL = (
+  formId: string,
+  responseId: string,
+) => `${ADMIN_FORM_PAGE_CREATE(formId)}/results/${responseId}`
+
+const PUBLIC_FORM_PAGE_PREFIX = ROOT_PAGE
+export const PUBLIC_FORM_PAGE = (formId: string) =>
+  `${PUBLIC_FORM_PAGE_PREFIX}/${formId}`

__tests__/e2e/constants/response.ts

@@ -0,0 +1,16 @@
+import { FormResponseMode } from 'shared/types'
+
+interface FormResponseViewBase {
+  mode: FormResponseMode
+}
+
+interface FormResponseViewEmail extends FormResponseViewBase {
+  mode: FormResponseMode.Email
+}
+
+interface FormResponseViewEncrypt extends FormResponseViewBase {
+  mode: FormResponseMode.Encrypt
+  csv: boolean
+}
+
+export type FormResponseView = FormResponseViewEmail | FormResponseViewEncrypt

__tests__/e2e/constants/tests.ts

@@ -0,0 +1,152 @@
+import { BasicField, LogicConditionState, LogicType } from 'shared/types'
+
+import { ALL_FIELDS, E2eFieldMetadata } from './field'
+import { E2eLogic } from './logic'
+
+type E2eTestFormDefinition = {
+  formFields: E2eFieldMetadata[]
+  formLogics: E2eLogic[]
+}
+
+/**
+ * Test where all fields are shown based on a single field logic
+ */
+const TEST_ALL_FIELDS_SHOWN_BY_LOGIC_FORMFIELDS: E2eFieldMetadata[] = [
+  {
+    title: 'Do you want to hide the fields?',
+    fieldType: BasicField.YesNo,
+    val: 'No',
+  },
+  // TODO: Attachment fields don't work on storage mode unless we spin up localstack.
+  ...ALL_FIELDS.filter((field) => field.fieldType !== BasicField.Attachment),
+]
+export const TEST_ALL_FIELDS_SHOWN_BY_LOGIC: E2eTestFormDefinition = {
+  formFields: TEST_ALL_FIELDS_SHOWN_BY_LOGIC_FORMFIELDS,
+  formLogics: [
+    // Single logic block: if "yes", show the fields.
+    {
+      conditions: [
+        {
+          field: 0,
+          state: LogicConditionState.Equal,
+          value: 'No',
+        },
+      ],
+      logicType: LogicType.ShowFields,
+      show: Array.from(
+        TEST_ALL_FIELDS_SHOWN_BY_LOGIC_FORMFIELDS,
+        (_, i) => i,
+      ).slice(1),
+    },
+  ],
+}
+
+/**
+ * Test where a field is hidden based on a single field logic
+ */
+const TEST_FIELD_HIDDEN_BY_LOGIC_FORMFIELDS: E2eFieldMetadata[] = [
+  {
+    title: 'Do you want to show the fields?',
+    fieldType: BasicField.YesNo,
+    val: 'No',
+  },
+  {
+    title: 'This field should be hidden',
+    fieldType: BasicField.ShortText,
+    ValidationOptions: {
+      selectedValidation: null,
+      customVal: null,
+    },
+    val: '',
+    hidden: true,
+  },
+]
+export const TEST_FIELD_HIDDEN_BY_LOGIC: E2eTestFormDefinition = {
+  formFields: TEST_FIELD_HIDDEN_BY_LOGIC_FORMFIELDS,
+  formLogics: [
+    // Single logic block: if "yes", show the fields.
+    {
+      conditions: [
+        {
+          field: 0,
+          state: LogicConditionState.Equal,
+          value: 'Yes',
+        },
+      ],
+      logicType: LogicType.ShowFields,
+      show: Array.from(
+        TEST_FIELD_HIDDEN_BY_LOGIC_FORMFIELDS,
+        (_, i) => i,
+      ).slice(1),
+    },
+  ],
+}
+
+/**
+ * Test where submission is disabled via chained logic
+ */
+const TEST_SUBMISSION_DISABLED_BY_CHAINED_LOGIC_MESSAGE = 'You shall not pass!'
+const TEST_SUBMISSION_DISABLED_BY_CHAINED_LOGIC_FORMFIELDS: E2eFieldMetadata[] =
+  [
+    {
+      title: 'Enter a number at least 10',
+      fieldType: BasicField.Number,
+      ValidationOptions: {
+        selectedValidation: null,
+        customVal: null,
+      },
+      val: '10',
+    },
+    {
+      title: 'Favorite food',
+      fieldType: BasicField.Dropdown,
+      fieldOptions: ['Rice', 'Chocolate', 'Ice-Cream'],
+      val: 'Chocolate',
+    },
+    {
+      title: 'Do you want to submit this form?',
+      fieldType: BasicField.YesNo,
+      val: 'Yes',
+    },
+  ]
+export const TEST_SUBMISSION_DISABLED_BY_CHAINED_LOGIC: E2eTestFormDefinition & {
+  preventSubmitMessage: string
+} = {
+  formFields: TEST_SUBMISSION_DISABLED_BY_CHAINED_LOGIC_FORMFIELDS,
+  formLogics: [
+    {
+      conditions: [
+        {
+          field: 0,
+          state: LogicConditionState.Gte,
+          value: '10',
+        },
+      ],
+      logicType: LogicType.ShowFields,
+      show: [1],
+    },
+    {
+      conditions: [
+        {
+          field: 1,
+          state: LogicConditionState.Either,
+          value: ['Rice', 'Chocolate'],
+        },
+      ],
+      logicType: LogicType.ShowFields,
+      show: [2],
+    },
+    {
+      conditions: [
+        {
+          field: 2,
+          state: LogicConditionState.Equal,
+          value: 'Yes',
+        },
+      ],
+      logicType: LogicType.PreventSubmit,
+      message: TEST_SUBMISSION_DISABLED_BY_CHAINED_LOGIC_MESSAGE,
+    },
+  ],
+  preventSubmitMessage: TEST_SUBMISSION_DISABLED_BY_CHAINED_LOGIC_MESSAGE,
+}