Introduce vue3_migrate_jobs to migrate Job views to Vue 3
What does this MR do and why?
Depends on !230873 (merged).
Introduce vue3_migrate_jobs to migrate Pipeline views to Vue 3
This change defines the vue3_migrate_jobs feature flag to
allow the Job table and details views to run using Vue 3 in
compatibility mode.
The behavior of the applications should be the same.
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
Screenshots or screen recordings
With vue3_migrate_jobs enabled:
| Admin Jobs | Jobs | Job |
|---|---|---|
 |
 |
 |
Console logging shows that Vue 3 is used to mount this endpoint:
How to set up and validate locally
Example:
- In rails console enable the feature flag
Feature.enable(:vue3_migrate_jobs) - Visit the job pages, example URLs:
- Click things, ensure it's working correctly.
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.