Problem
The upload widget is failing accessibility test because the label "for" attribute is different from the text input "id".
The text input id have a "-upload" appended to it. Or, per 508 standard, the label "for" attribute must be equal to the corresponding field "id".
Actions
I had the issue with media but after investigation, I've noticed that even the core file widget have the same structure.
Temporary solution
I unfortunately had to hack the media module to get around this for now since I was not able to solve the issue. This is what I did:

  • In the media.fields.inc media_field_widget_form function at line 172, I've commented $elements['#file_upload_title'] = t('Attach media'); to prevent the printing of the default label.
  • In the same file theme_media_widget function, I've customized the printing of the label like this at line 395:
    // Get the current field id
      $v = $element['#id'];
    // divide the id where it adds the 'fid'
      $vx = explode('--', $v);
    // Check if there is only 1 field or if there are multiple and create the correct format.
      if(empty($vx['1'])) {
      	$vxId = $v . '-upload';
      } else {
      	$vxId = $vx['0'] . '-upload--' . $vx['1'];
      }
    // Create the new label with the correct "for" attribute.
      $output .= '<label class="element-invisible" for="' . $vxId . '">Attach Media</label>';

I know this is dirty, but that's what my level of php allowed me. Hope it helps as a starting point for finding a solution.

Comments

steinmb’s picture

Title: Accessibility issue on Upload widget » Improve Upload widget accessibility
Category: Support request » Feature request
Status: Active » Postponed (maintainer needs more info)

I'm no accessibility specialist but this seems to be something that should be addressed. I'll think we can change this to a feature request? Any change you can provide a patch of the changes you did? It make testing and discussing changes easier.

Chris Matthews’s picture

Status: Postponed (maintainer needs more info) » Closed (outdated)
Issue tags: -upload widget, -Accessibility, -508

Closing this issue as outdated. However, if you think this issue is still important, please let us know and we will gladly re-open it for review.
sincerely,
- the Drupal Media Team