Commit 900de4d9 authored by Sanad Liaquat's avatar Sanad Liaquat

Merge branch '345999-improve-pipeline-editor-test' into 'master'

Improving pipeline editor E2E test

See merge request gitlab-org/gitlab!75046
parents ed1837e7 cb8cc4ce
......@@ -98,6 +98,7 @@ export default {
class="gl-w-full gl-h-9 gl-rounded-0! gl-border-none! gl-border-b-solid! gl-border-1! gl-border-gray-100 gl-text-decoration-none! gl-outline-0! gl-display-flex"
:class="buttonClass"
:title="__('Toggle sidebar')"
data-qa-selector="toggle_sidebar_collapse_button"
@click="toggleDrawer"
>
<span v-if="isExpanded" class="gl-text-gray-500 gl-mr-3" data-testid="collapse-text">
......@@ -105,7 +106,12 @@ export default {
</span>
<gl-icon data-testid="toggle-icon" :name="buttonIconName" />
</gl-button>
<div v-if="isExpanded" class="gl-h-full gl-p-5" data-testid="drawer-content">
<div
v-if="isExpanded"
class="gl-h-full gl-p-5"
data-testid="drawer-content"
data-qa-selector="drawer_content"
>
<getting-started-card class="gl-mb-4" />
<first-pipeline-card class="gl-mb-4" />
<visualize-and-lint-card class="gl-mb-4" />
......
......@@ -247,6 +247,7 @@ export default {
<gl-infinite-scroll
:fetched-items="branches.length"
:max-list-height="250"
data-qa-selector="branch_menu_container"
@bottomReached="fetchNextBranches"
>
<template #items>
......@@ -255,7 +256,7 @@ export default {
:key="branch"
:is-checked="currentBranch === branch"
:is-check-item="true"
data-qa-selector="menu_branch_button"
data-qa-selector="branch_menu_item_button"
@click="selectBranch(branch)"
>
{{ branch }}
......
......@@ -96,6 +96,7 @@ export default {
:id="`source-editor-${fileGlobalId}`"
ref="editor"
data-editor-loading
data-qa-selector="source_editor_container"
@[$options.readyEvent]="$emit($options.readyEvent)"
>
<pre class="editor-loading-content">{{ value }}</pre>
......
......@@ -6,37 +6,59 @@ module QA
module PipelineEditor
class Show < QA::Page::Base
view 'app/assets/javascripts/pipeline_editor/components/file_nav/branch_switcher.vue' do
element :branch_selector_button
element :menu_branch_button
element :branch_selector_button, require: true
element :branch_menu_item_button
element :branch_menu_container
end
view 'app/assets/javascripts/pipeline_editor/components/commit/commit_form.vue' do
element :target_branch_field
element :target_branch_field, require: true
end
def has_branch_selector_button?
has_element? :branch_selector_button
view 'app/assets/javascripts/pipeline_editor/components/drawer/pipeline_editor_drawer.vue' do
element :toggle_sidebar_collapse_button
element :drawer_content
end
def click_branch_selector_button
wait_until(reload: false) do
has_element?(:branch_selector_button)
end
click_element(:branch_selector_button, skip_finished_loading_check: true)
view 'app/assets/javascripts/vue_shared/components/source_editor.vue' do
element :source_editor_container, require: true
end
def select_branch_from_dropdown(branch_to_switch_to)
wait_until(reload: false) do
has_element?(:menu_branch_button)
end
click_element(:menu_branch_button, text: branch_to_switch_to, skip_finished_loading_check: true)
def initialize
super
wait_for_requests
close_toggle_sidebar
end
def open_branch_selector_dropdown
click_element(:branch_selector_button)
end
def select_branch_from_dropdown(branch_name)
wait_for_animated_element(:branch_menu_container)
click_element(:branch_menu_item_button, text: branch_name)
wait_for_requests
end
def target_branch_name
wait_until(reload: false) do
has_element?(:target_branch_field)
end
find_element(:target_branch_field, skip_finished_loading_check: true).value
find_element(:target_branch_field).value
end
def editing_content
find_element(:source_editor_container).text
end
private
# If the page thinks user has never opened pipeline editor before
# It will expand pipeline editor sidebar by default
# Collapse the sidebar if it is expanded
def close_toggle_sidebar
return unless has_element?(:drawer_content)
click_element(:toggle_sidebar_collapse_button)
end
end
end
......
......@@ -2,7 +2,9 @@
module QA
RSpec.describe 'Verify' do
describe 'Pipeline editor', :requires_admin do
describe 'Pipeline editor' do
let(:random_test_string) { SecureRandom.hex(10) }
let(:project) do
Resource::Project.fabricate_via_api! do |project|
project.name = 'pipeline-editor-project'
......@@ -17,70 +19,71 @@ module QA
[
{
file_path: '.gitlab-ci.yml',
content: default_file_content
content: <<~YAML
stages:
- test
initialize:
stage: test
script:
- echo "I am now on branch #{project.default_branch}"
YAML
}
]
)
end
end
let!(:production_push) do
Resource::Repository::Push.fabricate! do |push|
push.repository_http_uri = project.repository_http_location.uri
push.branch_name = 'production'
push.file_name = '.gitlab-ci.yml'
push.file_content = production_file_content
end
end
let(:default_file_content) do
<<~YAML
stages:
- test
initialize:
stage: test
script:
- echo "initialized in #{project.default_branch}"
YAML
end
let!(:test_branch) do
Resource::Repository::ProjectPush.fabricate! do |resource|
resource.project = project
resource.branch_name = random_test_string
resource.file_name = '.gitlab-ci.yml'
resource.file_content = <<~YAML
stages:
- test
let(:production_file_content) do
<<~YAML
stages:
- test
initialize:
stage: test
script:
- echo "initialized in production"
YAML
initialize:
stage: test
script:
- echo "I am now on branch #{random_test_string}"
YAML
end
end
before do
Flow::Login.sign_in
project.visit!
Page::Project::Menu.perform(&:go_to_pipeline_editor)
# Project push sometimes takes a while to complete
# Making sure new branch is pushed successfully prior to interacting
Support::Retrier.retry_until(max_duration: 15, sleep_interval: 3, reload_page: false, message: 'Ensuring project has branch') do
project.has_branch?(random_test_string)
end
end
after do
project.remove_via_api!
Page::Main::Menu.perform(&:sign_out)
end
it 'can switch branches and target branch field updates accordingly', testcase: 'https://gitlab.com/gitlab-org/quality/testcases/-/quality/test_cases/1891' do
Page::Project::Menu.perform(&:go_to_pipeline_editor)
Page::Project::PipelineEditor::Show.perform do |show|
expect(show).to have_branch_selector_button
show.click_branch_selector_button
show.select_branch_from_dropdown(production_push.branch_name)
show.open_branch_selector_dropdown
show.select_branch_from_dropdown(random_test_string)
expect(show.target_branch_name).to eq(production_push.branch_name)
aggregate_failures do
expect(show.target_branch_name).to eq(random_test_string), 'Target branch field is not showing expected branch name.'
expect(show.editing_content).to have_content(random_test_string), 'Editor content does not include expected test string.'
end
show.click_branch_selector_button
show.open_branch_selector_dropdown
show.select_branch_from_dropdown(project.default_branch)
expect(show.target_branch_name).to eq(project.default_branch)
aggregate_failures do
expect(show.target_branch_name).to eq(project.default_branch), 'Target branch field is not showing expected branch name.'
expect(show.editing_content).to have_content(project.default_branch), 'Editor content does not include expected test string.'
end
end
end
end
......
......@@ -3,6 +3,7 @@
exports[`Source Editor component rendering matches the snapshot 1`] = `
<div
data-editor-loading=""
data-qa-selector="source_editor_container"
id="source-editor-snippet_777"
>
<pre
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment