Add vue3_migrate_snippets flag and migrate snippets pages

Kushal Pandyarequested to merge
613676-add-vue3-migrate-snippets-flag into master

What does this MR do and why?

Adds the vue3_migrate_snippets feature flag (beta, disabled by default) and six vue3_migration.yml files, one per snippet entrypoint (pages/{projects/,}snippets/{show,edit,new}). With status: rollout, the bundler emits both a Vue 2 chunk and a .vue3 chunk per entrypoint, and Gitlab::Vue3Migration.entrypoint_for picks per request using current_user as the actor, so the rollout can ramp gradually and roll back instantly.

No application code changes are needed because all six entrypoints mount through the shared SnippetsRoot factory in ~/snippets/index.js, which already uses initVueApp. There are no EE overlays for snippet pages, so no EE ymls are needed either.

Testing

Enable the flag with Feature.enable(:vue3_migrate_snippets), then run gdk restart vite (Vite builds its page entry map at startup). All six pages served their .vue3 chunk with zero @vue/compat deprecation warnings; we exercised snippet create, edit, multi-file, delete, and emoji reactions on both personal and project snippets.

  • AwardsListRoot on projects/snippets/show is a Vue 2 new Vue root backed by Vuex and the riskiest piece here. It works fully under @vue/compat.
  • Report abuse is untested: snippet_report_abuse_path returns nil without Akismet configured, so the item never renders in GDK. Stays manual-only.
  • The [data-v-app] check from the issue false-negatives here, because initVueApp emulates Vue 2 replace-mount semantics. Use [...document.querySelectorAll('[data-gitlab-vue3-app]')].map((el) => el.dataset.gitlabVue3App) instead, which returns SnippetsRoot (plus AwardsListRoot on project snippets).

References

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.

Edited by Kushal Pandya

Merge request reports