Introduce vue3_migrate_admin_runners to migrate Runner Admin to Vue 3
What does this MR do and why?
This change defines the vue3_migrate_admin_runners feature flag to
allow Runner Admin features to run using Vue 3 in compatibility mode.
The behavior of the applications should be the same.
We use a user actor, as these views do not correspond to any specific group or project.
How does this work?
We use config/plugins/webpack_vue3_infection_plugin.js (for webpack) and config/helpers/vite_plugin_vue3_infection.mjs (for vite) to swap out the Vue 3 related dependencies and compatibility adapters when the ?vue3 query is added to an import.
This, in combination with a feature flag, allows us to dynamically insert a Vue 3 compat app into a page that still uses Vue 2 to enable a gradual rollout of Vue 3.
Fun fact! As feature flags are all enabled by default in rspec, the Vue 3 enabled code will be tested in our system/feature specs. This will ensure stability for features that are covered by our feature specs.
References
- WS2: Migration of Vue Applications to Vue 3 (vu... (gitlab-org#20939)
- Depends on !227104 (merged) and !226978 (merged).
Screenshots or screen recordings
Note: Currently this solution is working on Vite, during development, while !227104 (merged) gets merged.
| Before | After |
|---|---|
 |
 |
How to set up and validate locally
- Enabled
vue3_migrate_admin_runnersat https://gdk.test:3000/rails/features/ - Log in as admin to your GDK
- Verify the pages at:
- https://gdk.test:3000/admin/runners
- https://gdk.test:3000/admin/runners/new
- https://gdk.test:3000/admin/runners/364/register (works after creating a runner)
- https://gdk.test:3000/admin/runners/363 (select a runner you own)
- https://gdk.test:3000/admin/runners/363/edit
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.