feat: Adding live region to announce the change in pop-up view

Author: ktquez

src/components/PopupBody.vue

@@ -11,6 +11,12 @@
     />
     <PopupBodyNoIssues v-if="!results.issuesFound && !details" />
     <PopupLoading v-show="loading" />
+    <span
+      class="va-sr-only"
+      aria-live="polite"
+    >
+      {{ details ? $vat('announcer_details_view') : $vat('announcer_violations_view') }}
+    </span>
   </div>
 </template>
 

src/locales/en.js

@@ -4,5 +4,7 @@ export default {
   btn_label: 'accessibility issue found',
   btn_label_plu: 'accessibility issues found',
   fix: 'Fix the following',
-  fixes: 'Fix any of the following'
+  fixes: 'Fix any of the following',
+  announcer_details_view: 'Details os violation has loaded',
+  announcer_violations_view: 'List of violations has loaded'
 }

src/locales/pt_BR.js

@@ -24,5 +24,8 @@ export default {
   serious: 'Importante',
   moderate: 'Moderado',
   minor: 'Leve',
-  els: 'Elementos'
+  els: 'Elementos',
+  details: 'Detalhes',
+  announcer_details_view: 'Detalhes da violação foi carregado',
+  announcer_violations_view: 'Lista de violações foi carregada'
 }