diff --git a/ee/app/assets/javascripts/vulnerabilities/components/header.vue b/ee/app/assets/javascripts/vulnerabilities/components/header.vue
index 3056c143732565539411f6b65a4e0e1774314567..b719007ddb8162ce66205edbba086b600e9591cd 100644
--- a/ee/app/assets/javascripts/vulnerabilities/components/header.vue
+++ b/ee/app/assets/javascripts/vulnerabilities/components/header.vue
@@ -20,6 +20,8 @@ import { VULNERABILITY_STATE_OBJECTS, FEEDBACK_TYPES } from '../constants';
 import { normalizeGraphQLVulnerability, normalizeGraphQLLastStateTransition } from '../helpers';
 import ResolutionAlert from './resolution_alert.vue';
 import StatusDescription from './status_description.vue';
+import VulnerabilityActionsDropdown from './vulnerability_actions_dropdown.vue';
+import VulnerabilityStateDropdown from './vulnerability_state_dropdown.vue';
 
 export const CREATE_MR_AI_ACTION = {
   name: s__('ciReport|Resolve with merge request'),
@@ -48,8 +50,8 @@ export default {
     StatusBadge,
     ResolutionAlert,
     StatusDescription,
-    VulnerabilityStateDropdown: () => import('./vulnerability_state_dropdown.vue'),
-    VulnerabilityActionsDropdown: () => import('./vulnerability_actions_dropdown.vue'),
+    VulnerabilityStateDropdown,
+    VulnerabilityActionsDropdown,
   },
   directives: {
     GlTooltip,
diff --git a/ee/spec/frontend/vulnerabilities/header_spec.js b/ee/spec/frontend/vulnerabilities/header_spec.js
index 5895e1a7b2db7fbfce75a8d385ca69eb270c65b1..d4260b2027a1ef06866589c2d732ecfe54c70597 100644
--- a/ee/spec/frontend/vulnerabilities/header_spec.js
+++ b/ee/spec/frontend/vulnerabilities/header_spec.js
@@ -1,4 +1,4 @@
-import { GlLoadingIcon, GlCollapsibleListbox } from '@gitlab/ui';
+import { GlLoadingIcon } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import Vue, { nextTick } from 'vue';
 import MockAdapter from 'axios-mock-adapter';
@@ -111,7 +111,7 @@ describe('Vulnerability Header', () => {
   const findGlLoadingIcon = () => wrapper.findComponent(GlLoadingIcon);
   const findStatusBadge = () => wrapper.findComponent(StatusBadge);
   const findActionsDropdown = () => wrapper.findComponent(VulnerabilityActionsDropdown);
-  const findStateButton = () => wrapper.findComponent(GlCollapsibleListbox);
+  const findStateButton = () => wrapper.findComponent(VulnerabilityStateDropdown);
   const findResolutionAlert = () => wrapper.findComponent(ResolutionAlert);
   const findStatusDescription = () => wrapper.findComponent(StatusDescription);
 
@@ -337,7 +337,7 @@ describe('Vulnerability Header', () => {
   });
 
   describe('actions dropdown', () => {
-    it.each([true, false])('passes the correct props to the dropdown', async (actionsEnabled) => {
+    it.each([true, false])('passes the correct props to the dropdown', (actionsEnabled) => {
       createWrapper({
         vulnerability: getVulnerability({
           canCreateMergeRequest: actionsEnabled,
@@ -351,8 +351,6 @@ describe('Vulnerability Header', () => {
         },
       });
 
-      await waitForPromises();
-
       expect(findActionsDropdown().props()).toMatchObject({
         loading: false,
         showDownloadPatch: actionsEnabled,