search

ibm-openbmc / dev

Product Development Project Mgmt and Tracking
16 stars 2 forks source link

GUI : FED : b-button component with href attribute is not accessible #1850

Closed derick-montague closed 4 years ago

derick-montague commented 4 years ago

As Is

Using the b- button component and adding an href attribute will generate an <a> element, which is semantically correct. Unfortunately, it adds a role attribute and sets the value to button. This role will incorrectly identify the element to some screen reader as a button instead of a link and will be confusing since a button is to perform an action opposed to directing the user to a different page or section within a page.

image.png

To Be

<div>
  <!-- TODO: link to network settings -->
  <b-link href="#" class="btn btn-secondary">
    <span>{{ $t('pageOverview.quicklinks.editNetworkSettings') }}</span>
     <icon-arrow-right />
   </b-link>
 </div>
derick-montague commented 4 years ago

Need to understand the mark up generated when the :to prop used on this component. Should be using router, not href.

derick-montague commented 4 years ago

Closing: When adding a value other than just # the role attribute is removed.