Add e2e testing for user invitation

This commit adds e2e testing for the user invitation process in the app. It introduces data-test attributes to key components in the invitation flow, assisting in test case creation. Newly created tests validate user invitation functionality including form filling, role selection, and submission.

packages/features/team-accounts/src/components/members/invite-members-dialog-container.tsx

@@ -133,7 +133,7 @@ function InviteMembersForm({
             const roleInputName = `invitations.${index}.role` as const;
 
             return (
-              <div key={field.id}>
+              <div data-test={'invite-member-form-item'} key={field.id}>
                 <div className={'flex items-end space-x-0.5 md:space-x-2'}>
                   <div className={'w-7/12'}>
                     <FormField
@@ -216,7 +216,7 @@ function InviteMembersForm({
 
           <div>
             <Button
-              data-test={'append-new-invite-button'}
+              data-test={'add-new-invite-button'}
               type={'button'}
               variant={'link'}
               size={'sm'}
@@ -234,7 +234,7 @@ function InviteMembersForm({
           </div>
         </div>
 
-        <Button disabled={pending}>
+        <Button type={'submit'} disabled={pending}>
           <Trans
             i18nKey={
               pending

packages/features/team-accounts/src/components/members/membership-role-selector.tsx

@@ -26,7 +26,7 @@ export const MembershipRoleSelector: React.FC<{
           return (
             <SelectItem
               key={role}
-              data-test={`role-item-${role}`}
+              data-test={`role-option-${role}`}
               disabled={currentUserRole === role}
               value={role}
             >