test: add e2e automated tests

example/components/About.tsx

@@ -18,7 +18,7 @@ export const About: React.FC = () => {
         </Link>
       </h2>
 
-      <p className='max-w-lg mt-6 text-base'>
+      <p className='max-w-lg mt-6 text-base' data-cy='main-description'>
         <Translation
           i18nKey='common:about'
           components={[<TextSpecial key='special' />]}

example/components/FormExample.tsx

@@ -22,7 +22,7 @@ export const FormExample: React.FC = () => {
     formData,
     formElement
   ) => {
-    await simulateServerRequest(4000)
+    await simulateServerRequest(2000)
     console.log('onSubmit:', formData)
     formElement.reset()
     return {
@@ -54,7 +54,7 @@ export const FormExample: React.FC = () => {
           error={getFirstErrorTranslation(errors.email)}
         />
 
-        <Button className='mt-6 w-full' type='submit'>
+        <Button className='mt-6 w-full' type='submit' data-cy='submit'>
           Submit
         </Button>
       </Form>

example/components/design/Input.tsx

@@ -24,8 +24,13 @@ export const Input: React.FC<InputProps> = (props) => {
           {...rest}
           id={name}
           name={name}
+          data-cy={`input-${name}`}
+        />
+        <FormState
+          id={`error-${name ?? 'input'}`}
+          state={error == null ? 'idle' : 'error'}
+          message={error}
         />
-        <FormState state={error == null ? 'idle' : 'error'} message={error} />
       </div>
     </div>
   )