Add HTML data-automation attributes for easier automation on client.

BrunoBernardino · Jan 8, 2022 · 90effab · 90effab
1 parent 21a89a8
commit 90effab
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 0 deletions.
diff --git a/components/Panels/AddExpense.tsx b/components/Panels/AddExpense.tsx
@@ -171,6 +171,7 @@ const AddExpense = ({ budgets, reloadData }: AddExpenseProps) => {
         type="number"
         inputMode="decimal"
         onKeyDown={onKeyDown}
+        data-automation="add-expense-cost"
       />
 
       <Label>Description</Label>
@@ -181,6 +182,7 @@ const AddExpense = ({ budgets, reloadData }: AddExpenseProps) => {
         autoComplete="off"
         type="text"
         onKeyDown={onKeyDown}
+        data-automation="add-expense-description"
       />
 
       <Label>Budget</Label>
@@ -190,6 +192,7 @@ const AddExpense = ({ budgets, reloadData }: AddExpenseProps) => {
           setBudget(budgets[event.target.selectedIndex].name)
         }
         value={budget || 'Misc'}
+        data-automation="add-expense-budget"
       >
         {budgetsToShow.map((budgetOption: T.Budget) => (
           <option key={budgetOption.id} value={budgetOption.name}>
@@ -206,12 +209,14 @@ const AddExpense = ({ budgets, reloadData }: AddExpenseProps) => {
         autoComplete="off"
         type="date"
         onKeyDown={onKeyDown}
+        data-automation="add-expense-date"
       />
       <Button
         isDisabled={isSubmitting}
         onClick={() => addExpense()}
         type="primary"
         style={{ margin: '20px 0' }}
+        data-automation="add-expense-button"
       >
         {isSubmitting ? 'Adding...' : 'Add Expense'}
       </Button>

diff --git a/modules/auth/LoginButton.tsx b/modules/auth/LoginButton.tsx
@@ -82,6 +82,7 @@ const LoginButton = () => {
             handleLogin();
           }
         }}
+        data-automation="login-email"
       />
       <TextInput
         type="password"
@@ -96,12 +97,14 @@ const LoginButton = () => {
             handleLogin();
           }
         }}
+        data-automation="login-password"
       />
       <Button
         onClick={handleLogin}
         width="large"
         type="primary"
         style={{ margin: '20px auto' }}
+        data-automation="login-button"
       >
         Login
       </Button>