Part 1: Abstract pipeline_variables_form to its own component

What does this MR do and why?

Part 1 for #520831

This work is behind a feature flag ci_inputs_for_pipelines

We need to abstract the pipeline variables form to it's own component in order to accommodate inputs work and also hide the component depending on settings.

Part 1 simply stubs out the new component and it's test file.

Step	MR
Set up component/query	[Current MR]
Build out pipeline variable form component	!182455 (merged)
Clean up and integration	!182475

Screenshots or screen recordings

With the flag disabled, there should be no UI change.

with flag enabled	with flag disabled

How to set up and validate locally

1. turn on the feature flag with Feature.enable(:ci_inputs_for_pipelines)
2. Navigate to Build > Pipeline editor and enter the following into your gitlab-ci.yml

variables:
  DEPLOY_ENVIRONMENT:
    value: "staging"
    options:
      - "production"
      - "staging"
      - "canary"
    description: "The deployment target. Set to 'staging' by default."

job:
  script: echo 1

3. Navigate to -/pipelines/new and verify that your variables are output where the pipeline variables form should be.
4. Turn off the feature flag and insure the variables form and createPipeline mutation work. To verify the variables in the mutation: comment out the line in pipeline_new_form.vue that says visitUrl(pipeline.path), click the "New pipeline" button, and check the network tab.

changed milestone to %17.10

added devopsverify frontend grouppipeline authoring maintenancerefactor sectionci typemaintenance workflowin dev labels

assigned to @bsandlin

added pipelinetier-1 label

	1 Warning
	This merge request contains lines with testid selectors. Please ensure e2e:test-on-omnibus job is run.

testid selectors

The following changed lines in this MR contain testid selectors:

app/assets/javascripts/ci/pipeline_new/components/pipeline_new_form.vue

+            data-testid="ci-variable-row-container"
+                data-testid="pipeline-form-ci-variable-type"
+                data-testid="pipeline-form-ci-variable-key-field"
+                data-testid="pipeline-form-ci-variable-value-dropdown"
+                data-testid="pipeline-form-ci-variable-value-field"
-        data-testid="ci-variable-row-container"
-            data-testid="pipeline-form-ci-variable-type"
-            data-testid="pipeline-form-ci-variable-key-field"
-            data-testid="pipeline-form-ci-variable-value-dropdown"
-            data-testid="pipeline-form-ci-variable-value-field"
+                  data-testid="remove-ci-variable-row"
-              data-testid="remove-ci-variable-row"
+                  data-testid="ci-cd-settings-link"
-            <gl-link v-if="isMaintainer" :href="settingsLink" data-testid="ci-cd-settings-link">{{
-        data-testid="run-pipeline-button"
+          data-testid="run-pipeline-button"

If the e2e:test-on-omnibus job in the qa stage has run automatically, please ensure the tests are passing. If the job has not run, please start the manual:e2e-test-pipeline-generate job in the prepare stage and ensure the tests in follow-up:e2e:test-on-omnibus-ee pipeline are passing.

For the list of known failures please refer to the latest pipeline triage issue.

If your changes are under a feature flag, please check our Testing with feature flags documentation for instructions.

Reviewer roulette

Category	Reviewer	Maintainer
backend	@fdegier (UTC+1, 7 hours ahead of author)	@hustewart (UTC-5, 1 hour ahead of author)
frontend	@jrushford (UTC+1, 7 hours ahead of author)	@svedova (UTC+1, 7 hours ahead of author)
test for spec/features/*	@fdegier (UTC+1, 7 hours ahead of author)	Maintainer review is optional for test for spec/features/*
devopsverify	Reviewer review is optional for devopsverify	@tianwenchen (UTC+8, 14 hours ahead of author)

Please refer to documentation page for guidance on how you can benefit from the Reviewer Roulette, or use the GitLab Review Workload Dashboard to find other available reviewers.

If needed, you can retry the danger-review job that generated this comment.

Generated by Danger

added 5 commits

• bc1aac24...6b32402e - 2 commits from branch master
• e427ea39 - Abstract pipeline_variables_form to its own component
• 29d40870 - unit tests
• 23db4519 - Boilerplate code for pipeline_variables_form.vue

Compare with previous version

added 149 commits

• 23db4519...3cfc1afe - 148 commits from branch master
• 09e9aee3 - Abstract pipeline_variables_form to its own component

Compare with previous version

changed the description

changed the description

added 15 commits

• 09e9aee3...cb978ad4 - 14 commits from branch master
• 857e1eb4 - Abstract pipeline_variables_form to its own component

Compare with previous version

marked this merge request as draft

changed the description

mentioned in merge request !182455 (merged)

added 13 commits

• 857e1eb4...6eda972b - 12 commits from branch master
• 98b607b9 - Abstract pipeline_variables_form to its own component

Compare with previous version

added 1 commit

• b75eec16 - Abstract pipeline_variables_form to its own component

Compare with previous version

added 19 commits

• b75eec16...fa21a816 - 18 commits from branch master
• 86096501 - Abstract pipeline_variables_form to its own component

Compare with previous version

mentioned in merge request !182475

changed the description