Fix components that read undefined properties on Vue instances

Summary

Several Vue components read a property that the instance does not define. Jest cannot report any of them today, because the Jest console watcher ignores every "property is not defined on the instance" render warning.

Two things hide these defects:

  1. spec/frontend/environment.js ignores the warning for any property name. The pattern exists to stop Jest's own probing from masking a failing assertion, but it is far wider than that purpose needs.
  2. Vue 2 binds a computed getter to the raw component instance, so an unknown property read inside a computed never warns at all. Vue 3 binds the getter to the public proxy, which does warn. Every case below is therefore invisible in the Vue 2 lane and only appears under VUE_VERSION=3.

!250835 (merged) narrows the pattern to the eight property names Jest probes. That change unmasks the cases listed here, and it cannot merge until they are fixed, because jest vue3 sets allow_failure: false.

Affected code

Found by running the whole suite locally with the narrowed pattern. Grouped by cause.

1. this.$apollo read with no Apollo provider

Source Failing spec
app/assets/javascripts/repository/components/header_area/blob_overflow_menu.vue:117 spec/frontend/repository/components/header_area/blob_overflow_menu_spec.js
ee/app/assets/javascripts/security_orchestration/components/policy_drawer/drawer_wrapper.vue:159 ee/spec/frontend/security_orchestration/components/policy_drawer/drawer_wrapper_spec.js

2. this.$route read with no router

Source Failing spec
app/assets/javascripts/repository/components/header_area/permalink_dropdown_item.vue:42 spec/frontend/repository/components/header_area/blob_repository_actions_group_spec.js
ee/app/assets/javascripts/ai/components/navigation_rail.vue:79 ee/spec/frontend/ai/init_duo_panel_spec.js

The component reads $route with no guard, so it breaks whenever it is mounted outside a router, not only in specs.

3. runWithContext

Source Failing spec
app/assets/javascripts/rapid_diffs/app/init_file_finder.js:40 spec/frontend/rapid_diffs/app/init_file_finder_spec.js
app/assets/javascripts/notes/components/comment_form.vue:616 ee/spec/frontend/notes/components/comment_form_spec.js

runWithContext is a Vue 3 application-level API. Something reads it from a component instance. Needs tracing.

4. A data key with no default

Property Source Failing spec
packageRegistryAllowAnyoneToPullOption app/assets/javascripts/pages/projects/shared/permissions/components/settings_panel.vue:449 spec/frontend/pages/projects/shared/permissions/components/settings_panel_spec.js
isGitlabCom app/assets/javascripts/security_configuration/components/secret_push_protection_feature_card.vue:109 spec/frontend/security_configuration/components/secret_push_protection_feature_card_spec.js
type not yet traced spec/frontend/issuable/popover/components/work_item_popover_spec.js and its EE counterpart

settings_panel.vue builds its state with return { ...defaults, ...this.currentSettings } at line 378. packageRegistryAllowAnyoneToPullOption is missing from defaults, so it exists only when a caller supplies it. When it is absent the computed packageRegistryApiForEveryoneEnabledShown is always falsy and the setting never renders. app/helpers/projects_helper.rb:874 supplies it in production, so the gap is not user visible today, but nothing enforces that.

Steps to reproduce

Apply the narrowed pattern from !250835 (merged), then run:

VUE_VERSION=3 yarn jest

Each failure reports:

Unexpected calls to console (1) with:
  [1] warn: [Vue warn]: Property "<name>" was accessed during render but is not defined on instance.

The same command on master passes, because the warning is ignored.

Proposed resolution

One merge request per group above, so each lands with its owning group's review. Then rebase !250835 (merged) on top and confirm jest vue3 is green.

For groups 1 and 2, prefer guarding the component over adding a router or an Apollo provider to the spec, because the unguarded read is the actual defect.

Edited by 🤖 GitLab Bot 🤖