Skip to content

Add validation rules to CI Variable drawer

Mireya Andres requested to merge validate-ci-variable-drawer into master

What does this MR do and why?

Implements part of #421262 (closed).

This implements some validation rules for the CI Variable drawer, which will soon replace the modal form in the CI/CD Variable settings. The drawer is under development in the ci_variable_drawer feature flag.

The list of validation rules implemented in this MR are the ones checked in this checklist.

To keep this MR small and easier to review, I am splitting the implementation into two MRs. Unchecked items from the checklist (validation for the Value field and tracking) will be implemented in another MR, since these have more complex rules.

Note that selecting a new environment scope from the environment scope dropdown will not work at the moment; this will be implemented later in #421263 (closed).

The reviewer might find it helpful to go through this MR by commit, since changes to each field are isolated that way. Here is a summary of changes:

Commit Changes
!129349 (9db7109d) Validate variable type and environment scope dropdown
!129349 (eafcc730) Update drawer text based on mode
!129349 (68f4f49d) Validate Expanded flag
!129349 (66c8a287) Validate Protect flag
!129349 (7f796f68) Validate Masked flag

This issue is part of larger effort to replace the CI Variables modal with the drawer. Other functions will be implemented in future iterations. Refer to the roadmap below:

Iteration MR
Setup drawer with feature flag !126197 (merged)
Add form validations 👈 You are here!
Ensure that all mutations are working and update QA specs
Rollout #418005 (closed)

Screenshots or screen recordings

Adding a Variable

The drawer text is changed to Add Variable and the fields are pre-filled with the default values for a CI variable.

add_variable

Editing a Variable

The drawer text is changed to Edit Variable and the fields are pre-filled with the properties of the selected CI variable.

edit_variable

States of the Environment Scope Dropdown
Screenshot Description
Environment scope dropdown is hidden in the Admin CI/CD Variable settings (hideEnvironmentScope === true) admin_cicd
Environment scope dropdown is disabled in the Group CI/CD Variable settings when there is no Premium+ license (areScopedVariablesAvailable === false) scoped_variables_unavailable

How to set up and validate locally

  1. Enable the ci_variable_drawer feature flag.
  2. Go to Settings > CI/CD > Variables.
  3. Click on the Add variable button or edit a variable.
  4. Verify that the checked validation rules from this checklist are implemented.

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Mireya Andres

Merge request reports