ensure all popovers have aria-describedBy

sul-dlss · Jun 30, 2023 · 2d89f10 · 2d89f10
1 parent 2453f4f
commit 2d89f10
Show file tree

Hide file tree

Showing 19 changed files with 31 additions and 31 deletions.
diff --git a/app/components/collections/edit_license_component.html.erb b/app/components/collections/edit_license_component.html.erb
@@ -1,4 +1,4 @@
-  <section id="terms" data-controller="complex-radio">
+  <section id="terms" data-controller="complex-radio" aria-describedby="popover-collection.terms">
     <header>Terms of use and license * <%= render PopoverComponent.new key: "collection.terms" %></header>
 
     <p>

diff --git a/app/components/collections/settings_component.html.erb b/app/components/collections/settings_component.html.erb
@@ -3,7 +3,7 @@
     <header>Manage release of deposits for discovery and download *</header>
 
     <fieldset class="mb-5 release-option" data-controller="complex-radio">
-      <legend class="h5">When will files on deposits to this collection be downloadable? * <%= render PopoverComponent.new key: "collection.release" %></legend>
+      <legend aria-describedby="popover-collection.release" class="h5">When will files on deposits to this collection be downloadable? * <%= render PopoverComponent.new key: "collection.release" %></legend>
       <div class="form-check<%= " is-invalid" if release_option_errors? %>" data-complex-radio-target="selection">
         <%= form.radio_button :release_option, "immediate", class: "form-check-input", data: {action: "complex-radio#disableUnselectedInputs"} %>
         <%= form.label "release_option_immediate", t("options.collection.release.immediate"), class: "form-check-label" %>
@@ -35,7 +35,7 @@
     </fieldset>
 
     <fieldset class="mb-5">
-      <legend class="h5">Who will have permission to download files for deposits to this collection? * <%= render PopoverComponent.new key: "collection.access" %></legend>
+      <legend aria-describedby="popover-collection.access" class="h5">Who will have permission to download files for deposits to this collection? * <%= render PopoverComponent.new key: "collection.access" %></legend>
       <div class="form-check">
         <%= form.radio_button :access, "world", class: "form-check-input" %>
         <%= form.label "access_world", t("options.collection.access.world"), class: "form-check-label" %>
@@ -51,7 +51,7 @@
     </fieldset>
 
     <fieldset class="mb-5">
-      <legend class="h5">Will a DOI be assigned to the deposits in this collection?* <%= render PopoverComponent.new key: "collection.doi" %>
+      <legend aria-describedby="popover-collection.doi" class="h5">Will a DOI be assigned to the deposits in this collection?* <%= render PopoverComponent.new key: "collection.doi" %>
         <%= link_to "What is a DOI?", Settings.external_links.what_is_a_doi, target: "_blank" %>
       </legend>
       <div class="form-check">

diff --git a/app/components/collections/update/depositors_component.html.erb b/app/components/collections/update/depositors_component.html.erb
@@ -1,5 +1,5 @@
 <fieldset>
-  <legend class="participant-type" style="font-size: 1rem; width: 5rem; float: left">Depositors</legend>
+  <legend class="participant-type" aria-describedby="popover-collection.depositors" style="font-size: 1rem; width: 5rem; float: left">Depositors</legend>
   <div style="float: left; margin-right: 6rem">
     <%= render PopoverComponent.new key: "collection.depositors" %>
   </div>

diff --git a/app/components/collections/update/managers_component.html.erb b/app/components/collections/update/managers_component.html.erb
@@ -1,5 +1,5 @@
 <fieldset>
-  <legend class="participant-type" style="font-size: 1rem; width: 5rem; float: left">Managers *</legend>
+  <legend class="participant-type" aria-describedby="popover-collection.managers" style="font-size: 1rem; width: 5rem; float: left">Managers *</legend>
   <div style="float: left; margin-right: 6rem">
     <%= render PopoverComponent.new key: "collection.managers" %>
   </div>

diff --git a/app/components/collections/update/reviewers_component.html.erb b/app/components/collections/update/reviewers_component.html.erb
@@ -1,7 +1,7 @@
 <p>Enter one reviewer SUNet ID per box and then click "Add" to save the entry.</p>
 
 <fieldset>
-  <legend class="participant-type" style="font-size: 1rem; width: 5rem; float: left">Additional Reviewers</legend>
+  <legend class="participant-type" aria-describedby="popover-collection.reviewers" style="font-size: 1rem; width: 5rem; float: left">Additional Reviewers</legend>
   <div style="float: left; margin-right: 6rem">
     <%= render PopoverComponent.new key: "collection.reviewers" %>
   </div>

diff --git a/app/components/first_draft_collections/create/details_component.html.erb b/app/components/first_draft_collections/create/details_component.html.erb
@@ -2,7 +2,7 @@
   <header>Details *</header>
   <div class="mb-3 row">
     <div class="col-sm-2">
-      <%= form.label :name, "Collection name *", class: "col-form-label" %>
+      <%= form.label :name, "Collection name *", class: "col-form-label", "aria-describedby": "popover-collection.name" %>
       <%= render PopoverComponent.new key: "collection.name" %>
     </div>
     <div class="col-sm-10 col-xl-8">
@@ -12,7 +12,7 @@
   </div>
   <div class="mb-3 row">
     <div class="col-sm-2">
-      <%= form.label :description, "Description *", class: "col-form-label" %>
+      <%= form.label :description, "Description *", class: "col-form-label", "aria-describedby": "popover-collection.description" %>
       <%= render PopoverComponent.new key: "collection.description" %>
     </div>
     <div class="col-sm-10 col-xl-8">

diff --git a/app/components/works/authors_component.html.erb b/app/components/works/authors_component.html.erb
@@ -1,5 +1,5 @@
 <section data-controller="ordered-nested-form" data-ordered-nested-form-selector-value=".inner-container">
-  <header>
+  <header aria-describedby="popover-work.author">
     Authors to include in citation
     <%= render PopoverComponent.new key: "work.author" %>
   </header>

diff --git a/app/components/works/contributor_row_component.html.erb b/app/components/works/contributor_row_component.html.erb
@@ -3,7 +3,7 @@
   <div class="col-md-11">
     <div class="row">
       <div class="col-md-3">
-        <%= form.label :role_term, role_term_label, class: "form-label" %>
+        <%= form.label :role_term, role_term_label, class: "form-label", "aria-describedby": "popover-work.role_term" %>
         <%= render PopoverComponent.new key: "work.role_term" %>
         <%= select_role %>
       </div>
@@ -18,7 +18,7 @@
           </div>
           <div class="row person-identifier-row" data-contributors-target="personName">
             <div class="col-md-5">
-              <%= form.label :first_name, first_name_label, class: "form-label" %>
+              <%= form.label :first_name, first_name_label, class: "form-label", "aria-describedby": "popover-work.first_name" %>
               <%= render PopoverComponent.new key: "work.first_name" %>
               <%= form.text_field :first_name, html_options("contributorFirst", disabled: orcid?) %>
               <div class="invalid-feedback">You must provide a first name</div>
@@ -42,15 +42,15 @@
           <div class="row person-identifier-row" data-contributors-target="personOrcid">
             <% text_field_id_prefix = "work_#{namespace}_orcid_#{form.options[:child_index]}_" %>
             <div class="col">
-              <%= form.label :orcid, orcid_label, for: "#{text_field_id_prefix}id", class: "form-label" %>
+              <%= form.label :orcid, orcid_label, for: "#{text_field_id_prefix}id", class: "form-label", "aria-describedby": "popover-work.orcid" %>
               <%= render PopoverComponent.new key: "work.orcid" %>
               <%= form.text_field :orcid, class: "form-control", required: author?, id: "#{text_field_id_prefix}id", data: {contributors_target: "orcid", action: "contributors#lookupOrcid"} %>
               <div class="invalid-feedback" data-contributors-target="orcidFeedback">You must provide an ORCID iD</div>
               <div data-contributors-target="personOrcidName">
                 <div class="form-text" data-contributors-target="orcidDisplayName"></div>
                 <div class="row">
                   <div class="col-md-5">
-                    <%= form.label :first_name, first_name_label, for: "#{text_field_id_prefix}first_name", class: "form-label" %>
+                    <%= form.label :first_name, first_name_label, for: "#{text_field_id_prefix}first_name", class: "form-label", "aria-describedby": "popover-work.orcid_name" %>
                     <%= render PopoverComponent.new key: "work.orcid_name" %>
                     <%= form.text_field :first_name, html_options("contributorFirst", contributors_target: "orcidFirstName", disabled: !orcid?).merge(id: "#{text_field_id_prefix}first_name") %>
                     <div class="invalid-feedback">You must provide a first name</div>
@@ -67,7 +67,7 @@
         </fieldset>
       </div>
       <div class="col" data-contributors-target="organization">
-        <%= form.label :full_name, organization_label, class: "form-label" %>
+        <%= form.label :full_name, organization_label, class: "form-label", "aria-describedby": "popover-work.organization" %>
         <%= render PopoverComponent.new key: "work.organization" %>
         <%= form.text_field :full_name, html_options("contributorOrg") %>
         <div class="invalid-feedback">You must provide a name</div>

diff --git a/app/components/works/contributors_component.html.erb b/app/components/works/contributors_component.html.erb
@@ -1,5 +1,5 @@
 <section data-controller="nested-form" data-nested-form-selector-value=".inner-container">
-  <header>Additional contributors
+  <header aria-describedby="popover-work.contributor">Additional contributors
    <%= render PopoverComponent.new key: "work.contributor" %>
   </header>
   <p>Names will be listed in the order shown below.</p>

diff --git a/app/components/works/dates_component.html.erb b/app/components/works/dates_component.html.erb
@@ -1,5 +1,5 @@
 <section id="dates">
