Update e2e radio buttons

Updates e2e use of radio buttons
Updates and adds some qa selectors

app/assets/javascripts/ide/components/commit_sidebar/actions.vue

@@ -76,8 +76,9 @@ export default {
       :value="$options.commitToCurrentBranch"
       :disabled="!canPushToBranch"
       :title="$options.currentBranchPermissionsTooltip"
+      data-qa-selector="commit_to_current_branch_radio_container"
     >
-      <span class="ide-option-label" data-qa-selector="commit_to_current_branch_radio">
+      <span class="ide-option-label">
         <gl-sprintf :message="s__('IDE|Commit to %{branchName} branch')">
           <template #branchName>
             <strong class="monospace">{{ currentBranchText }}</strong>

app/assets/javascripts/ide/components/commit_sidebar/radio_group.vue

@@ -64,6 +64,7 @@ export default {
         :disabled="disabled"
         type="radio"
         name="commit-action"
+        data-qa-selector="commit_type_radio"
         @change="updateCommitAction($event.target.value)"
       />
       <span class="gl-ml-3">

app/views/projects/_merge_request_merge_method_settings.html.haml

@@ -22,7 +22,7 @@
         = s_('ProjectSettings|When there is a merge conflict, the user is given the option to rebase.')
 
   .form-check.mb-2
-    = form.radio_button :merge_method, :ff, class: "js-merge-method-radio form-check-input", data: { qa_selector: 'merge_ff_radio_button' }
+    = form.radio_button :merge_method, :ff, class: "js-merge-method-radio form-check-input", data: { qa_selector: 'merge_ff_radio' }
     = label_tag :project_merge_method_ff, class: 'form-check-label' do
       = s_('ProjectSettings|Fast-forward merge')
       .text-secondary

app/views/shared/_group_form.html.haml

@@ -6,7 +6,7 @@
   .form-group.group-name-holder.col-sm-12
     = f.label :name, class: 'label-bold' do
       = _("Group name")
-    = f.text_field :name, placeholder: _('My Awesome Group'), class: 'js-autofill-group-name form-control input-lg',
+    = f.text_field :name, placeholder: _('My Awesome Group'), class: 'js-autofill-group-name form-control input-lg', data: { qa_selector: 'group_name_field' },
       required: true,
       title: _('Please fill in a descriptive name for your group.'),
       autofocus: true
@@ -22,7 +22,7 @@
           - if parent
             %strong= parent.full_path + '/'
       = f.hidden_field :parent_id
-      = f.text_field :path, placeholder: _('my-awesome-group'), class: 'form-control js-validate-group-path js-autofill-group-path',
+      = f.text_field :path, placeholder: _('my-awesome-group'), class: 'form-control js-validate-group-path js-autofill-group-path', data: { qa_selector: 'group_path_field' },
         autofocus: local_assigns[:autofocus] || false, required: true,
         pattern: Gitlab::PathRegex::NAMESPACE_FORMAT_REGEX_JS,
         title: _('Please choose a group URL with no special characters.'),

app/views/shared/tokens/_scopes_form.html.haml

@@ -4,6 +4,6 @@
 
 - scopes.each do |scope|
   %fieldset.form-group.form-check
-    = check_box_tag "#{prefix}[scopes][]", scope, token.scopes.include?(scope), id: "#{prefix}_scopes_#{scope}", class: "form-check-input qa-#{scope}-radio"
+    = check_box_tag "#{prefix}[scopes][]", scope, token.scopes.include?(scope), id: "#{prefix}_scopes_#{scope}", class: "form-check-input", data: { qa_selector: "#{scope}_checkbox" }
     = label_tag "#{prefix}_scopes_#{scope}", scope, class: 'label-bold form-check-label'
     .text-secondary= t scope, scope: scope_description(prefix)

ee/app/views/ldap_group_links/_form.html.haml

@@ -13,7 +13,7 @@
             = f.label :cn, "Sync method"
           .col-sm-10
             .form-check
-              = radio_button_tag :sync_method, :group, true, class: 'form-check-input'
+              = radio_button_tag :sync_method, :group, true, class: 'form-check-input', data: { qa_selector: 'ldap_sync_group_radio' }
               = label_tag :sync_method_group, class: 'form-check-label' do
                 LDAP Group cn
             .form-check
@@ -36,7 +36,7 @@
           .col-sm-2.col-form-label
             = f.label :filter, "LDAP User filter"
           .col-sm-10
-            = f.text_field :filter, placeholder: 'Ex. (&(objectCategory=person)(objectClass=developer))', class: 'form-control xxlarge input-mn-300 qa-ldap-user-filter-text-field'
+            = f.text_field :filter, placeholder: 'Ex. (&(objectCategory=person)(objectClass=developer))', class: 'form-control xxlarge input-mn-300', data: { qa_selector: 'ldap_user_filter_field' }
             .form-text.text-muted
               - ldap_link = link_to 'LDAP Search Filter Syntax', 'https://msdn.microsoft.com/en-us/library/aa746475(v=vs.85).aspx'
               This query must use valid #{ldap_link}. Synchronize #{group.name}'s members with this LDAP user filter.

qa/qa.rb

@@ -505,6 +505,7 @@ module QA
       autoload :WikiPageForm, 'qa/page/component/wiki_page_form'
       autoload :AccessTokens, 'qa/page/component/access_tokens'
       autoload :CommitModal, 'qa/page/component/commit_modal'
+      autoload :VisibilitySetting, 'qa/page/component/visibility_setting'
 
       module Issuable
         autoload :Common, 'qa/page/component/issuable/common'

qa/qa/ee/page/group/settings/ldap_sync.rb

@@ -9,26 +9,27 @@ module QA
             include QA::Page::Component::Select2
 
             view 'ee/app/views/ldap_group_links/_form.html.haml' do
-              element :ldap_group_cn_select
               element :add_sync_button
-              element :ldap_user_filter_text_field
+              element :ldap_group_cn_select
+              element :ldap_sync_group_radio
+              element :ldap_user_filter_field
             end
 
-            def set_sync_method(method)
-              choose method
+            def set_ldap_group_sync_method
+              choose_element(:ldap_sync_group_radio)
             end
 
             def set_group_cn(group_cn)
-              click_element :ldap_group_cn_select
+              click_element(:ldap_group_cn_select)
               search_and_select(group_cn)
             end
 
             def set_user_filter(user_filter)
-              fill_element :ldap_user_filter_text_field, user_filter
+              fill_element(:ldap_user_filter_field, user_filter)
             end
 
             def click_add_sync_button
-              click_element :add_sync_button
+              click_element(:add_sync_button)
             end
           end
         end

qa/qa/ee/page/project/secure/configuration_form.rb

@@ -13,6 +13,10 @@ module QA
               element :submit_button
             end
 
+            view 'ee/app/assets/javascripts/security_configuration/sast/components/analyzer_configuration.vue' do
+              element :entity_checkbox, "`${entity.name}_checkbox`" # rubocop:disable QA/ElementWithPattern
+            end
+
             def click_expand_button
               expand_content(:analyzer_settings_content)
             end
@@ -30,9 +34,7 @@ module QA
             end
 
             def unselect_dynamic_checkbox(checkbox_name)
-              # Workaround until https://gitlab.com/gitlab-org/gitlab/-/issues/323297 is resolved
-              # uncheck_element("#{checkbox_name}_checkbox")
-              page.driver.browser.action.move_to(find_element("#{checkbox_name}_checkbox", visible: false).native).click.perform
+              uncheck_element("#{checkbox_name}_checkbox", true)
             end
 
             def has_sast_status?(status_text)

qa/qa/page/base.rb

@@ -132,16 +132,16 @@ module QA
         all(element_selector_css(name), **kwargs)
       end
 
-      def check_element(name, click_by_js = false)
-        if find_element(name, visible: false).checked?
+      def check_element(name, click_by_js = false, visibility = false)
+        if find_element(name, visible: visibility).checked?
           QA::Runtime::Logger.debug("#{name} is already checked")
 
           return
         end
 
         retry_until(sleep_interval: 1) do
-          click_checkbox_or_radio(name, click_by_js)
-          checked = find_element(name, visible: false).checked?
+          click_checkbox_or_radio(name, click_by_js, visibility)
+          checked = find_element(name, visible: visibility).checked?
 
           QA::Runtime::Logger.debug(checked ? "#{name} was checked" : "#{name} was not checked")
 
@@ -149,16 +149,16 @@ module QA
         end
       end
 
-      def uncheck_element(name, click_by_js = false)
-        unless find_element(name, visible: false).checked?
+      def uncheck_element(name, click_by_js = false, visibility = false)
+        unless find_element(name, visible: visibility).checked?
           QA::Runtime::Logger.debug("#{name} is already unchecked")
 
           return
         end
 
         retry_until(sleep_interval: 1) do
-          click_checkbox_or_radio(name, click_by_js)
-          unchecked = !find_element(name, visible: false).checked?
+          click_checkbox_or_radio(name, click_by_js, visibility)
+          unchecked = !find_element(name, visible: visibility).checked?
 
           QA::Runtime::Logger.debug(unchecked ? "#{name} was unchecked" : "#{name} was not unchecked")
 
@@ -167,21 +167,22 @@ module QA
       end
 
       # Method for selecting radios
-      def choose_element(name, click_by_js = false)
-        if find_element(name, visible: false).checked?
+      def choose_element(name, click_by_js = false, visibility = false)
+        if find_element(name, visible: visibility).checked?
           QA::Runtime::Logger.debug("#{name} is already selected")
 
           return
         end
 
         retry_until(sleep_interval: 1) do
-          click_checkbox_or_radio(name, click_by_js)
-          selected = find_element(name, visible: false).checked?
+          click_checkbox_or_radio(name, click_by_js, visibility)
+          selected = find_element(name, visible: visibility).checked?
 
           QA::Runtime::Logger.debug(selected ? "#{name} was selected" : "#{name} was not selected")
 
           selected
         end
+        wait_for_requests
       end
 
       # Use this to simulate moving the pointer to an element's coordinate
@@ -424,8 +425,8 @@ module QA
 
       private
 
-      def click_checkbox_or_radio(name, click_by_js)
-        box = find_element(name, visible: false)
+      def click_checkbox_or_radio(name, click_by_js, visibility)
+        box = find_element(name, visible: visibility)
         # Some checkboxes and radio buttons are hidden by their labels and cannot be clicked directly
         click_by_js ? page.execute_script("arguments[0].click();", box) : box.click
       end

qa/qa/page/component/access_tokens.rb

@@ -19,7 +19,7 @@ module QA
           end
 
           base.view 'app/views/shared/tokens/_scopes_form.html.haml' do
-            element :api_radio, 'qa-#{scope}-radio' # rubocop:disable QA/ElementWithPattern, Lint/InterpolationCheck
+            element :api_checkbox, '#{scope}_checkbox' # rubocop:disable QA/ElementWithPattern, Lint/InterpolationCheck
           end
 
           base.view 'app/views/shared/access_tokens/_created_container.html.haml' do
@@ -36,7 +36,7 @@ module QA
         end
 
         def check_api
-          check_element(:api_radio)
+          check_element(:api_checkbox)
         end
 
         def click_create_token_button

qa/qa/page/component/visibility_setting.rb

+# frozen_string_literal: true
+
+module QA
+  module Page
+    module Component
+      module VisibilitySetting
+        extend QA::Page::PageConcern
+
+        def self.included(base)
+          super
+
+          base.view 'app/views/shared/_visibility_radios.html.haml' do
+            element :visibility_radio, 'qa_selector: "#{visibility_level_label(level).downcase}_radio"' # rubocop:disable QA/ElementWithPattern, Lint/InterpolationCheck
+          end
+        end
+
+        def set_visibility(visibility)
+          choose_element("#{visibility.downcase}_radio", false, true)
+        end
+      end
+    end
+  end
+end

qa/qa/page/group/new.rb

@@ -4,23 +4,20 @@ module QA
   module Page
     module Group
       class New < Page::Base
+        include Page::Component::VisibilitySetting
+
         view 'app/views/shared/_group_form.html.haml' do
-          element :group_path_field, 'text_field :path' # rubocop:disable QA/ElementWithPattern
-          element :group_name_field, 'text_field :name' # rubocop:disable QA/ElementWithPattern
+          element :group_path_field
+          element :group_name_field
         end
 
         view 'app/views/groups/_new_group_fields.html.haml' do
           element :create_group_button, "submit _('Create group')" # rubocop:disable QA/ElementWithPattern
-          element :visibility_radios, 'visibility_level:' # rubocop:disable QA/ElementWithPattern
         end
 
         def set_path(path)
-          fill_in 'group_path', with: path
-          fill_in 'group_name', with: path
-        end
-
-        def set_visibility(visibility)
-          choose visibility
+          fill_element(:group_path_field, path)
+          fill_element(:group_name_field, path)
         end
 
         def create

qa/qa/page/group/settings/general.rb

@@ -6,6 +6,7 @@ module QA
       module Settings
         class General < QA::Page::Base
           include ::QA::Page::Settings::Common
+          include Page::Component::VisibilitySetting
 
           view 'app/views/groups/edit.html.haml' do
             element :permission_lfs_2fa_content
@@ -21,10 +22,6 @@ module QA
             element :save_name_visibility_settings_button
           end
 
-          view 'app/views/shared/_visibility_radios.html.haml' do
-            element :internal_radio, 'qa_selector: "#{visibility_level_label(level).downcase}_radio"' # rubocop:disable QA/ElementWithPattern, Lint/InterpolationCheck
-          end
-
           view 'app/views/groups/settings/_lfs.html.haml' do
             element :lfs_checkbox
           end
@@ -56,10 +53,6 @@ module QA
             find_element(:group_name_field).set name
           end
 
-          def set_group_visibility(visibility)
-            find_element("#{visibility.downcase}_radio").click
-          end
-
           def click_save_name_visibility_settings_button
             click_element(:save_name_visibility_settings_button)
           end

qa/qa/page/project/new.rb

@@ -4,8 +4,9 @@ module QA
   module Page
     module Project
       class New < Page::Base
-        include Page::Component::Select2
         include Page::Component::Project::Templates
+        include Page::Component::Select2
+        include Page::Component::VisibilitySetting
 
         view 'app/views/projects/new.html.haml' do
           element :project_create_from_template_tab
@@ -59,10 +60,6 @@ module QA
           click_element(:project_create_from_template_tab)
         end
 
-        def set_visibility(visibility)
-          choose visibility.capitalize
-        end
-
         def click_github_link
           click_link 'GitHub'
         end

qa/qa/page/project/settings/merge_request.rb

@@ -12,7 +12,7 @@ module QA
           end
 
           view 'app/views/projects/_merge_request_merge_method_settings.html.haml' do
-            element :merge_ff_radio_button
+            element :merge_ff_radio
           end
 
           view 'app/views/projects/_merge_request_merge_checks_settings.html.haml' do
@@ -24,7 +24,7 @@ module QA
           end
 
           def enable_ff_only
-            click_element(:merge_ff_radio_button)
+            choose_element(:merge_ff_radio)
             click_save_changes
           end
 

qa/qa/page/project/web_ide/edit.rb

@@ -36,7 +36,7 @@ module QA
           end
 
           view 'app/assets/javascripts/ide/components/commit_sidebar/actions.vue' do
-            element :commit_to_current_branch_radio
+            element :commit_to_current_branch_radio_container
           end
 
           view 'app/assets/javascripts/ide/components/commit_sidebar/form.vue' do
@@ -44,6 +44,10 @@ module QA
             element :commit_button
           end
 
+          view 'app/assets/javascripts/ide/components/commit_sidebar/radio_group.vue' do
+            element :commit_type_radio
+          end
+
           view 'app/assets/javascripts/ide/components/repo_editor.vue' do
             element :editor_container
           end
@@ -216,7 +220,9 @@ module QA
               # animation is still in process even when the buttons have the
               # expected visibility.
               commit_success = retry_until(sleep_interval: 5) do
-                click_element(:commit_to_current_branch_radio) if has_element?(:commit_to_current_branch_radio)
+                within_element(:commit_to_current_branch_radio_container) do
+                  choose_element(:commit_type_radio)
+                end
                 click_element(:commit_button) if has_element?(:commit_button)
 
                 # If this is the first commit, the commit SHA only appears after reloading

qa/qa/specs/features/ee/browser_ui/1_manage/group/group_ldap_sync_spec.rb

@@ -89,7 +89,7 @@ module QA
           Page::Group::Menu.perform(&:go_to_ldap_sync_settings)
 
           EE::Page::Group::Settings::LDAPSync.perform do |settings|
-            settings.set_sync_method('LDAP Group cn')
+            settings.set_ldap_group_sync_method
             settings.set_group_cn('Engineering')
             settings.click_add_sync_button
           end