Add identifiers for onboarding popovers

- Add button styles for onboarding welcome page
- Fix qa selector (due to additional class)

app/assets/javascripts/pipelines/components/pipeline_url.vue

@@ -60,7 +60,7 @@ export default {
 </script>
 <template>
   <div class="table-section section-10 d-none d-sm-none d-md-block pipeline-tags">
-    <gl-link :href="pipeline.path" class="js-pipeline-url-link">
+    <gl-link :href="pipeline.path" class="js-pipeline-url-link js-onboarding-pipeline-item">
       <span class="pipeline-id">#{{ pipeline.id }}</span>
     </gl-link>
     <div class="label-container">

app/assets/stylesheets/components/popover.scss

@@ -135,11 +135,5 @@
   .popover {
     min-width: auto;
     max-width: 40%;
-
-    .popover-body {
-      padding-top: $gl-padding;
-      padding-bottom: $gl-padding;
-      font-size: $gl-font-size-small;
-    }
   }
 }

app/views/layouts/header/_new_dropdown.haml

 %li.header-new.dropdown{ data: { track_label: "new_dropdown", track_event: "click_dropdown" } }
-  = link_to new_project_path, class: "header-new-dropdown-toggle has-tooltip qa-new-menu-toggle", title: _("New..."), ref: 'tooltip', aria: { label: _("New...") }, data: { toggle: 'dropdown', placement: 'bottom', container: 'body', display: 'static' } do
+  = link_to new_project_path, class: "header-new-dropdown-toggle has-tooltip qa-new-menu-toggle", id: "js-onboarding-new-project-link", title: _("New..."), ref: 'tooltip', aria: { label: _("New...") }, data: { toggle: 'dropdown', placement: 'bottom', container: 'body', display: 'static' } do
     = sprite_icon('plus-square', size: 16)
     = sprite_icon('angle-down', css_class: 'caret-down')
   .dropdown-menu.dropdown-menu-right

app/views/layouts/nav/sidebar/_project.html.haml

@@ -50,7 +50,7 @@
           = link_to project_tree_path(@project), class: 'shortcuts-tree qa-project-menu-repo' do
             .nav-icon-container
               = sprite_icon('doc-text')
-            %span.nav-item-name
+            %span.nav-item-name#js-onboarding-repo-link
               = _('Repository')
 
           %ul.sidebar-sub-level-items
@@ -64,11 +64,11 @@
                 = _('Files')
 
             = nav_link(controller: [:commit, :commits]) do
-              = link_to project_commits_path(@project, current_ref) do
+              = link_to project_commits_path(@project, current_ref), id: 'js-onboarding-commits-link' do
                 = _('Commits')
 
             = nav_link(html_options: {class: branches_tab_class}) do
-              = link_to project_branches_path(@project), class: 'qa-branches-link' do
+              = link_to project_branches_path(@project), class: 'qa-branches-link', id: 'js-onboarding-branches-link' do
                 = _('Branches')
 
             = nav_link(controller: [:tags]) do
@@ -98,7 +98,7 @@
           = link_to project_issues_path(@project), class: 'shortcuts-issues qa-issues-item' do
             .nav-icon-container
               = sprite_icon('issues')
-            %span.nav-item-name
+            %span.nav-item-name#js-onboarding-issues-link
               = _('Issues')
             - if @project.issues_enabled?
               %span.badge.badge-pill.count.issue_counter
@@ -153,7 +153,7 @@
           = link_to project_merge_requests_path(@project), class: 'shortcuts-merge_requests qa-merge-requests-link' do
             .nav-icon-container
               = sprite_icon('git-merge')
-            %span.nav-item-name
+            %span.nav-item-name#js-onboarding-mr-link
               = _('Merge Requests')
             %span.badge.badge-pill.count.merge_counter.js-merge-counter
               = number_with_delimiter(@project.open_merge_requests_count)
@@ -170,7 +170,7 @@
           = link_to project_pipelines_path(@project), class: 'shortcuts-pipelines qa-link-pipelines' do
             .nav-icon-container
               = sprite_icon('rocket')
-            %span.nav-item-name
+            %span.nav-item-name#js-onboarding-pipelines-link
               = _('CI / CD')
 
           %ul.sidebar-sub-level-items
@@ -335,7 +335,7 @@
           = link_to edit_project_path(@project), class: 'shortcuts-tree' do
             .nav-icon-container
               = sprite_icon('settings')
-            %span.nav-item-name.qa-settings-item
+            %span.nav-item-name.qa-settings-item#js-onboarding-settings-link
               = _('Settings')
 
           %ul.sidebar-sub-level-items
@@ -351,7 +351,7 @@
                   %span
                     = _('General')
             = nav_link(controller: :project_members) do
-              = link_to project_project_members_path(@project), title: _('Members'), class: 'qa-link-members-settings' do
+              = link_to project_project_members_path(@project), title: _('Members'), class: 'qa-link-members-settings', id: 'js-onboarding-settings-members-link' do
                 %span
                   = _('Members')
             - if can_edit

app/views/projects/branches/_branch.html.haml

@@ -56,7 +56,7 @@
 
     - if branch.name != @repository.root_ref
       = link_to project_compare_path(@project, @repository.root_ref, branch.name),
-        class: "btn btn-default #{'prepend-left-10' unless merge_project}",
+        class: "btn btn-default js-onboarding-compare-branches #{'prepend-left-10' unless merge_project}",
         title: s_('Branches|Compare') do
         = s_('Branches|Compare')
 

app/views/projects/commits/_commit.html.haml

@@ -20,9 +20,9 @@
   .commit-detail.flex-list
     .commit-content.qa-commit-content
       - if view_details && merge_request
-        = link_to commit.title, project_commit_path(project, commit.id, merge_request_iid: merge_request.iid), class: "commit-row-message item-title"
+        = link_to commit.title, project_commit_path(project, commit.id, merge_request_iid: merge_request.iid), class: "commit-row-message item-title js-onboarding-commit-item"
       - else
-        = link_to_markdown_field(commit, :title, link, class: "commit-row-message item-title")
+        = link_to_markdown_field(commit, :title, link, class: "commit-row-message item-title js-onboarding-commit-item")
       %span.commit-row-message.d-inline.d-sm-none
         ·
         = commit.short_id

app/views/projects/issues/_issue.html.haml

@@ -6,7 +6,7 @@
     .issuable-info-container
       .issuable-main-info
         .issue-title.title
-          %span.issue-title-text{ dir: "auto" }
+          %span.issue-title-text.js-onboarding-issue-item{ dir: "auto" }
             - if issue.confidential?
               %span.has-tooltip{ title: _('Confidential') }
                 = confidential_icon(issue)

app/views/projects/merge_requests/_merge_request.html.haml

@@ -6,7 +6,7 @@
   .issuable-info-container
     .issuable-main-info
       .merge-request-title.title
-        %span.merge-request-title-text
+        %span.merge-request-title-text.js-onboarding-mr-item
           = link_to merge_request.title, merge_request_path(merge_request)
         - if merge_request.tasks?
           %span.task-status.d-none.d-sm-inline-block

qa/qa/page/project/pipeline/index.rb

@@ -4,7 +4,7 @@ module QA::Page
   module Project::Pipeline
     class Index < QA::Page::Base
       view 'app/assets/javascripts/pipelines/components/pipeline_url.vue' do
-        element :pipeline_link, 'class="js-pipeline-url-link"' # rubocop:disable QA/ElementWithPattern
+        element :pipeline_link, 'class="js-pipeline-url-link' # rubocop:disable QA/ElementWithPattern
       end
 
       def click_on_latest_pipeline