Add Vue 3 rollout flag for the cluster agent pages

Adds the vue3_migrate_cluster_agents feature flag and a vue3_migration.yml for the two Kubernetes agent pages. This opts them into the Vue 3 migration with Option 1. The bundler builds both a Vue 2 and a Vue 3 chunk. Rails serves the Vue 3 chunk only when the flag is on. The flag is default-off.

Entrypoint Mounted through Page-specific components
projects/cluster_agents/show loadClusterAgentVues, using initVueApp 77: 48 in security_dashboard/components, 10 in clusters/agents, 8 in workspaces/common
clusters/agents/dashboard initKubernetesDashboard, using initVueApp 18: 9 in kubernetes_dashboard/pages, 8 in kubernetes_dashboard/components

Both mount with initVueApp, so both roots carry the data-gitlab-vue3-app marker and a silent fallback is detectable.

Risk

The two pages share almost no components. They are grouped only because both show Kubernetes agent information. If one proves unstable during rollout, split the flag rather than holding the other back.

cluster_agents/show pulls a large security_dashboard tree. 74% of its components already run under Vue 3, because the pipeline security tabs cover that tree under vue3_migrate_pipelines. Only about 20 of its 77 components are new ground. Check the vulnerability and security panels, not only the agent detail header.

clusters/agents/dashboard shares nothing with any migrated entrypoint. All 18 of its components are new ground.

Verification

  • bundle exec rspec spec/lib/gitlab/vue3_migration_files_spec.rb — 1106 examples, 0 failures (after rebase onto master, 2026-09-10)
  • node scripts/frontend/vue3_migration_stats.mjs --owners reports both pages as rollout under the new flag

Local verification

A temporary feature spec loaded each page with vue3_migrate_cluster_agents stubbed on. It asserted that the page HTML included a <script> whose src contains the .vue3.js entrypoint, and that a [data-gitlab-vue3-app] element exists. Then it saved a screenshot.

The Kubernetes dashboard body is empty in the screenshot because the local GDK has no KAS tunnel. A control run with the flag off, on Vue 2, rendered the same empty body. This is an environment gap, not a Vue 3 regression.

Page Entrypoint served Vue 3 root marker
Project cluster agent show (Activity tab) pages.projects.cluster_agents.show.vue3.js AgentShowPageRoot
Kubernetes dashboard for an agent pages.clusters.agents.dashboard.vue3.js KubernetesDashboardRoot
Cluster agent show page on Vue 3
Kubernetes dashboard on Vue 3

References

Edited by Miguel Rincon

Merge request reports

Loading
Loading