From 85a0092bad776357ede2cd4e9aee9a5aa11912fd Mon Sep 17 00:00:00 2001
From: Brandon Lenz <brandonalenz@gmail.com>
Date: Mon, 3 Jan 2022 11:04:50 -0500
Subject: [PATCH] feat: Allow intrinsic elements to be passed to Fieldset
 (#1862)

---
 src/components/forms/Fieldset/Fieldset.test.tsx | 11 +++++++++++
 src/components/forms/Fieldset/Fieldset.tsx      |  5 +++--
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/src/components/forms/Fieldset/Fieldset.test.tsx b/src/components/forms/Fieldset/Fieldset.test.tsx
index 7482443f1e..17d1c4efe0 100644
--- a/src/components/forms/Fieldset/Fieldset.test.tsx
+++ b/src/components/forms/Fieldset/Fieldset.test.tsx
@@ -16,6 +16,17 @@ describe('Fieldset component', () => {
     expect(queryByText('My Fieldset')).toBeInTheDocument()
   })
 
+  it('accepts fieldset intrinsic props', () => {
+    const { queryByText } = render(
+      <Fieldset aria-live="polite">My Fieldset</Fieldset>
+    )
+
+    const myFieldset = queryByText('My Fieldset')
+
+    expect(myFieldset).toBeInTheDocument()
+    expect(myFieldset).toHaveAttribute('aria-live', 'polite')
+  })
+
   describe('renders uswds classes', () => {
     it('renders legend with class usa-legend by default', () => {
       const { queryByTestId, getByText } = render(
diff --git a/src/components/forms/Fieldset/Fieldset.tsx b/src/components/forms/Fieldset/Fieldset.tsx
index 7815474623..6e46eaca38 100644
--- a/src/components/forms/Fieldset/Fieldset.tsx
+++ b/src/components/forms/Fieldset/Fieldset.tsx
@@ -19,7 +19,8 @@ export const Fieldset = ({
   className,
   legendSrOnly,
   legendStyle = 'default',
-}: FieldsetProps): React.ReactElement => {
+  ...fieldsetProps
+}: FieldsetProps & JSX.IntrinsicElements['fieldset']): React.ReactElement => {
   const classes = classnames('usa-fieldset', className)
 
   if (legendSrOnly) {
@@ -35,7 +36,7 @@ export const Fieldset = ({
   })
 
   return (
-    <fieldset data-testid="fieldset" className={classes}>
+    <fieldset data-testid="fieldset" className={classes} {...fieldsetProps}>
       {legend && <legend className={legendClasses}>{legend}</legend>}
       {children}
     </fieldset>