mirror of
https://github.com/lordmathis/lemma.git
synced 2025-11-06 07:54:22 +00:00
Add data-testid attributes for improved testing in modals
This commit is contained in:
@@ -39,12 +39,17 @@ const DeleteAccountModal: React.FC<DeleteAccountModalProps> = ({
|
|||||||
<PasswordInput
|
<PasswordInput
|
||||||
label="Current Password"
|
label="Current Password"
|
||||||
placeholder="Enter your current password"
|
placeholder="Enter your current password"
|
||||||
|
data-testid="delete-account-password-input"
|
||||||
value={password}
|
value={password}
|
||||||
onChange={(e) => setPassword(e.currentTarget.value)}
|
onChange={(e) => setPassword(e.currentTarget.value)}
|
||||||
required
|
required
|
||||||
/>
|
/>
|
||||||
<Group justify="flex-end" mt="md">
|
<Group justify="flex-end" mt="md">
|
||||||
<Button variant="default" onClick={onClose}>
|
<Button
|
||||||
|
variant="default"
|
||||||
|
onClick={onClose}
|
||||||
|
data-testid="cancel-delete-button"
|
||||||
|
>
|
||||||
Cancel
|
Cancel
|
||||||
</Button>
|
</Button>
|
||||||
<Button
|
<Button
|
||||||
@@ -53,6 +58,7 @@ const DeleteAccountModal: React.FC<DeleteAccountModalProps> = ({
|
|||||||
void onConfirm(password);
|
void onConfirm(password);
|
||||||
setPassword('');
|
setPassword('');
|
||||||
}}
|
}}
|
||||||
|
data-testid="confirm-delete-button"
|
||||||
>
|
>
|
||||||
Delete Account
|
Delete Account
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
@@ -38,12 +38,17 @@ const EmailPasswordModal: React.FC<EmailPasswordModalProps> = ({
|
|||||||
<PasswordInput
|
<PasswordInput
|
||||||
label="Current Password"
|
label="Current Password"
|
||||||
placeholder="Enter your current password"
|
placeholder="Enter your current password"
|
||||||
|
data-testid="email-password-input"
|
||||||
value={password}
|
value={password}
|
||||||
onChange={(e) => setPassword(e.currentTarget.value)}
|
onChange={(e) => setPassword(e.currentTarget.value)}
|
||||||
required
|
required
|
||||||
/>
|
/>
|
||||||
<Group justify="flex-end" mt="md">
|
<Group justify="flex-end" mt="md">
|
||||||
<Button variant="default" onClick={onClose}>
|
<Button
|
||||||
|
variant="default"
|
||||||
|
onClick={onClose}
|
||||||
|
data-testid="cancel-email-password-button"
|
||||||
|
>
|
||||||
Cancel
|
Cancel
|
||||||
</Button>
|
</Button>
|
||||||
<Button
|
<Button
|
||||||
@@ -51,6 +56,7 @@ const EmailPasswordModal: React.FC<EmailPasswordModalProps> = ({
|
|||||||
void onConfirm(password);
|
void onConfirm(password);
|
||||||
setPassword('');
|
setPassword('');
|
||||||
}}
|
}}
|
||||||
|
data-testid="confirm-email-password-button"
|
||||||
>
|
>
|
||||||
Confirm
|
Confirm
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
@@ -54,12 +54,14 @@ const CreateUserModal: React.FC<CreateUserModalProps> = ({
|
|||||||
label="Email"
|
label="Email"
|
||||||
required
|
required
|
||||||
value={email}
|
value={email}
|
||||||
|
data-testid="create-user-email-input"
|
||||||
onChange={(e) => setEmail(e.currentTarget.value)}
|
onChange={(e) => setEmail(e.currentTarget.value)}
|
||||||
placeholder="user@example.com"
|
placeholder="user@example.com"
|
||||||
/>
|
/>
|
||||||
<TextInput
|
<TextInput
|
||||||
label="Display Name"
|
label="Display Name"
|
||||||
value={displayName}
|
value={displayName}
|
||||||
|
data-testid="create-user-display-name-input"
|
||||||
onChange={(e) => setDisplayName(e.currentTarget.value)}
|
onChange={(e) => setDisplayName(e.currentTarget.value)}
|
||||||
placeholder="John Doe"
|
placeholder="John Doe"
|
||||||
/>
|
/>
|
||||||
@@ -67,6 +69,7 @@ const CreateUserModal: React.FC<CreateUserModalProps> = ({
|
|||||||
label="Password"
|
label="Password"
|
||||||
required
|
required
|
||||||
value={password}
|
value={password}
|
||||||
|
data-testid="create-user-password-input"
|
||||||
onChange={(e) => setPassword(e.currentTarget.value)}
|
onChange={(e) => setPassword(e.currentTarget.value)}
|
||||||
placeholder="Enter password"
|
placeholder="Enter password"
|
||||||
/>
|
/>
|
||||||
@@ -74,6 +77,7 @@ const CreateUserModal: React.FC<CreateUserModalProps> = ({
|
|||||||
label="Role"
|
label="Role"
|
||||||
required
|
required
|
||||||
value={role}
|
value={role}
|
||||||
|
data-testid="create-user-role-select"
|
||||||
onChange={(value) => value && setRole(value as UserRole)}
|
onChange={(value) => value && setRole(value as UserRole)}
|
||||||
data={[
|
data={[
|
||||||
{ value: UserRole.Admin, label: 'Admin' },
|
{ value: UserRole.Admin, label: 'Admin' },
|
||||||
@@ -82,10 +86,18 @@ const CreateUserModal: React.FC<CreateUserModalProps> = ({
|
|||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
<Group justify="flex-end" mt="md">
|
<Group justify="flex-end" mt="md">
|
||||||
<Button variant="default" onClick={onClose}>
|
<Button
|
||||||
|
variant="default"
|
||||||
|
onClick={onClose}
|
||||||
|
data-testid="cancel-create-user-button"
|
||||||
|
>
|
||||||
Cancel
|
Cancel
|
||||||
</Button>
|
</Button>
|
||||||
<Button onClick={() => void handleSubmit} loading={loading}>
|
<Button
|
||||||
|
onClick={() => void handleSubmit}
|
||||||
|
loading={loading}
|
||||||
|
data-testid="confirm-create-user-button"
|
||||||
|
>
|
||||||
Create User
|
Create User
|
||||||
</Button>
|
</Button>
|
||||||
</Group>
|
</Group>
|
||||||
|
|||||||
@@ -31,10 +31,19 @@ const DeleteUserModal: React.FC<DeleteUserModalProps> = ({
|
|||||||
deleted.
|
deleted.
|
||||||
</Text>
|
</Text>
|
||||||
<Group justify="flex-end" mt="xl">
|
<Group justify="flex-end" mt="xl">
|
||||||
<Button variant="default" onClick={onClose}>
|
<Button
|
||||||
|
variant="default"
|
||||||
|
onClick={onClose}
|
||||||
|
data-testid="cancel-delete-user-button"
|
||||||
|
>
|
||||||
Cancel
|
Cancel
|
||||||
</Button>
|
</Button>
|
||||||
<Button color="red" onClick={() => void onConfirm()} loading={loading}>
|
<Button
|
||||||
|
color="red"
|
||||||
|
onClick={() => void onConfirm()}
|
||||||
|
loading={loading}
|
||||||
|
data-testid="confirm-delete-user-button"
|
||||||
|
>
|
||||||
Delete User
|
Delete User
|
||||||
</Button>
|
</Button>
|
||||||
</Group>
|
</Group>
|
||||||
|
|||||||
@@ -72,6 +72,7 @@ const EditUserModal: React.FC<EditUserModalProps> = ({
|
|||||||
label="Email"
|
label="Email"
|
||||||
required
|
required
|
||||||
value={formData.email}
|
value={formData.email}
|
||||||
|
data-testid="edit-user-email-input"
|
||||||
onChange={(e) =>
|
onChange={(e) =>
|
||||||
setFormData({ ...formData, email: e.currentTarget.value })
|
setFormData({ ...formData, email: e.currentTarget.value })
|
||||||
}
|
}
|
||||||
@@ -80,6 +81,7 @@ const EditUserModal: React.FC<EditUserModalProps> = ({
|
|||||||
<TextInput
|
<TextInput
|
||||||
label="Display Name"
|
label="Display Name"
|
||||||
value={formData.displayName}
|
value={formData.displayName}
|
||||||
|
data-testid="edit-user-display-name-input"
|
||||||
onChange={(e) =>
|
onChange={(e) =>
|
||||||
setFormData({ ...formData, displayName: e.currentTarget.value })
|
setFormData({ ...formData, displayName: e.currentTarget.value })
|
||||||
}
|
}
|
||||||
@@ -89,6 +91,7 @@ const EditUserModal: React.FC<EditUserModalProps> = ({
|
|||||||
label="Role"
|
label="Role"
|
||||||
required
|
required
|
||||||
value={formData.role ? formData.role.toString() : null}
|
value={formData.role ? formData.role.toString() : null}
|
||||||
|
data-testid="edit-user-role-select"
|
||||||
onChange={(value) =>
|
onChange={(value) =>
|
||||||
setFormData({ ...formData, role: value as UserRole })
|
setFormData({ ...formData, role: value as UserRole })
|
||||||
}
|
}
|
||||||
@@ -101,6 +104,7 @@ const EditUserModal: React.FC<EditUserModalProps> = ({
|
|||||||
<PasswordInput
|
<PasswordInput
|
||||||
label="New Password"
|
label="New Password"
|
||||||
value={formData.password}
|
value={formData.password}
|
||||||
|
data-testid="edit-user-password-input"
|
||||||
onChange={(e) =>
|
onChange={(e) =>
|
||||||
setFormData({ ...formData, password: e.currentTarget.value })
|
setFormData({ ...formData, password: e.currentTarget.value })
|
||||||
}
|
}
|
||||||
@@ -110,10 +114,18 @@ const EditUserModal: React.FC<EditUserModalProps> = ({
|
|||||||
Leave password empty to keep the current password
|
Leave password empty to keep the current password
|
||||||
</Text>
|
</Text>
|
||||||
<Group justify="flex-end" mt="md">
|
<Group justify="flex-end" mt="md">
|
||||||
<Button variant="default" onClick={onClose}>
|
<Button
|
||||||
|
variant="default"
|
||||||
|
onClick={onClose}
|
||||||
|
data-testid="cancel-edit-user-button"
|
||||||
|
>
|
||||||
Cancel
|
Cancel
|
||||||
</Button>
|
</Button>
|
||||||
<Button onClick={() => void handleSubmit} loading={loading}>
|
<Button
|
||||||
|
onClick={() => void handleSubmit}
|
||||||
|
loading={loading}
|
||||||
|
data-testid="confirm-edit-user-button"
|
||||||
|
>
|
||||||
Save Changes
|
Save Changes
|
||||||
</Button>
|
</Button>
|
||||||
</Group>
|
</Group>
|
||||||
|
|||||||
@@ -63,6 +63,7 @@ const CreateWorkspaceModal: React.FC<CreateWorkspaceModalProps> = ({
|
|||||||
<TextInput
|
<TextInput
|
||||||
label="Workspace Name"
|
label="Workspace Name"
|
||||||
placeholder="Enter workspace name"
|
placeholder="Enter workspace name"
|
||||||
|
data-testid="workspace-name-input"
|
||||||
value={name}
|
value={name}
|
||||||
onChange={(event) => setName(event.currentTarget.value)}
|
onChange={(event) => setName(event.currentTarget.value)}
|
||||||
mb="md"
|
mb="md"
|
||||||
@@ -74,10 +75,15 @@ const CreateWorkspaceModal: React.FC<CreateWorkspaceModalProps> = ({
|
|||||||
variant="default"
|
variant="default"
|
||||||
onClick={() => setCreateWorkspaceModalVisible(false)}
|
onClick={() => setCreateWorkspaceModalVisible(false)}
|
||||||
disabled={loading}
|
disabled={loading}
|
||||||
|
data-testid="cancel-create-workspace-button"
|
||||||
>
|
>
|
||||||
Cancel
|
Cancel
|
||||||
</Button>
|
</Button>
|
||||||
<Button onClick={() => void handleSubmit} loading={loading}>
|
<Button
|
||||||
|
onClick={() => void handleSubmit}
|
||||||
|
loading={loading}
|
||||||
|
data-testid="confirm-create-workspace-button"
|
||||||
|
>
|
||||||
Create
|
Create
|
||||||
</Button>
|
</Button>
|
||||||
</Group>
|
</Group>
|
||||||
|
|||||||
@@ -28,10 +28,18 @@ const DeleteWorkspaceModal: React.FC<DeleteUserModalProps> = ({
|
|||||||
permanently deleted.
|
permanently deleted.
|
||||||
</Text>
|
</Text>
|
||||||
<Group justify="flex-end" mt="xl">
|
<Group justify="flex-end" mt="xl">
|
||||||
<Button variant="default" onClick={onClose}>
|
<Button
|
||||||
|
variant="default"
|
||||||
|
onClick={onClose}
|
||||||
|
data-testid="cancel-delete-workspace-button"
|
||||||
|
>
|
||||||
Cancel
|
Cancel
|
||||||
</Button>
|
</Button>
|
||||||
<Button color="red" onClick={() => void onConfirm}>
|
<Button
|
||||||
|
color="red"
|
||||||
|
onClick={() => void onConfirm}
|
||||||
|
data-testid="confirm-delete-workspace-button"
|
||||||
|
>
|
||||||
Delete Workspace
|
Delete Workspace
|
||||||
</Button>
|
</Button>
|
||||||
</Group>
|
</Group>
|
||||||
|
|||||||
Reference in New Issue
Block a user