focus order changed (#2155)

SFDO-Tooling · Dec 28, 2023 · 5e28f2c · 5e28f2c
1 parent 24ebbaf
commit 5e28f2c
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 2 deletions.
diff --git a/src/js/components/tasks/retrieveMetadata/changes.tsx b/src/js/components/tasks/retrieveMetadata/changes.tsx
@@ -4,7 +4,7 @@ import Checkbox from '@salesforce/design-system-react/components/checkbox';
 import Icon from '@salesforce/design-system-react/components/icon';
 import Tooltip from '@salesforce/design-system-react/components/tooltip';
 import classNames from 'classnames';
-import React, { ChangeEvent, useState } from 'react';
+import React, { ChangeEvent, RefObject, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 
 import {
@@ -208,6 +208,14 @@ const ChangesForm = ({
     updateChecked(ignoredChanges, checked);
   };
 
+  interface CheckboxRefType {
+    input?: HTMLElement | null;
+  }
+  const checkboxRef: RefObject<CheckboxRefType> = React.createRef();
+  useEffect(() => {
+    checkboxRef.current?.input?.focus();
+  }, [checkboxRef]);
+
   return (
     <form
       className="slds-form slds-p-around_large has-checkboxes"
@@ -239,6 +247,7 @@ const ChangesForm = ({
                 indeterminate={Boolean(!allChangesChecked && !noChangesChecked)}
                 errorText={errors.changes}
                 onChange={handleSelectAllChange}
+                ref={checkboxRef}
               />
               <span className="slds-text-body_regular slds-p-top_xxx-small">
                 ({totalChanges})

diff --git a/test/js/components/tasks/retrieveMetadata/index.test.jsx b/test/js/components/tasks/retrieveMetadata/index.test.jsx
@@ -115,6 +115,7 @@ describe('<RetrieveMetadataModal/>', () => {
       fireEvent.click(getByText('Save & Next'));
 
       const selectAll = getByLabelText('All Changes');
+      expect(selectAll).toHaveFocus();
       fireEvent.click(selectAll);
       // Click forward to the commit-message modal:
       fireEvent.click(getByText('Save & Next'));
@@ -124,7 +125,7 @@ describe('<RetrieveMetadataModal/>', () => {
       fireEvent.change(commitInput, { target: { value: 'My Commit' } });
       fireEvent.click(submit);
 
-      expect.assertions(2);
+      expect.assertions(3);
       await findByText('Retrieving Selected Changes…');
 
       expect(createObject).toHaveBeenCalledTimes(1);