E2E - Update CI file with pipeline editor

app/assets/javascripts/pipeline_editor/components/commit/commit_form.vue

@@ -142,6 +142,7 @@ export default {
           class="js-no-auto-disable"
           category="primary"
           variant="confirm"
+          data-qa-selector="commit_changes_button"
           :disabled="submitDisabled"
           :loading="isSaving"
         >

app/assets/javascripts/pipeline_editor/components/header/pipeline_status.vue

@@ -153,7 +153,9 @@ export default {
         <span class="gl-font-weight-bold">
           <gl-sprintf :message="$options.i18n.pipelineInfo">
             <template #id="{ content }">
-              <span data-testid="pipeline-id"> {{ content }}{{ pipelineId }} </span>
+              <span data-testid="pipeline-id" data-qa-selector="pipeline_id_content">
+                {{ content }}{{ pipelineId }}
+              </span>
             </template>
             <template #status>{{ status.text }}</template>
             <template #commit>

qa/qa/page/project/pipeline_editor/show.rb

@@ -24,6 +24,14 @@ module QA
             element :source_editor_container, require: true
           end
 
+          view 'app/assets/javascripts/pipeline_editor/components/header/pipeline_status.vue' do
+            element :pipeline_id_content
+          end
+
+          view 'app/assets/javascripts/pipeline_editor/components/commit/commit_form.vue' do
+            element :commit_changes_button
+          end
+
           def initialize
             super
 
@@ -50,6 +58,28 @@ module QA
             find_element(:source_editor_container).text
           end
 
+          def write_to_editor(text)
+            find_element(:source_editor_container).fill_in(with: text)
+          end
+
+          def submit_changes
+            click_element(:commit_changes_button)
+
+            wait_for_requests
+          end
+
+          def set_target_branch(name)
+            find_element(:target_branch_field).fill_in(with: name)
+          end
+
+          def current_branch
+            find_element(:branch_selector_button).text
+          end
+
+          def pipeline_id
+            find_element(:pipeline_id_content).text.delete!('#').to_i
+          end
+
           private
 
           # If the page thinks user has never opened pipeline editor before

qa/qa/specs/features/browser_ui/4_verify/pipeline/update_ci_file_with_pipeline_editor_spec.rb

+# frozen_string_literal: true
+
+module QA
+  RSpec.describe 'Verify' do
+    describe 'Update CI file with 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'
+        end
+      end
+
+      let!(:commit) do
+        Resource::Repository::Commit.fabricate_via_api! do |commit|
+          commit.project = project
+          commit.commit_message = 'Add .gitlab-ci.yml'
+          commit.add_files(
+            [
+              {
+                file_path: '.gitlab-ci.yml',
+                content: <<~YAML
+                  test_job:
+                    script:
+                      - echo "Simple test!"
+                YAML
+              }
+            ]
+          )
+        end
+      end
+
+      before do
+        Flow::Login.sign_in
+        project.visit!
+        Page::Project::Menu.perform(&:go_to_pipeline_editor)
+      end
+
+      after do
+        project.remove_via_api!
+      end
+
+      it 'creates new pipeline and target branch', testcase: 'https://gitlab.com/gitlab-org/gitlab/-/quality/test_cases/349005' do
+        Page::Project::PipelineEditor::Show.perform do |show|
+          show.write_to_editor(random_test_string)
+          show.set_target_branch(random_test_string)
+          show.submit_changes
+
+          aggregate_failures do
+            expect(show.target_branch_name).to eq(random_test_string)
+            expect(show.current_branch).to eq(random_test_string)
+            expect(show.editing_content).to have_content(random_test_string)
+            expect(show.pipeline_id).to eq(project.pipelines.first[:id])
+          end
+        end
+
+        expect(project).to have_branch(random_test_string)
+      end
+    end
+  end
+end