From abff49561d2e07491edc4801e40238c95bcf8e77 Mon Sep 17 00:00:00 2001
From: George Marshall <george.marshall@consensys.net>
Date: Mon, 6 Mar 2023 15:45:23 -0800
Subject: [PATCH] Fixing FormTextField props and test (#17939)

---
 .../text-field/text-field.test.js               | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/ui/components/component-library/text-field/text-field.test.js b/ui/components/component-library/text-field/text-field.test.js
index 303056bae..ee620f123 100644
--- a/ui/components/component-library/text-field/text-field.test.js
+++ b/ui/components/component-library/text-field/text-field.test.js
@@ -1,5 +1,6 @@
 /* eslint-disable jest/require-top-level-describe */
 import React from 'react';
+import PropTypes from 'prop-types';
 import { fireEvent, render } from '@testing-library/react';
 import { renderWithUserEvent } from '../../../../test/lib/render-helpers';
 
@@ -227,9 +228,19 @@ describe('TextField', () => {
     expect(getByTestId('text-field-required')).toHaveAttribute('required', '');
   });
   it('should render with a custom input and still work', async () => {
-    const CustomInputComponent = React.forwardRef((props, ref) => (
-      <Box ref={ref} as="input" {...props} />
-    ));
+    const CustomInputComponent = React.forwardRef(
+      ({ disableStateStyles, ...props }, ref) => (
+        <Box
+          ref={ref}
+          as="input"
+          {...props}
+          placeholder={`Removing ${disableStateStyles} from ...props spread to prevent error in test`}
+        />
+      ),
+    );
+    CustomInputComponent.propTypes = {
+      disableStateStyles: PropTypes.bool,
+    };
     CustomInputComponent.displayName = 'CustomInputComponent'; // fixes eslint error
     const { getByTestId, user } = renderWithUserEvent(
       <TextField