Skip to content

Commit 4758c34

Browse files
committed
fix: aria-live and aria-describedby on fieldset element.
1 parent 7df734e commit 4758c34

File tree

1 file changed

+12
-9
lines changed

1 file changed

+12
-9
lines changed

src/shared/Fieldset.tsx

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -148,6 +148,15 @@ export const Fieldset = memo(
148148
return renderOption({ option: options[0], i: undefined });
149149
}
150150

151+
const messageId = (() => {
152+
switch (state) {
153+
case "error":
154+
return errorDescId;
155+
case "success":
156+
return successDescId;
157+
}
158+
})();
159+
151160
return (
152161
<fieldset
153162
id={id}
@@ -184,6 +193,7 @@ export const Fieldset = memo(
184193
fr.cx("fr-fieldset__legend", "fr-text--regular"),
185194
classes.legend
186195
)}
196+
aria-describedby={messageId}
187197
>
188198
{legend}
189199
{hintText !== undefined && (
@@ -197,18 +207,11 @@ export const Fieldset = memo(
197207
<div
198208
className={fr.cx("fr-messages-group")}
199209
id={messagesWrapperId}
200-
aria-live="assertive"
210+
aria-live={state === "error" ? "assertive" : undefined}
201211
>
202212
{stateRelatedMessage !== undefined && (
203213
<p
204-
id={(() => {
205-
switch (state) {
206-
case "error":
207-
return errorDescId;
208-
case "success":
209-
return successDescId;
210-
}
211-
})()}
214+
id={messageId}
212215
className={fr.cx(
213216
"fr-message",
214217
(() => {

0 commit comments

Comments
 (0)