-  <header>Enter dates related to your deposit
+  <header aria-describedby="popover-work.date">Enter dates related to your deposit
     <%= render PopoverComponent.new key: "work.date" %>
   </header>
   <%= render Works::PublicationDateComponent.new(form: form,
@@ -11,7 +11,7 @@
     <legend class="visually-hidden">Creation date</legend>
 
     <div class="mb-3 row">
-      <div class="col-sm-2 h6">
+      <div class="col-sm-2 h6" aria-describedby="popover-work.creation_date">
         Creation date
         <%= render PopoverComponent.new key: "work.creation_date" %>
       </div>

diff --git a/app/components/works/description_component.html.erb b/app/components/works/description_component.html.erb
@@ -6,7 +6,7 @@
 
   <div class="mb-3 row">
     <div class="col-sm-2">
-      <%= form.label :abstract, "Abstract *", class: "col-form-label" %>
+      <%= form.label :abstract, "Abstract *", class: "col-form-label", "aria-describedby": "popover-work.abstract" %>
       <%= render PopoverComponent.new key: "work.abstract" %>
     </div>
     <div class="col-sm-10">
@@ -17,7 +17,7 @@
 
   <div class="mb-3 row">
     <div class="col-sm-2">
-      <%= form.label :keywords, "Keywords *", class: "col-form-label" %>
+      <%= form.label :keywords, "Keywords *", class: "col-form-label", "aria-describedby": "popover-work.keywords" %>
       <%= render PopoverComponent.new key: "work.keywords" %>
       <br>(one per box)
     </div>
@@ -29,7 +29,7 @@
   <%= render Works::SubtypesComponent.new(form: form) %>
 
   <fieldset class="mb-5">
-    <legend class='h5'>
+    <legend class="h5" aria-describedby="popover-work.citation">
       Citation for this deposit
       <%= render PopoverComponent.new key: "work.citation" %>
     </legend>

diff --git a/app/components/works/edit/file_row_component.html.erb b/app/components/works/edit/file_row_component.html.erb
@@ -18,7 +18,7 @@
   <div class="upload-description col-4">
       <% unless zip_template? %>
         <div>
-          <%= form.label :label, "Description (optional)" %>
+          <%= form.label :label, "Description (optional)", "aria-describedby": "popover-work.description" %>
           <%= render PopoverComponent.new key: "work.description" %>
         </div>
         <%= form.text_field :label, class: "form-control" %>
@@ -32,7 +32,7 @@
         <%= form.hidden_field :path %>
         <% unless zip_template? %>
           <%= form.check_box :hide, class: "form-check-input" %>
-          <%= form.label :hide, "Hide file", class: "form-check-label col-form-label " %>
+          <%= form.label :hide, "Hide file", class: "form-check-label col-form-label", "aria-describedby": "popover-work.hide_file" %>
           <%= render PopoverComponent.new key: "work.hide_file" %>
         <% end %>
       </div>

diff --git a/app/components/works/edit/files_component.html.erb b/app/components/works/edit/files_component.html.erb
@@ -3,7 +3,7 @@
       <tr>
         <th width="50%">Filename</th>
         <th>Description</th>
-        <th width="10%">Hide <%= render PopoverComponent.new key: "work.hide_file" %></th>
+        <th width="10%" aria-describedby="popover-work.hide_file">Hide <%= render PopoverComponent.new key: "work.hide_file" %></th>
         <th>Actions</th>
       </tr>
     </thead>

diff --git a/app/components/works/license_component.html.erb b/app/components/works/license_component.html.erb
@@ -3,7 +3,7 @@
   <% if user_can_set_license? %>
     <div class="mb-3 row">
       <div class="col-sm-2">
-        <%= form.label :license, "License *", class: "col-form-label" %>
+        <%= form.label :license, "License *", class: "col-form-label", "aria-describedby": "popover-work.license" %>
         <%= render PopoverComponent.new key: "work.license" %>
       </div>
       <div class="col-sm-5">

diff --git a/app/components/works/publication_date_component.html.erb b/app/components/works/publication_date_component.html.erb
@@ -1,5 +1,5 @@
 <div class="mb-3 row">
-  <div class="col-sm-2 h6">
+  <div class="col-sm-2 h6" aria-describedby="popover-work.publication_date">
     Publication date
     <%= render PopoverComponent.new key: "work.publication_date" %>
   </div>

diff --git a/app/components/works/related_work_component.html.erb b/app/components/works/related_work_component.html.erb
@@ -1,5 +1,5 @@
 <fieldset class="mb-5">
-  <legend class="h5">
+  <legend class="h5" aria-describedby="popover-work.related_work">
     Related works
     <%= render PopoverComponent.new key: "work.related_work" %>
   </legend>

diff --git a/app/components/works/subtypes_component.html.erb b/app/components/works/subtypes_component.html.erb
@@ -11,7 +11,7 @@
     <div class="mb-4 subtype-container">
       <div class="col-sm-2">
         <div class="col-form-label">
-          <%= form.label :subtype, 'Specify "Other" type' %> <%= render PopoverComponent.new key: "work.subtypes.other" %>
+          <%= form.label :subtype, 'Specify "Other" type', "aria-describedby": "popover-work.subtypes.other" %> <%= render PopoverComponent.new key: "work.subtypes.other" %>
         </div>
       </div>
 

diff --git a/app/components/works/title_component.html.erb b/app/components/works/title_component.html.erb
@@ -2,7 +2,7 @@
    <header>Title of deposit and contact information *</header>
    <div class="mb-3 row">
      <div class='col-sm-2'>
-       <%= form.label :title, "Title of deposit *", class: "col-form-label" %>
+       <%= form.label :title, "Title of deposit *", class: "col-form-label", "aria-describedby": "popover-work.title" %>
        <%= render PopoverComponent.new key: "work.title" %>
      </div>
      <div class="col-sm-9">

diff --git a/app/components/works/work_type_modal_component.html.erb b/app/components/works/work_type_modal_component.html.erb
@@ -7,7 +7,7 @@
   <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable modal-lg">
     <div class="modal-content">
       <div class="modal-header">
-        <h5 class="modal-title" id="content-type-prompt">What type of content will you deposit?
+        <h5 class="modal-title" id="content-type-prompt" aria-describedby="popover-what_type">What type of content will you deposit?
           <%= render PopoverComponent.new key: :what_type %>
         </h5>
         <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
@@ -32,7 +32,7 @@
           </div>
 
           <template data-work-type-modal-target="templateHeader">
-            <h5>Which of the following terms further describe your deposit?
+            <h5 aria-describedby="popover-further_types">Which of the following terms further describe your deposit?
               <%= render PopoverComponent.new key: :further_types %>
             </h5>
           </template>