Test Duo Workflow to rewrite tests from mount to shallowMount to check whether they pass in Vue 3

We noticed that some tests failed in Vue 3 pipelines because one of their child components failed in Vue 3. These tests can (and should) be fixed by rewriting them to shallowMount to stub child components and exclude the errors from them. It would be interesting to see whether Duo Workflow can fix these tests.

Things to look out for:

  • named slots - if child component has them, it needs to be stubbed
  • finding elements that are only rendered due to mount - they need to be replaced with finding child components and testing against their props and emits

Some test suites that use mount or mountExtended and fail in Vue 3:

  • spec/frontend/releases/components/app_edit_new_spec.js
  • spec/frontend/usage_quotas/storage/components/namespace_storage_app_spec.js
  • spec/frontend/ci/admin/jobs_table/admin_job_table_app_spec.js
  • spec/frontend/ci/runner/admin_runner_show/admin_runner_show_app_spec.js
  • spec/frontend/vue_shared/components/paginated_table_with_search_and_tabs/paginated_table_with_search_and_tabs_spec.js

We can also search https://gitlab-org.gitlab.io/frontend/playground/jest-speed-reporter/vue3.html entries for more tests

Edited by 🤖 GitLab Bot 🤖