[base-ui][material-ui][TextareaAutosize] Fix inline style not getting…

… applied (#41369)
mui · Mar 8, 2024 · 27b8c76 · 27b8c76
1 parent fe5fb08
commit 27b8c76
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 0 deletions.
diff --git a/packages/mui-base/src/TextareaAutosize/TextareaAutosize.test.tsx b/packages/mui-base/src/TextareaAutosize/TextareaAutosize.test.tsx
@@ -458,4 +458,17 @@ describe('<TextareaAutosize />', () => {
       expect(input.style).to.have.property('height', `${lineHeight * 2}px`);
     });
   });
+
+  it('should apply the inline styles using the "style" prop', function test() {
+    if (/jsdom/.test(window.navigator.userAgent)) {
+      this.skip();
+    }
+
+    const { container } = render(<TextareaAutosize style={{ backgroundColor: 'yellow' }} />);
+    const input = container.querySelector<HTMLTextAreaElement>('textarea')!;
+
+    expect(input).toHaveComputedStyle({
+      backgroundColor: 'rgb(255, 255, 0)',
+    });
+  });
 });
diff --git a/packages/mui-base/src/TextareaAutosize/TextareaAutosize.tsx b/packages/mui-base/src/TextareaAutosize/TextareaAutosize.tsx
@@ -197,6 +197,7 @@ const TextareaAutosize = React.forwardRef(function TextareaAutosize(
         ref={handleRef}
         // Apply the rows prop to get a "correct" first SSR paint
         rows={minRows as number}
+        style={style}
         {...other}
       />
       <textarea