Merge branch 'ml-qa-optimize-group-filter' into 'master'

QA: Optimize groups filter

See merge request gitlab-org/gitlab-ce!21994

app/views/shared/groups/_empty_state.html.haml

-.group-empty-state.row.align-items-center.justify-content-center.qa-groups-empty-state
+.group-empty-state.row.align-items-center.justify-content-center
   .icon.text-center.order-md-2
     = custom_icon("icon_empty_groups")
 

app/views/shared/groups/_search_form.html.haml

 = form_tag request.path, method: :get, class: "group-filter-form js-group-filter-form", id: 'group-filter-form' do |f|
-  = search_field_tag :filter, params[:filter], placeholder: s_('GroupsTree|Search by name'), class: 'group-filter-form-field form-control js-groups-list-filter', spellcheck: false, id: 'group-filter-form-field', tabindex: "2"
+  = search_field_tag :filter, params[:filter], placeholder: s_('GroupsTree|Search by name'), class: 'group-filter-form-field form-control js-groups-list-filter qa-groups-filter', spellcheck: false, id: 'group-filter-form-field', tabindex: "2"

qa/qa/page/component/groups_filter.rb

@@ -6,12 +6,7 @@ module QA
       module GroupsFilter
         def self.included(base)
           base.view 'app/views/shared/groups/_search_form.html.haml' do
-            element :groups_filter, 'search_field_tag :filter'
-            element :groups_filter_placeholder, 'Search by name'
-          end
-
-          base.view 'app/views/shared/groups/_empty_state.html.haml' do
-            element :groups_empty_state
+            element :groups_filter
           end
 
           base.view 'app/assets/javascripts/groups/components/groups.vue' do
@@ -21,13 +16,22 @@ module QA
 
         private
 
-        def filter_by_name(name)
+        def has_filtered_group?(name)
+          # Filter and submit to reload the page and only retrieve the filtered results
+          find_element(:groups_filter).set(name).send_keys(:return)
+
+          # Since we submitted after filtering, the presence of
+          # groups_list_tree_container means we have the complete filtered list
+          # of groups
           wait(reload: false) do
-            page.has_css?(element_selector_css(:groups_empty_state)) ||
             page.has_css?(element_selector_css(:groups_list_tree_container))
           end
 
-          fill_in 'Search by name', with: name
+          # If there are no groups we'll know immediately because we filtered the list
+          return false if page.has_text?('No groups or projects matched your search', wait: 0)
+
+          # The name will be present as filter input so we check for a link, not text
+          page.has_link?(name, wait: 0)
         end
       end
     end

qa/qa/page/dashboard/groups.rb

+# frozen_string_literal: true
+
 module QA
   module Page
     module Dashboard
@@ -14,9 +16,7 @@ module QA
         end
 
         def has_group?(name)
-          filter_by_name(name)
-
-          page.has_link?(name)
+          has_filtered_group?(name)
         end
 
         def go_to_group(name)

qa/qa/page/group/show.rb

+# frozen_string_literal: true
+
 module QA
   module Page
     module Group
@@ -25,11 +27,7 @@ module QA
         end
 
         def has_subgroup?(name)
-          filter_by_name(name)
-
-          page.has_text?(/#{name}|No groups or projects matched your search/, wait: 60)
-
-          page.has_text?(name, wait: 0)
+          has_filtered_group?(name)
         end
 
         def go_to_new_subgroup