Add Vue 3 rollout flag for the admin CI/CD settings page (!250432) · Merge requests · GitLab.org / GitLab

Adds the vue3_migrate_admin_ci_settings feature flag and two vue3_migration.yml files for the admin CI/CD settings page. The flag is default-off.

Why two yml files

One entry name, pages.admin.application_settings.ci_cd, exists in both page roots. The EE file does not shadow the CE file. It imports it, then mounts one more app. So the EE page runs both apps, and the loader requires the two ymls to be byte-identical.

Entrypoint	Vue apps mounted
`app/assets/javascripts/pages/admin/application_settings/ci_cd/index.js`	`ExpirationIntervals`, via `initVueApp`
`ee/app/assets/javascripts/pages/admin/application_settings/ci_cd/index.js`	The CE app, plus the CI template dropdown

Risk

Two independent Vue apps mount on this page. Check both the runner token expiration intervals form and the CI template dropdown. The page saves instance settings, so a broken form matters more than a broken read-only view.

Verification

This merge request also adds two :js examples to ee/spec/features/admin/settings/ci_cd_settings_spec.rb. Neither app on this page had any coverage: the rest of that file runs without a JavaScript driver, so the two mount points stay empty divs and only the server rendered forms are asserted. The :js metadata is scoped to the two new describes, so the existing examples keep running on rack_test.

Signal	Flag off	Flag on
`[data-gitlab-vue3-app]` roots	none	`CiTemplateDropdownRoot`, `ExpirationIntervalsRoot`
Entry chunk	`pages.admin.application_settings.ci_cd.js`	`pages.admin.application_settings.ci_cd.vue3.js`
Spec result	2 examples, 0 failures	2 examples, 0 failures

The CE and EE question

This page is the one entrypoint in the batch where the two editions differ in a way that could half-migrate it. The EE entrypoint does not replace the CE one, it imports it:

import '~/pages/admin/application_settings/ci_cd/index';
import { initCiTemplateDropdown } from './init_ci_template_dropdown';

With the flag on, both roots carry the marker, so the infection does cross the edition boundary. The two vue3_migration.yml files are byte-identical, which the loader requires.