Merge pull request #6188 from avalonmediasystem/cypress-tests

Adding data-testids for cypress tests

app/assets/javascripts/add-playlist-option.js.coffee

@@ -35,7 +35,7 @@ $ ->
     select_element.append(new Option(addnew))
 
   getSearchTerm = () ->
-    return $('span.select2-search--dropdown input').val()
+    return $('span.select2-search--dropdown input').attr('data-testid', 'media-object-playlist-search-input').val()
 
   matchWithNew = (params, data) ->
     term = params.term || ''

app/controllers/playlists_controller.rb

@@ -90,7 +90,7 @@ def paged_index
         edit_button = view_context.link_to(edit_playlist_path(playlist), class: 'btn btn-outline btn-sm') do
           "<i class='fa fa-edit' aria-hidden='true'></i> Edit".html_safe
         end
-        delete_button = view_context.link_to(playlist_path(playlist), method: :delete, class: 'btn btn-sm btn-danger btn-confirmation', data: {placement: 'bottom'}) do
+        delete_button = view_context.link_to(playlist_path(playlist), method: :delete, class: 'btn btn-sm btn-danger btn-confirmation', data: {placement: 'bottom', testid: 'playlist-delete-table-view'}) do
           "<i class='fa fa-times' aria-hidden='true'></i> Delete".html_safe
         end
         [

app/helpers/playlists_helper.rb

@@ -29,7 +29,7 @@ def icon_only_visibility(visibility)
       else
         "fa-link"
     end
-    content_tag(:span, '', class:"fa #{icon} fa-lg", title: visibility_description(visibility))
+    content_tag(:span, '', class:"fa #{icon} fa-lg", title: visibility_description(visibility), 'data-testid': 'playlist-visibility-icon')
   end
 
   def visibility_description(visibility)

app/javascript/components/MediaObjectRamp.jsx

@@ -127,6 +127,7 @@ const Ramp = ({
                           aria-expanded="false"
                           aria-controls="addToPlaylistPanel"
                           disabled={true}
+                          data-testid="media-object-add-to-playlist-btn"
                         >
                           {/* Static SVG image in /app/assets/images/add_to_playlist_icon.svg */}
                           <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlnsXlink="http://www.w3.org/1999/xlink" x="0px" y="0px"

app/javascript/components/PlaylistRamp.jsx

@@ -209,6 +209,7 @@ const Ramp = ({
                   aria-expanded="false"
                   aria-controls="shareList"
                   id="share-button"
+                  data-testid="playlist-share-btn"
                 >
                   <i className="fa fa-share-alt"></i>
                   Share
@@ -227,7 +228,7 @@ const Ramp = ({
             {comment && (
               <div style={{ position: 'relative' }}>
                 <h4>{comment_label}</h4>
-                <div className='ramp--playlist-description' onScroll={handleScrollableDescription}>
+                <div className='ramp--playlist-description' onScroll={handleScrollableDescription} data-testid="playlist-ramp-description">
                   <span dangerouslySetInnerHTML={{ __html: description }} />
                 </div>
                 {expanded && (

app/javascript/components/collections/CollectionCardBody.js

@@ -17,7 +17,7 @@
 import React from 'react';
 
 const CollectionCardBody = ({ children }) => (
-  <div className="card-body">
+  <div className="card-body" data-testid="collection-card-body">
     <div className="collection-card-description">{children}</div>
   </div>
 );

app/javascript/components/collections/list/CollectionListStickyUtils.js

@@ -39,6 +39,7 @@ const CollectionListStickyUtils = ({
               className="form-control form-control-lg"
               placeholder="Search collections..."
               autoFocus="autofocus"
+              data-testid="collection-search-collection-input"
             />
           </div>
         </form>

app/views/admin/collections/_discovery_visibility_form.html.erb

@@ -40,7 +40,7 @@ Unless required by applicable law or agreed to in writing, software distributed
 <% end %>
 
 <%= bootstrap_form_for object, html: { id: 'visibility_form' }  do |vid| %>
-<div class="card item-access">
+<div class="card item-access" data-testid="collection-item-access">
   <div class="card-header">
     <h3 class="card-title">Item access</h3>
   </div>
@@ -60,14 +60,14 @@ Unless required by applicable law or agreed to in writing, software distributed
       </div>
       <div class="form-check">
         <label>
-          <%= radio_button_tag :visibility, 'private', (@visibility == 'private') %>
+          <%= radio_button_tag :visibility, 'private', (@visibility == 'private'), 'data-testid': 'collection-checkbox-collection-staff' %>
           Collection staff only
         </label>
       </div>
       <%= hidden_field_tag :save_field, "visibility" %>
       <%= hidden_field_tag :overwrite, false %>
-      <%= submit_tag "Save Setting", class: "btn btn-primary", form: 'visibility_form' %>
-      <%= submit_tag "Apply to All Existing Items", name: "apply_to_existing", class: "btn btn-outline", data: { confirm: I18n.t('access_control.apply_to_all_warning') % [object.media_objects.count] }, form: "visibility_form" %>
+      <%= submit_tag "Save Setting", class: "btn btn-primary", form: 'visibility_form', 'data-testid': 'collection-save-setting-btn' %>
+      <%= submit_tag "Apply to All Existing Items", name: "apply_to_existing", class: "btn btn-outline", data: { confirm: I18n.t('access_control.apply_to_all_warning') % [object.media_objects.count], testid: "collection-apply-to-existing-btn" }, form: "visibility_form" %>
     </div>
   </div>
 </div>

app/views/admin/collections/_form.html.erb

@@ -27,18 +27,18 @@ Unless required by applicable law or agreed to in writing, software distributed
       </div>
       <%= bootstrap_form_for @collection, remote: true, html: { modal: true }, format: 'json' do |f| %>
       <div class="modal-body">
-        <%= f.text_field :name %>
+        <%= f.text_field :name, 'data-testid': 'collection-update-name' %>
         <% if @collection.new_record? || can?(:update_unit, @collection)%>
-          <%= f.select(:unit, Admin::Collection.units, {}, {:class => 'form-control'}) %>
+          <%= f.select(:unit, Admin::Collection.units, {}, {:class => 'form-control', 'data-testid': 'collection-update-unit'} ) %>
         <% end %>
-        <%= f.text_area :description, rows: 3  %>
-        <%= f.text_field :contact_email %>
-        <%= f.text_field :website_url %>
-        <%= f.text_field :website_label %>
+        <%= f.text_area :description, rows: 3 ,'data-testid':'collection-update-description' %>
+        <%= f.text_field :contact_email, 'data-testid': 'collection-update-contact-email' %>
+        <%= f.text_field :website_url, 'data-testid':'collection-update-website-url' %>
+        <%= f.text_field :website_label, 'data-testid':'collection-update-website-label' %>
       </div>
       <div class="modal-footer">
         <a href="#" data-dismiss="modal" aria-hidden="true" class="btn btn-outline">Cancel</a>
-        <%= f.submit class: 'btn btn-primary btn-stateful-loading', data: { loading_text: 'Saving...' } %>
+        <%= f.submit class: 'btn btn-primary btn-stateful-loading', data: { loading_text: 'Saving...' } , 'data-testid': 'collection-update-collection-btn' %>
       </div>
       <% end %>
     </div>

app/views/admin/collections/index.html.erb

@@ -26,7 +26,7 @@ Unless required by applicable law or agreed to in writing, software distributed
       <h1 class="page-title">My Collections</h1>
     </div>
     <div class="col-xs-6 collection-btn">
-      <%= link_to('<span class="btn btn-primary btn-large">Create Collection</span>'.html_safe, new_admin_collection_path) unless cannot? :create, Admin::Collection %>
+      <%= link_to('<span class="btn btn-primary btn-large" data-testid="collection-create-collection-button">Create Collection</span>'.html_safe, new_admin_collection_path) unless cannot? :create, Admin::Collection %>
     </div>
   </div>
 
@@ -43,7 +43,7 @@ Unless required by applicable law or agreed to in writing, software distributed
     <tbody>
       <% @collections.to_a.each do |collection| %>
       <tr>
-        <td> <strong><%= link_to collection.name, admin_collection_path(collection.id) %></strong> </td>
+        <td> <strong><%= link_to collection.name, admin_collection_path(collection.id), 'data-testid':"collection-name-table" %></strong> </td>
         <td>
           <%= link_to(pluralize(collection.media_object_count, 'item'), search_catalog_path('f[collection_ssim][]' => collection.name)) %>
           <% if collection.unpublished_media_object_count > 0 %>
@@ -55,7 +55,7 @@ Unless required by applicable law or agreed to in writing, software distributed
         <td class="text-right">
           <% if can?(:destroy, collection) %>
           <div class="btn-group">
-            <%= link_to('Delete', remove_admin_collection_path(collection.id), class: 'btn btn-danger btn-sm')%>
+            <%= link_to('Delete', remove_admin_collection_path(collection.id), class: 'btn btn-danger btn-sm', 'data-testid': 'collection-delete-collection-btn')%>
           </div>
           <% else %>
           &nbsp;

app/views/admin/collections/new.html.erb

@@ -17,14 +17,14 @@ Unless required by applicable law or agreed to in writing, software distributed
   <h1 class="page-title">New collection</h1>
 </div>
 <%= bootstrap_form_for @collection, action: 'create' do |f| %>
-  <%= f.text_field :name %>
+  <%= f.text_field :name, 'data-testid': 'collection-name' %>
   <% if @collection.new_record? || can?(:update_unit, @collection)%>
-    <%= f.select(:unit, Admin::Collection.units, {}, {:class => 'form-control'}) %>
+    <%= f.select(:unit, Admin::Collection.units, {}, {:class => 'form-control', 'data-testid': 'collection-unit' }) %>
   <% end %>
-  <%= f.text_area :description, rows: 3  %>
-  <%= f.text_field :contact_email %>
-  <%= f.text_field :website_url %>
-  <%= f.text_field :website_label %>
+  <%= f.text_area :description, rows: 3, 'data-testid':'collection-description'  %>
+  <%= f.text_field :contact_email, 'data-testid':'collection-contact-email' %>
+  <%= f.text_field :website_url, 'data-testid': 'collection-website-url' %>
+  <%= f.text_field :website_label, 'data-testid':'collection-website-label' %>
   <a href="/admin/collections" aria-hidden="true" class="btn btn-outline">Cancel</a>
-  <%= f.submit class: 'btn btn-primary' %>
+  <%= f.submit class: 'btn btn-primary', 'data-testid': 'collection-new-collection-btn' %>
 <% end %>

app/views/admin/collections/remove.html.erb

@@ -56,7 +56,7 @@ Unless required by applicable law or agreed to in writing, software distributed
     <% end %>
 
     <div class="form-group">
-      <%= f.submit 'Yes, I am sure', class: 'btn btn-danger' %>
+      <%= f.submit 'Yes, I am sure', class: 'btn btn-danger', 'data-testid': "collection-delete-confirm-btn" %>
       <%= link_to 'No, go back', admin_collections_path, class: 'btn btn-outline' %>
     </div>
     <% end %>

app/views/admin/collections/show.html.erb

@@ -32,22 +32,22 @@ Unless required by applicable law or agreed to in writing, software distributed
       </div>
       <div class="modal-footer">
         <button type="button" class="btn btn-outline" data-dismiss="modal" id="crop-cancel">Cancel</button>
-        <button type="button" class="btn btn-primary" id="crop">Upload</button>
+        <button type="button" class="btn btn-primary" id="crop" data-testid="collection-upload-poster">Upload</button>
       </div>
     </div>
   </div>
 </div>
-<div class="admin-collection-details mb-2">
+<div class="admin-collection-details mb-2" data-testid="collection-collection-details">
   <h2><%= @collection.name %></h2>
   <div class="row">
     <div class="col-md-9">
       <p><strong>Unit:</strong></p>
       <p><%= @collection.unit %></p>
       <p><strong>Description:</strong></p>
-      <p class="collection-description"><%= @collection.description %></p>
+      <p id="collectionDescription", class="collection-description", data-testid="collection-description"><%= @collection.description %></p>
       <% if @collection.contact_email.present? %>
         <p><strong>Contact email:</strong></p>
-        <p><%= mail_to(@collection.contact_email) %></p>
+        <p data-testid="collection-contact-email"><%= mail_to(@collection.contact_email) %></p>
       <% end %>
       <% if @collection.website_url.present? %>
         <p><strong>Website:</strong></p>
@@ -66,7 +66,7 @@ Unless required by applicable law or agreed to in writing, software distributed
       </div>
       <div class="row">
         <%= form_for @collection, url: attach_poster_admin_collection_path(@collection.id), html: {method: "post"} do |form| %>
-          <%= form.file_field :poster, id: 'poster_input', class: "filedata", style: "height:0px;width:0px;" %>
+          <%= form.file_field :poster, id: 'poster_input', class: "filedata", style: "height:0px;width:0px;", 'data-testid': "collection-poster-input" %>
           <input type="button" class="btn btn-primary btn-sm mr-2" onclick="$('.filedata').click();" value="<% if @collection.poster.present? %>Change Poster<%else%>Upload Poster<%end%>"
             <% if cannot?(:edit, @collection) %>disabled<%end%> />
         <% end %>
@@ -86,7 +86,7 @@ Unless required by applicable law or agreed to in writing, software distributed
   <div class="well-vertical-spacer">
     <%= link_to('Create An Item', new_media_object_path(collection_id: @collection.id), class: 'btn btn-primary') if can? :create, MediaObject %>
     <%= link_to('List All Items', search_catalog_path('f[collection_ssim][]' => @collection.name), class: 'btn btn-outline') %>
-    <%= button_tag('Edit Collection Info', class: 'btn btn-outline', data: {toggle:"modal", target:"#new_collection"}) if can? :update, @collection %>
+    <%= button_tag('Edit Collection Info', class: 'btn btn-outline', data: {toggle:"modal", target:"#new_collection", testid:"collection-edit-collection-info"}) if can? :update, @collection %>
   </div>
   <div>
     <p>Or <a

app/views/media_objects/_add_to_playlist.html.erb

@@ -20,7 +20,7 @@ Unless required by applicable law or agreed to in writing, software distributed
 <div id="add_to_playlist_panel">
   <div id="add_to_playlist_alert" class="alert">
     <button type="button" class="close" onclick="closeAlert()">&times;</button>
-    <p id="add_to_playlist_result_message"></p>
+    <p id="add_to_playlist_result_message" data-testid="media-object-playlist-result-msg"></p>
   </div>
   <div id="add_to_playlist_form_group">
     <% unless @add_playlist_item_playlists.empty? %>
@@ -31,21 +31,21 @@ Unless required by applicable law or agreed to in writing, software distributed
           </div>
           <div class="col">
             <div class="form-group">
-              <%= collection_select(:post, :playlist_id, @add_playlist_item_playlists, :id, :title, {}, {class: "form-control form-model", style: 'width:100%;'}) %>
+              <%= collection_select(:post, :playlist_id, @add_playlist_item_playlists, :id, :title, {}, {class: "form-control form-model",'data-testid': 'media-object-playlist-dropdown', style: 'width:100%;'}) %>
             </div>
           </div>
         </div>
 
-        <div id="add-to-playlist-form-group">
+        <div id="add-to-playlist-form-group" data-testid="media-object-add-to-playlist-form">
           <div class="form-check">
             <label class="form-check-label">
-              <input type="radio" onclick="collapseMoreDetails()" name="post[playlistitem_scope]" id="playlistitem_scope_track" aria-label="playlist item current track">
+              <input type="radio" onclick="collapseMoreDetails()" name="post[playlistitem_scope]" id="playlistitem_scope_track" aria-label="playlist item current track" data-testid="media-object-current-track-radio-btn">
                 <span id="current-track-text">Current Track (<span id="current-track-name"></span>)</span>
             </label>
           </div>
           <div class="form-check">
             <label class="form-check-label">
-              <input type="radio" onclick="collapseMoreDetails()" name="post[playlistitem_scope]" id="playlistitem_timeselection" aria-label="playlist item time selection">
+              <input type="radio" onclick="collapseMoreDetails()" name="post[playlistitem_scope]" id="playlistitem_timeselection" aria-label="playlist item time selection" data-testid="media-object-custom-timespan-radio-btn">
               Custom Timespan
             </label>
             <input type="text" name="playlist_item_start" id="playlist_item_start" pattern="(\d+:){0,2}\d+(\.\d+)?" value="" aria-label="start time">
@@ -54,13 +54,13 @@ Unless required by applicable law or agreed to in writing, software distributed
           </div>
           <div class="form-check">
             <label class="form-check-label" onclick="collapseMultiItemCheck()">
-              <input type="radio" name="post[playlistitem_scope]" id="playlistitem_scope_section" aria-label="playlist item current section">
+              <input type="radio" name="post[playlistitem_scope]" id="playlistitem_scope_section" aria-label="playlist item current section" data-testid="media-object-current-section-radio-btn">
               Current Section (<span id="current-section-name"></span>)
             </label>
           </div>
           <div class="form-check">
             <label class="form-check-label" onclick="collapseMultiItemCheck()">
-              <input type="radio" name="post[playlistitem_scope]" id="playlistitem_scope_item" aria-label="playlist item current item">
+              <input type="radio" name="post[playlistitem_scope]" id="playlistitem_scope_item" aria-label="playlist item current item" data-testid="media-object-all-section-radio-btn">
               All Sections
             </label>
           </div>
@@ -90,7 +90,7 @@ Unless required by applicable law or agreed to in writing, software distributed
           </div>
         </div>
         <div class="add-to-playlist-form-buttons">
-          <input type="submit" name="commit" value="Add" class="btn btn-primary mr-2" id="addToPlaylistSave" />
+          <input type="submit" name="commit" value="Add" class="btn btn-primary mr-2" id="addToPlaylistSave" data-testid="media-object-playlist-save-btn"/>
           <button type="button" class="btn btn-outline" onclick="resetAddToPlaylistForm()" data-toggle="collapse" data-target="#addToPlaylistPanel">Cancel</button>
         </div>
       </form>

app/views/modules/_access_object.html.erb

@@ -58,8 +58,8 @@ Unless required by applicable law or agreed to in writing, software distributed
           </div>
         <% end %>
         <div class="col-1">
-          <%= button_tag "Add", name: "submit_add_#{access_object}", type: "submit",
-            class: "btn btn-primary", style: 'margin-top:2.4rem', disabled: input_disabled, value: "Add" %>
+          <%= button_tag "Add",name: "submit_add_#{access_object}", type: "submit",
+            class: "btn btn-primary", style: 'margin-top:2.4rem', disabled: input_disabled, value: "Add", "data-testid": "collection-submit-add-#{access_object}" %>
         </div>
       </div>
     </div>
@@ -71,7 +71,7 @@ Unless required by applicable law or agreed to in writing, software distributed
         <% if members.present? %>
         <% members.each do |member_object| %>
         <tr>
-          <td class='access_list_label'>
+          <td class='access_list_label' data-testid="<%= 'collection-access-label-' + access_object %>">
             <%= label_tag do %>
             <% if defined?(display_helper) && display_helper.present? %>
             <%= self.send(display_helper, member_object) %>

app/views/modules/_flash_messages.html.erb

@@ -30,8 +30,8 @@ Unless required by applicable law or agreed to in writing, software distributed
       end
     -%>
     <% if flash[type] %>
-      <div class="alert <%=alert_class %>">
-        <button type="button" class="close" data-dismiss="alert">&times;</button>
+      <div class="alert <%=alert_class %>" data-testid="alert">
+        <button type="button" class="close" data-dismiss="alert" >&times;</button>
           <% Array(flash[type]).each do |msg| %>
           <p><%= msg %></p>
         <% end %>