refactor: 게임 화면에서 선택지를 선택하는 기능에 적절한 role과 속성을 추가하여 개선 #361

woowacourse-teams · Oct 21, 2024 · 68f672a · 68f672a
1 parent 92ddf87
commit 68f672a
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 2 deletions.
diff --git a/frontend/src/components/SelectContainer/SelectContainer.tsx b/frontend/src/components/SelectContainer/SelectContainer.tsx
@@ -20,7 +20,7 @@ const SelectContainer = () => {
         isVoted={selectedOption.isCompleted}
         completeSelection={completeSelection}
       />
-      <section css={selectSection}>
+      <section role="radiogroup" css={selectSection}>
         <SelectOption
           option={balanceContent.firstOption}
           selectedOption={selectedOption}

diff --git a/frontend/src/components/SelectOption/SelectOption.tsx b/frontend/src/components/SelectOption/SelectOption.tsx
@@ -18,10 +18,11 @@ const SelectOption = ({ option, selectedOption, handleClickOption }: SelectOptio
 
   return (
     <button
+      role="radio"
       css={SelectOptionLayout(selectedId === option.optionId, isCompleted)}
       onClick={() => handleClickOption(option.optionId)}
       disabled={isCompleted}
-      aria-pressed={selectedId === option.optionId}
+      aria-checked={selectedId === option.optionId}
     >
       {option.name}
     </button>