Accessibility improvement - request body format accessibility improved (

#1991) * Fixing inconsistency between Sample request body select label and aria-label * Request body format accessibility issues fixes
Azure · Nov 8, 2022 · 9837cc8 · 9837cc8
1 parent c719f2f
commit 9837cc8
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/src/components/file-input/file-input.html b/src/components/file-input/file-input.html
@@ -1,4 +1,4 @@
-<div tabindex="0" class="input-group" data-bind="activate: onClick">
+<div tabindex="0" class="input-group" data-bind="activate: onClick" role="button">
     <input class="input" type="text" placeholder="Upload file" disabled data-bind="value: selectedFileInfo">
     <div class="input-group-addon">
         <i class="icon-emb icon-emb-upload"></i>

diff --git a/src/components/operations/operation-details/ko/runtime/operation-console.html b/src/components/operations/operation-details/ko/runtime/operation-console.html
@@ -278,13 +278,13 @@ <h3>
                         <div class="form-check form-check-inline">
                             <input class="form-check-input" type="radio" name="bodyFormat" id="bodyFormatRaw" value="raw"
                                 data-bind="checked: request.bodyFormat, attr: { disabled: request.readonlyBodyFormat}">
-                            <label class="form-check-label" for="bodyFormatRaw">Raw</label>
+                            <label class="form-check-label" for="bodyFormatRaw" aria-label="Request body format Raw">Raw</label>
                         </div>
                         <div class="form-check form-check-inline">
                             <input class="form-check-input" type="radio" name="bodyFormat" id="bodyFormatBinary"
                                 value="binary"
                                 data-bind="checked: request.bodyFormat, attr: { disabled: request.readonlyBodyFormat}">
-                            <label class="form-check-label" for="bodyFormatBinary">Binary</label>
+                            <label class="form-check-label" for="bodyFormatBinary" aria-label="Request body format Binary">Binary</label>
                         </div>
                     </div>
                 </div>
@@ -323,7 +323,7 @@ <h3>
                     <!-- /ko -->
                     <!-- ko if: request.bodyFormat() === 'binary' -->
                     <file-input params="{ onSelect: $component.onFileSelect }" class="form-control"
-                        aria-label="Request body" data-bind="css: { 'is-invalid': !request.binary.isValid() }"></file-input>
+                        aria-label="Upload file" data-bind="css: { 'is-invalid': !request.binary.isValid() }"></file-input>
                     <span class="invalid-feedback" data-bind="validationMessage: request.binary"></span>
                     <!-- /ko -->
                 </div>