Add same touched behavior as inputs for text editor

site/gatsby-site/playwright/e2e-full/submit.spec.ts

@@ -1056,6 +1056,40 @@ test.describe('The Submit form', () => {
         await expect(page.locator('text=Please review. Some data is missing.')).toBeVisible();
     });
 
+    test('Should display an error messages for each missing field on step 1', async ({ page }) => {
+
+        await page.goto(url);
+
+        const valuesStep1 = {
+          url: '',
+          title: '',
+          authors: '',
+          date_published: '',
+          incident_date: '',
+      };
+
+      for (const key in valuesStep1) {
+          await page.locator(`input[name="${key}"]`).fill(valuesStep1[key]);
+      }
+
+      await setEditorText(
+          page,
+          ''
+      );
+
+      await expect(page.locator('.form-has-errors')).toBeVisible();
+
+      await expect(page.locator('text=*URL required')).toBeVisible();
+
+      await expect(page.locator('text=*Title is required')).toBeVisible();
+
+      await expect(page.locator('text=*Author is required. Anonymous or the publication can be entered.')).toBeVisible();
+
+      await expect(page.locator('text=*Text is required')).toBeVisible();
+
+      await expect(page.locator('text=*Date published is required')).toBeVisible();
+    });
+
     test('Should submit a new report response', async ({ page }) => {
         const values = {
             url: 'https://incidentdatabase.ai',

site/gatsby-site/src/components/forms/SubmissionWizard/StepOne.js

@@ -42,21 +42,21 @@ const StepOne = (props) => {
       .nullable(),
     authors: yup
       .string()
+      .required('*Author is required. Anonymous or the publication can be entered.')
       .min(3, '*Authors must have at least 3 characters')
       .max(200, "*Authors can't be longer than 200 characters")
-      .required('*Author is required. Anonymous or the publication can be entered.')
       .nullable(),
     date_published: yup
       .string()
       .matches(dateRegExp, '*Date is not valid, must be `YYYY-MM-DD`')
-      .test(isPastDate)
       .required('*Date published is required')
+      .test(isPastDate)
       .nullable(),
     date_downloaded: yup
       .string()
       .matches(dateRegExp, '*Date is not valid, must be `YYYY-MM-DD`')
-      .test(isPastDate)
       .required('*Date downloaded required')
+      .test(isPastDate)
       .nullable(),
     url: yup
       .string()
@@ -333,6 +333,7 @@ const FormDetails = ({
               position: 'relative',
               ...styles,
             }}
+            onBlur={() => setFieldTouched('text', true)}
           >
             {touched['text'] && errors['text'] && (
               <div

site/gatsby-site/src/components/forms/Tags.js

@@ -14,6 +14,7 @@ export default function Tags({
   className,
   allowNew = true,
   stayOpen = false,
+  onBlur,
 }) {
   const [open, setOpen] = useState(false);
 
@@ -44,6 +45,9 @@ export default function Tags({
           commitTag(e.target.value);
         }
         setOpen(false);
+        if (onBlur) {
+          onBlur();
+        }
       }}
       multiple
       open={open && stayOpen ? true : undefined}

site/gatsby-site/src/components/forms/TagsControl.js

@@ -31,6 +31,7 @@ const TagsControl = ({
           handleChange(value);
         }
       }}
+      onBlur={() => setTouched(true)}
       {...{
         name,
         disabled,