Add Vue 3 rollout flag for test case pages

What does this MR do and why?

This MR adds the vue3_migrate_portfolio_planning feature flag and a vue3_migration.yml for three test case entrypoints. This opts them into the Vue 3 migration with Option 1.

Entrypoints

  • pages.projects.quality.test_cases — test case list (ee/test_case_list/test_case_list_bundle)
  • pages.projects.quality.test_cases.new — new test case (ee/test_case_create/test_case_create_bundle)
  • pages.projects.quality.test_cases.show — test case detail (ee/test_case_show/test_case_show_bundle)

References

https://docs.gitlab.com/development/fe_guide/vue3_migration/#option-1-recommended-migrate-your-page-entrypoint-using-a-feature-flag-and-vue3_migrationyml

Screenshots or screen recordings

  1. Test Case List (eg. http://gdk.test:3000/twitter/Typeahead.Js/-/quality/test_cases )

Screenshot 2026-08-19 at 4.01.46 PM.png

  1. Test Case New (eg. http://gdk.test:3000/twitter/Typeahead.Js/-/quality/test_cases/new)

Screenshot 2026-08-19 at 4.02.39 PM.png

  1. Test Case Show (eg. http://gdk.test:3000/twitter/Typeahead.Js/-/quality/test_cases/84)

Screenshot 2026-08-19 at 4.03.15 PM.png

How to set up and validate locally

  1. Enable the feature flag vue3_migrate_test_cases (you should see something like [gitlab] [V] Using Vue.js 3 for TestCaseListAppRoot in the browser console)
  2. Within a project, navigate to Build -> Test cases
  3. To ensure no regressions, create a new test case, view it on the main list, and select it
  4. Confirm the browser console stays free of any Vue 3 specific errors

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.

Related to #608119 (closed)

Edited by Joanna Niemczyk

Merge request reports

Loading
Loading