From 6d7f6fa1abb5e6c05f47d15fc7bffa9eda482c75 Mon Sep 17 00:00:00 2001
From: bmauger <mauger.bryan@gmail.com>
Date: Wed, 15 Dec 2021 13:32:10 -0500
Subject: [PATCH] Remove role from label. Update unit test.

---
 .../list-button-horizontal/list-button-horizontal.spec.js     | 1 -
 .../list-button-horizontal/list-button-horizontal.vue         | 4 ++--
 src/ux-components/list-button/list-button.spec.js             | 1 -
 src/ux-components/list-button/list-button.vue                 | 4 ++--
 4 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/src/ux-components/list-button-horizontal/list-button-horizontal.spec.js b/src/ux-components/list-button-horizontal/list-button-horizontal.spec.js
index 9d056260a..b7ae7ef49 100644
--- a/src/ux-components/list-button-horizontal/list-button-horizontal.spec.js
+++ b/src/ux-components/list-button-horizontal/list-button-horizontal.spec.js
@@ -31,7 +31,6 @@ describe("list-button.vue", () => {
     });
 
     expect(label.attributes()).toEqual({
-      role: "radio",
       tabindex: "-1",
       for: "2023",
       class: "d-flex flex-column justify-content-center py-3 px-4 last-item",
diff --git a/src/ux-components/list-button-horizontal/list-button-horizontal.vue b/src/ux-components/list-button-horizontal/list-button-horizontal.vue
index cee93e31e..b267f2bbb 100644
--- a/src/ux-components/list-button-horizontal/list-button-horizontal.vue
+++ b/src/ux-components/list-button-horizontal/list-button-horizontal.vue
@@ -3,7 +3,7 @@
   <!-- IMPORTANT: Refrain from using more than 4 horizontal buttons on desktop, 3 on mobile. -->
   <div v-if="isCheckbox" class="list-group list-button-horizontal d-flex flex-column w-100 mb-2">
     <input type="checkbox" :id="buttonID" :name="groupName" :value="buttonID" :aria-required="isRequired">
-    <label role="checkbox" tabindex="-1" aria-checked="false" :for="buttonID" class="d-flex flex-column justify-content-center py-3 px-4" :class="isFirstOrLastButton">
+    <label tabindex="-1" aria-checked="false" :for="buttonID" class="d-flex flex-column justify-content-center py-3 px-4" :class="isFirstOrLastButton">
       <span class="m-0" :class="[this.textPosition]">{{buttonID}}</span>
       <span v-if="buttonLabelSubCopy" class="m-0 small" :class="[this.textPosition]">{{buttonLabelSubCopy}}</span>
       <span v-if="screenReaderOnlyText" class="sr-only">{{screenReaderOnlyText}}</span>
@@ -12,7 +12,7 @@
   </div>
   <div v-else class="col list-group list-button-horizontal d-flex flex-column mb-2">
     <input type="radio" :id="buttonID" :name="groupName" :value="buttonID" aria-required="true" @keyup.space="displayLoader()"/>
-    <label role="radio" tabindex="-1" aria-checked="false" :for="buttonID" class="d-flex flex-column justify-content-center py-3 px-4" :class="isFirstOrLastButton" @click="displayLoader()">
+    <label tabindex="-1" aria-checked="false" :for="buttonID" class="d-flex flex-column justify-content-center py-3 px-4" :class="isFirstOrLastButton" @click="displayLoader()">
       <span class="m-0" :class="[this.textPosition]">{{buttonID}}</span>
       <span v-if="buttonLabelSubCopy" class="m-0 small" :class="[this.textPosition]">{{buttonLabelSubCopy}}</span>
       <span v-if="screenReaderOnlyText" class="sr-only">{{screenReaderOnlyText}}</span>
diff --git a/src/ux-components/list-button/list-button.spec.js b/src/ux-components/list-button/list-button.spec.js
index 9efa06f4d..fbb492222 100644
--- a/src/ux-components/list-button/list-button.spec.js
+++ b/src/ux-components/list-button/list-button.spec.js
@@ -31,7 +31,6 @@ describe("list-button.vue", () => {
     });
 
     expect(label.attributes()).toEqual({
-      role: "radio",
       tabindex: "-1",
       for: "2023",
       class: "d-flex flex-column justify-content-center py-3 px-4",
diff --git a/src/ux-components/list-button/list-button.vue b/src/ux-components/list-button/list-button.vue
index f1768f741..a8ad64d8c 100644
--- a/src/ux-components/list-button/list-button.vue
+++ b/src/ux-components/list-button/list-button.vue
@@ -2,7 +2,7 @@
   <!-- See the component-test.vue page for example implementation -->
   <div v-if="isCheckbox" class="list-group list-button d-flex flex-column w-100 mb-2">
     <input type="checkbox" :id="buttonID" :name="groupName" :value="buttonID" :aria-required="isRequired">
-    <label role="checkbox" tabindex="-1" aria-checked="false" :for="buttonID" class="d-flex flex-column justify-content-center py-3 px-4">
+    <label tabindex="-1" aria-checked="false" :for="buttonID" class="d-flex flex-column justify-content-center py-3 px-4">
       <span class="m-0" :class="[this.textPosition]">{{buttonID}}</span>
       <span v-if="buttonLabelSubCopy" class="m-0 small" :class="[this.textPosition]">{{buttonLabelSubCopy}}</span>
       <span v-if="screenReaderOnlyText" class="sr-only">{{screenReaderOnlyText}}</span>
@@ -11,7 +11,7 @@
   </div>
   <div v-else class="list-group list-button d-flex flex-column w-100 mb-2">
     <input type="radio" :id="buttonID" :name="groupName" :value="buttonID" :aria-required="isRequired" @keyup.space="displayLoader()">
-    <label role="radio" tabindex="-1" aria-checked="false" :for="buttonID" class="d-flex flex-column justify-content-center py-3 px-4" @click="displayLoader()">
+    <label tabindex="-1" aria-checked="false" :for="buttonID" class="d-flex flex-column justify-content-center py-3 px-4" @click="displayLoader()">
       <span class="m-0" :class="[this.textPosition]">{{buttonID}}</span>
       <span v-if="buttonLabelSubCopy" class="m-0 small" :class="[this.textPosition]">{{buttonLabelSubCopy}}</span>
       <span v-if="screenReaderOnlyText" class="sr-only">{{screenReaderOnlyText}}</span>