Add vue3_migrate_commit_list flag and migrate commit pages
What does this MR do and why?
Adds the vue3_migrate_commit_list flag and opts the commit pages into the Vue 3 rollout. This is flag 7 of 7 in the epic, the commit cluster, and nothing changes for users yet because the flag is default_enabled: false.
It adds config/feature_flags/beta/vue3_migrate_commit_list.yml (beta, default_enabled: false, milestone 19.4, group group::source code) and four vue3_migration.yml files with status: rollout, following "Option 1" in doc/development/fe_guide/vue3_migration.md, for pages/projects/commits/show, pages/projects/commit/show, pages/projects/commit/rapid_diffs, and pages/projects/compare/show.
The rollout issue's matrix only lists projects/commit/show, but rapid_diffs_on_commit_show is default_enabled: true, so Projects::CommitController#show actually renders the commit/rapid_diffs entrypoint today. A yml for commit/show alone would leave the page users actually see stuck on Vue 2, so both entrypoints get one. None of the four have EE counterparts, so we skip ee/ ymls.
This stacks on the compat fixes MR because spec/lib/gitlab/vue3_migration_files_spec.rb requires every feature_flag in a vue3_migration.yml to resolve to a real definition, and because those fixes are what make these pages work once we start ramping.
References
- #613678 (closed)
- gitlab-org#23084
- Depends on: !252083 (merged)
Screenshots or screen recordings
NA
How to set up and validate locally
- Check out this branch.
- Run
node scripts/frontend/infection_scanner/infection_scanner.mjs. The scanner caches its import graph, so it won't pick up the newvue3_migration.ymlfiles otherwise. - Run
gdk restart vite rails-web. Vite builds its page entry map at startup, andGitlab::Vue3Migration.definitionsis memoized per process. - In the Rails console, run
Feature.enable(:vue3_migrate_commit_list). - Visit a commits list, a single commit page, and a compare page.
- In the browser console, run
[...document.querySelectorAll('[data-gitlab-vue3-app]')].map((el) => el.dataset.gitlabVue3App)and confirm the expected apps are listed. - Run
[...document.querySelectorAll('*')].filter((el) => el.__vue__ && el.__vue__.$root === el.__vue__).map((el) => el.__vue__.$options.name)and confirm only the global singletons are left on Vue 2. - Confirm there are no console errors.
I tested the commits list (both the project_commits_refactor path and the legacy jQuery path), a single commit with diffs and notes, the ambiguous-ref modal, and compare in both wide and narrow layouts. spec/lib/gitlab/vue3_migration_files_spec.rb passes with 803 examples and 0 failures.
MR acceptance checklist
Evaluate this MR against the MR acceptance checklist. It helps you analyze changes to reduce risks in quality, performance, reliability, security, and maintainability.