test: fix completely broken tests

Author: bradenmacdonald

src/advanced-settings/setting-card/SettingCard.test.jsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import { fireEvent, render, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { IntlProvider } from '@edx/frontend-platform/i18n';
@@ -22,7 +21,6 @@ jest.mock('react-textarea-autosize', () => jest.fn((props) => (
   <textarea
     {...props}
     onFocus={() => {}}
-    onBlur={() => {}}
   />
 )));
 
@@ -86,10 +84,10 @@ describe('<SettingCard />', () => {
     await waitFor(() => {
       expect(inputBox).toHaveValue('3, 2, 1');
     });
+    await user.tab(); // blur off of the input.
     await waitFor(() => {
       expect(setEdited).toHaveBeenCalled();
       expect(handleBlur).toHaveBeenCalled();
     });
-    fireEvent.focusOut(inputBox);
   });
 });

…ed-settings/setting-card/SettingCard.jsx …ed-settings/setting-card/SettingCard.tsxsrc/advanced-settings/setting-card/SettingCard.jsx renamed to src/advanced-settings/setting-card/SettingCard.tsx src/advanced-settings/setting-card/SettingCard.jsx renamed to src/advanced-settings/setting-card/SettingCard.tsx

@@ -30,7 +30,7 @@ const SettingCard = ({
   const { deprecated, help, displayName } = settingData;
   const initialValue = JSON.stringify(settingData.value, null, 4);
   const [isOpen, open, close] = useToggle(false);
-  const [target, setTarget] = useState(null);
+  const [target, setTarget] = useState<HTMLButtonElement | null>(null);
   const [newValue, setNewValue] = useState(initialValue);
 
   const handleSettingChange = (e) => {
@@ -118,7 +118,7 @@ SettingCard.propTypes = {
     deprecated: PropTypes.bool,
     help: PropTypes.string,
     displayName: PropTypes.string,
-    value: PropTypes.PropTypes.oneOfType([
+    value: PropTypes.oneOfType([
       PropTypes.string,
       PropTypes.bool,
       PropTypes.number,