Merge branch '295211-create-BV_x_MODEL-constants' into 'master'

Create constants for bv::show::modal and bv::hide::modal

See merge request gitlab-org/gitlab!52518

app/assets/javascripts/add_context_commits_modal/components/add_context_commits_modal_wrapper.vue

 <script>
 import { mapState, mapActions } from 'vuex';
 import { GlModal, GlTabs, GlTab, GlSearchBoxByType, GlSprintf } from '@gitlab/ui';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 import ReviewTabContainer from '~/add_context_commits_modal/components/review_tab_container.vue';
 import { s__ } from '~/locale';
 import eventHub from '../event_hub';
@@ -119,7 +120,7 @@ export default {
     openModal() {
       this.searchCommits();
       this.fetchContextCommits();
-      this.$root.$emit('bv::show::modal', 'add-review-item');
+      this.$root.$emit(BV_SHOW_MODAL, 'add-review-item');
     },
     handleTabChange(tabIndex) {
       if (tabIndex === 0) {

app/assets/javascripts/invite_member/components/invite_member_modal.vue

@@ -3,6 +3,7 @@ import { GlModal, GlLink } from '@gitlab/ui';
 import eventHub from '../event_hub';
 import { s__, __ } from '~/locale';
 import { OPEN_MODAL, MODAL_ID } from '../constants';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 
 export default {
   cancelProps: {
@@ -38,7 +39,7 @@ export default {
   },
   methods: {
     openModal() {
-      this.$root.$emit('bv::show::modal', MODAL_ID);
+      this.$root.$emit(BV_SHOW_MODAL, MODAL_ID);
     },
   },
 };

app/assets/javascripts/invite_members/components/invite_members_modal.vue

@@ -14,6 +14,7 @@ import eventHub from '../event_hub';
 import { s__, __, sprintf } from '~/locale';
 import Api from '~/api';
 import MembersTokenSelect from '~/invite_members/components/members_token_select.vue';
+import { BV_SHOW_MODAL, BV_HIDE_MODAL } from '~/lib/utils/constants';
 
 export default {
   name: 'InviteMembersModal',
@@ -113,10 +114,10 @@ export default {
       ];
     },
     openModal() {
-      this.$root.$emit('bv::show::modal', this.modalId);
+      this.$root.$emit(BV_SHOW_MODAL, this.modalId);
     },
     closeModal() {
-      this.$root.$emit('bv::hide::modal', this.modalId);
+      this.$root.$emit(BV_HIDE_MODAL, this.modalId);
     },
     sendInvite() {
       this.submitForm();

app/assets/javascripts/lib/utils/constants.js

@@ -10,3 +10,6 @@ export const DATETIME_RANGE_TYPES = {
   open: 'open',
   invalid: 'invalid',
 };
+
+export const BV_SHOW_MODAL = 'bv::show::modal';
+export const BV_HIDE_MODAL = 'bv::hide::modal';

app/assets/javascripts/monitoring/components/alert_widget.vue

@@ -3,6 +3,7 @@ import { GlBadge, GlLoadingIcon, GlModalDirective, GlIcon, GlTooltip, GlSprintf
 import { values, get } from 'lodash';
 import { s__ } from '~/locale';
 import { deprecatedCreateFlash as createFlash } from '~/flash';
+import { BV_SHOW_MODAL, BV_HIDE_MODAL } from '~/lib/utils/constants';
 import AlertWidgetForm from './alert_widget_form.vue';
 import AlertsService from '../services/alerts_service';
 import { alertsValidator, queriesValidator } from '../validators';
@@ -165,11 +166,11 @@ export default {
       return get(alertQuery, 'result[0].values', []).map((value) => get(value, '[1]', null));
     },
     showModal() {
-      this.$root.$emit('bv::show::modal', this.modalId);
+      this.$root.$emit(BV_SHOW_MODAL, this.modalId);
     },
     hideModal() {
       this.errorMessage = null;
-      this.$root.$emit('bv::hide::modal', this.modalId);
+      this.$root.$emit(BV_HIDE_MODAL, this.modalId);
     },
     handleSetApiAction(apiAction) {
       this.apiAction = apiAction;

app/assets/javascripts/monitoring/components/dashboard_panel.vue

@@ -19,6 +19,7 @@ import invalidUrl from '~/lib/utils/invalid_url';
 import { convertToFixedRange } from '~/lib/utils/datetime_range';
 import { relativePathToAbsolute, getBaseURL, visitUrl, isSafeURL } from '~/lib/utils/url_utility';
 import { __, n__ } from '~/locale';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 import { panelTypes } from '../constants';
 
 import MonitorEmptyChart from './charts/empty_chart.vue';
@@ -318,7 +319,7 @@ export default {
       return isSafeURL(url) ? url : '#';
     },
     showAlertModal() {
-      this.$root.$emit('bv::show::modal', this.alertModalId);
+      this.$root.$emit(BV_SHOW_MODAL, this.alertModalId);
     },
     showAlertModalFromKeyboardShortcut() {
       if (this.isContextualMenuShown) {

app/assets/javascripts/pages/admin/jobs/index/index.js

 import Vue from 'vue';
 import Translate from '~/vue_shared/translate';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 import stopJobsModal from './components/stop_jobs_modal.vue';
 
 Vue.use(Translate);
@@ -18,7 +19,7 @@ document.addEventListener('DOMContentLoaded', () => {
       mounted() {
         stopJobsButton.classList.remove('disabled');
         stopJobsButton.addEventListener('click', () => {
-          this.$root.$emit('bv::show::modal', modalId, `#${buttonId}`);
+          this.$root.$emit(BV_SHOW_MODAL, modalId, `#${buttonId}`);
         });
       },
       render(createElement) {

app/assets/javascripts/pages/admin/projects/index/index.js

@@ -2,6 +2,7 @@ import Vue from 'vue';
 
 import Translate from '~/vue_shared/translate';
 import csrf from '~/lib/utils/csrf';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 
 import deleteProjectModal from './components/delete_project_modal.vue';
 
@@ -24,7 +25,7 @@ document.addEventListener('DOMContentLoaded', () => {
           deleteModal.deleteProjectUrl = buttonProps.deleteProjectUrl;
           deleteModal.projectName = buttonProps.projectName;
 
-          this.$root.$emit('bv::show::modal', 'delete-project-modal');
+          this.$root.$emit(BV_SHOW_MODAL, 'delete-project-modal');
         });
       });
     },

app/assets/javascripts/pages/milestones/shared/delete_milestone_modal_init.js

 import Vue from 'vue';
 import Translate from '~/vue_shared/translate';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 import DeleteMilestoneModal from './components/delete_milestone_modal.vue';
 import eventHub from './event_hub';
 
@@ -47,7 +48,7 @@ export default () => {
       deleteMilestoneButtons.forEach((button) => {
         button.removeAttribute('disabled');
         button.addEventListener('click', () => {
-          this.$root.$emit('bv::show::modal', 'delete-milestone-modal');
+          this.$root.$emit(BV_SHOW_MODAL, 'delete-milestone-modal');
           eventHub.$once('deleteMilestoneModal.requestStarted', onRequestStarted);
 
           this.setModalProps({

app/assets/javascripts/pages/projects/labels/index/index.js

 import Vue from 'vue';
 import Translate from '~/vue_shared/translate';
 import initLabels from '~/init_labels';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 import eventHub from '../event_hub';
 import PromoteLabelModal from '../components/promote_label_modal.vue';
 
@@ -49,7 +50,7 @@ const initLabelIndex = () => {
       promoteLabelButtons.forEach((button) => {
         button.removeAttribute('disabled');
         button.addEventListener('click', () => {
-          this.$root.$emit('bv::show::modal', 'promote-label-modal');
+          this.$root.$emit(BV_SHOW_MODAL, 'promote-label-modal');
           eventHub.$once('promoteLabelModal.requestStarted', onRequestStarted);
 
           this.setModalProps({

app/assets/javascripts/profile/account/index.js

 import Vue from 'vue';
 import Translate from '~/vue_shared/translate';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 import UpdateUsername from './components/update_username.vue';
 import deleteAccountModal from './components/delete_account_modal.vue';
 
@@ -31,7 +32,7 @@ export default () => {
     mounted() {
       deleteAccountButton.classList.remove('disabled');
       deleteAccountButton.addEventListener('click', () => {
-        this.$root.$emit('bv::show::modal', 'delete-account-modal', '#delete-account-button');
+        this.$root.$emit(BV_SHOW_MODAL, 'delete-account-modal', '#delete-account-button');
       });
     },
     render(createElement) {

app/assets/javascripts/projects/commit/components/form_modal.vue

@@ -3,6 +3,7 @@ import { GlModal, GlForm, GlFormCheckbox, GlSprintf, GlFormGroup } from '@gitlab
 import { mapActions, mapState } from 'vuex';
 import eventHub from '../event_hub';
 import csrf from '~/lib/utils/csrf';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 import BranchesDropdown from './branches_dropdown.vue';
 
 export default {
@@ -67,7 +68,7 @@ export default {
   methods: {
     ...mapActions(['clearModal', 'setBranch', 'setSelectedBranch']),
     show() {
-      this.$root.$emit('bv::show::modal', this.modalId);
+      this.$root.$emit(BV_SHOW_MODAL, this.modalId);
     },
     handlePrimary() {
       this.$refs.form.$el.submit();

app/assets/javascripts/self_monitor/components/self_monitor_form.vue

@@ -5,6 +5,7 @@ import { GlFormGroup, GlButton, GlModal, GlToast, GlToggle } from '@gitlab/ui';
 import { mapState, mapActions } from 'vuex';
 import { __, s__, sprintf } from '~/locale';
 import { visitUrl, getBaseURL } from '~/lib/utils/url_utility';
+import { BV_SHOW_MODAL, BV_HIDE_MODAL } from '~/lib/utils/constants';
 
 Vue.use(GlToast);
 
@@ -98,11 +99,11 @@ export default {
       'resetAlert',
     ]),
     hideSelfMonitorModal() {
-      this.$root.$emit('bv::hide::modal', this.modalId);
+      this.$root.$emit(BV_HIDE_MODAL, this.modalId);
       this.setSelfMonitor(true);
     },
     showSelfMonitorModal() {
-      this.$root.$emit('bv::show::modal', this.modalId);
+      this.$root.$emit(BV_SHOW_MODAL, this.modalId);
     },
     saveChangesSelfMonitorProject() {
       if (this.projectCreated && !this.projectEnabled) {

app/assets/javascripts/set_status_modal/set_status_modal_wrapper.vue

@@ -10,6 +10,7 @@ import { updateUserStatus } from '~/rest_api';
 import EmojiMenuInModal from './emoji_menu_in_modal';
 import { isUserBusy, isValidAvailibility } from './utils';
 import * as Emoji from '~/emoji';
+import { BV_SHOW_MODAL, BV_HIDE_MODAL } from '~/lib/utils/constants';
 
 const emojiMenuClass = 'js-modal-status-emoji-menu';
 export const AVAILABILITY_STATUS = {
@@ -76,14 +77,14 @@ export default {
     },
   },
   mounted() {
-    this.$root.$emit('bv::show::modal', this.modalId);
+    this.$root.$emit(BV_SHOW_MODAL, this.modalId);
   },
   beforeDestroy() {
     this.emojiMenu.destroy();
   },
   methods: {
     closeModal() {
-      this.$root.$emit('bv::hide::modal', this.modalId);
+      this.$root.$emit(BV_HIDE_MODAL, this.modalId);
     },
     setupEmojiListAndAutocomplete() {
       const toggleEmojiMenuButtonSelector = '#set-user-status-modal .js-toggle-emoji-menu';

app/assets/javascripts/vue_merge_request_widget/components/approvals/approvals.vue

@@ -9,6 +9,7 @@ import MrWidgetIcon from '../mr_widget_icon.vue';
 import ApprovalsSummary from './approvals_summary.vue';
 import ApprovalsSummaryOptional from './approvals_summary_optional.vue';
 import { FETCH_LOADING, FETCH_ERROR, APPROVE_ERROR, UNAPPROVE_ERROR } from './messages';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 
 export default {
   name: 'MRWidgetApprovals',
@@ -124,7 +125,7 @@ export default {
   methods: {
     approve() {
       if (this.requirePasswordToApprove) {
-        this.$root.$emit('bv::show::modal', this.modalId);
+        this.$root.$emit(BV_SHOW_MODAL, this.modalId);
         return;
       }
 

app/assets/javascripts/vue_shared/components/gl_modal_vuex.vue

 <script>
 import { mapState, mapActions } from 'vuex';
 import { GlModal } from '@gitlab/ui';
+import { BV_SHOW_MODAL, BV_HIDE_MODAL } from '~/lib/utils/constants';
 
 /**
  * This component keeps the GlModal's visibility in sync with the given vuex module.
@@ -46,11 +47,11 @@ export default {
       },
     }),
     bsShow() {
-      this.$root.$emit('bv::show::modal', this.modalId);
+      this.$root.$emit(BV_SHOW_MODAL, this.modalId);
     },
     bsHide() {
       // $root.$emit is a workaround because other b-modal approaches don't work yet with gl-modal
-      this.$root.$emit('bv::hide::modal', this.modalId);
+      this.$root.$emit(BV_HIDE_MODAL, this.modalId);
     },
     cancel() {
       this.$emit('cancel');

changelogs/unreleased/295211-create-BV_x_MODEL-constants.yml

+---
+title: Create constants for bv::show::modal and bv::hide::modal
+merge_request: 52518
+author: Kev @KevSlashNull
+type: other

ee/app/assets/javascripts/geo_nodes/components/app.vue

@@ -3,6 +3,7 @@ import { GlLoadingIcon, GlModal } from '@gitlab/ui';
 import { __, s__ } from '~/locale';
 import { deprecatedCreateFlash as Flash } from '~/flash';
 import SmartInterval from '~/smart_interval';
+import { BV_SHOW_MODAL, BV_HIDE_MODAL } from '~/lib/utils/constants';
 
 import eventHub from '../event_hub';
 
@@ -194,11 +195,11 @@ export default {
       if (actionType === NODE_ACTIONS.TOGGLE && !node.enabled) {
         this.toggleNode(this.targetNode);
       } else {
-        this.$root.$emit('bv::show::modal', this.modalId);
+        this.$root.$emit(BV_SHOW_MODAL, this.modalId);
       }
     },
     hideNodeActionModal() {
-      this.$root.$emit('bv::hide::modal', this.modalId);
+      this.$root.$emit(BV_HIDE_MODAL, this.modalId);
     },
     nodeRemovalAllowed(node) {
       return !node.primary || this.nodes.length <= 1;

ee/app/assets/javascripts/reports/components/modal_open_name.vue

@@ -2,6 +2,7 @@
 import { VULNERABILITY_MODAL_ID } from 'ee/vue_shared/security_reports/components/constants';
 import { GlTooltipDirective, GlResizeObserverDirective } from '@gitlab/ui';
 import { mapActions } from 'vuex';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 
 export default {
   directives: {
@@ -30,7 +31,7 @@ export default {
     handleIssueClick() {
       const { issue, status, setModalData } = this;
       setModalData({ issue, status });
-      this.$root.$emit('bv::show::modal', VULNERABILITY_MODAL_ID);
+      this.$root.$emit(BV_SHOW_MODAL, VULNERABILITY_MODAL_ID);
     },
     updateTooltipTitle() {
       // Only show the tooltip if the text is truncated with an ellipsis.

ee/app/assets/javascripts/security_dashboard/components/security_dashboard_table_row.vue

@@ -11,6 +11,7 @@ import SeverityBadge from 'ee/vue_shared/security_reports/components/severity_ba
 import convertReportType from 'ee/vue_shared/security_reports/store/utils/convert_report_type';
 import getPrimaryIdentifier from 'ee/vue_shared/security_reports/store/utils/get_primary_identifier';
 import { VULNERABILITY_MODAL_ID } from 'ee/vue_shared/security_reports/components/constants';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 import VulnerabilityActionButtons from './vulnerability_action_buttons.vue';
 import VulnerabilityIssueLink from './vulnerability_issue_link.vue';
 import { DASHBOARD_TYPES } from '../store/constants';
@@ -102,7 +103,7 @@ export default {
     },
     openModal(payload) {
       this.setModalData(payload);
-      this.$root.$emit('bv::show::modal', VULNERABILITY_MODAL_ID);
+      this.$root.$emit(BV_SHOW_MODAL, VULNERABILITY_MODAL_ID);
     },
   },
 };

ee/app/assets/javascripts/security_dashboard/components/vulnerability_action_buttons.vue

@@ -2,6 +2,7 @@
 import { mapActions, mapState } from 'vuex';
 import { GlTooltipDirective, GlButton } from '@gitlab/ui';
 import { VULNERABILITY_MODAL_ID } from 'ee/vue_shared/security_reports/components/constants';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 import { s__ } from '~/locale';
 
 export default {
@@ -57,7 +58,7 @@ export default {
     },
     openModal(payload) {
       this.setModalData(payload);
-      this.$root.$emit('bv::show::modal', VULNERABILITY_MODAL_ID);
+      this.$root.$emit(BV_SHOW_MODAL, VULNERABILITY_MODAL_ID);
     },
   },
   i18n: {

ee/app/assets/javascripts/vue_merge_request_widget/components/approvals/approvals.vue

@@ -2,6 +2,7 @@
 import { deprecatedCreateFlash as createFlash } from '~/flash';
 import Approvals from '~/vue_merge_request_widget/components/approvals/approvals.vue';
 import approvalsMixin from '~/vue_merge_request_widget/mixins/approvals';
+import { BV_HIDE_MODAL } from '~/lib/utils/constants';
 import ApprovalsAuth from './approvals_auth.vue';
 import { FETCH_ERROR } from '~/vue_merge_request_widget/components/approvals/messages';
 import ApprovalsFooter from './approvals_footer.vue';
@@ -72,7 +73,7 @@ export default {
     refreshRules() {
       if (this.isBasic) return Promise.resolve();
 
-      this.$root.$emit('bv::hide::modal', this.modalId);
+      this.$root.$emit(BV_HIDE_MODAL, this.modalId);
 
       this.isLoadingRules = true;
 

ee/app/assets/javascripts/vue_shared/security_reports/mixins/vulnerability_modal_mixin.js

 import { mapActions } from 'vuex';
+import { BV_HIDE_MODAL } from '~/lib/utils/constants';
 import { VULNERABILITY_MODAL_ID } from '../components/constants';
 
 export const vulnerabilityModalMixin = (storeModule) => {
@@ -25,7 +26,7 @@ export const vulnerabilityModalMixin = (storeModule) => {
         return this.revertDismissVulnerability(payload).then(this.hideModal);
       },
       hideModal() {
-        this.$root.$emit('bv::hide::modal', VULNERABILITY_MODAL_ID);
+        this.$root.$emit(BV_HIDE_MODAL, VULNERABILITY_MODAL_ID);
       },
     },
   };

ee/spec/frontend/geo_nodes/components/app_spec.js

@@ -8,6 +8,7 @@ import GeoNodesService from 'ee/geo_nodes/service/geo_nodes_service';
 import GeoNodesStore from 'ee/geo_nodes/store/geo_nodes_store';
 import mountComponent from 'helpers/vue_mount_component_helper';
 import axios from '~/lib/utils/axios_utils';
+import { BV_SHOW_MODAL, BV_HIDE_MODAL } from '~/lib/utils/constants';
 import '~/vue_shared/plugins/global_toast';
 
 import {
@@ -398,7 +399,7 @@ describe('AppComponent', () => {
         expect(vm.modalTitle).toBe(modalTitle);
       });
 
-      it('emits `bv::show::modal` when actionType is `toggle` and node is enabled', () => {
+      it(`emits ${BV_SHOW_MODAL} when actionType is "toggle" and node is enabled`, () => {
         node.enabled = true;
         vm.showNodeActionModal({
           actionType: NODE_ACTIONS.TOGGLE,
@@ -409,7 +410,7 @@ describe('AppComponent', () => {
           modalTitle,
         });
 
-        expect(rootEmit).toHaveBeenCalledWith('bv::show::modal', vm.modalId);
+        expect(rootEmit).toHaveBeenCalledWith(BV_SHOW_MODAL, vm.modalId);
       });
 
       it('calls toggleNode when actionType is `toggle` and node.enabled is `false`', () => {
@@ -428,7 +429,7 @@ describe('AppComponent', () => {
         expect(vm.toggleNode).toHaveBeenCalledWith(vm.targetNode);
       });
 
-      it('emits `bv::show::modal` when actionType is not `toggle`', () => {
+      it(`emits ${BV_SHOW_MODAL} when actionType is not "toggle"`, () => {
         node.enabled = true;
         vm.showNodeActionModal({
           actionType: NODE_ACTIONS.REMOVE,
@@ -438,16 +439,16 @@ describe('AppComponent', () => {
           modalActionLabel,
         });
 
-        expect(rootEmit).toHaveBeenCalledWith('bv::show::modal', vm.modalId);
+        expect(rootEmit).toHaveBeenCalledWith(BV_SHOW_MODAL, vm.modalId);
       });
     });
 
     describe('hideNodeActionModal', () => {
-      it('emits `bv::hide::modal`', () => {
+      it(`emits ${BV_HIDE_MODAL}`, () => {
         const rootEmit = jest.spyOn(vm.$root, '$emit');
         vm.hideNodeActionModal();
 
-        expect(rootEmit).toHaveBeenCalledWith('bv::hide::modal', vm.modalId);
+        expect(rootEmit).toHaveBeenCalledWith(BV_HIDE_MODAL, vm.modalId);
       });
     });
 

ee/spec/frontend/reports/components/modal_open_name_spec.js

@@ -3,6 +3,7 @@ import Vuex from 'vuex';
 import { mountComponentWithStore } from 'helpers/vue_mount_component_helper';
 import { VULNERABILITY_MODAL_ID } from 'ee/vue_shared/security_reports/components/constants';
 import component from 'ee/reports/components/modal_open_name.vue';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 
 Vue.use(Vuex);
 
@@ -45,6 +46,6 @@ describe('Modal open name', () => {
     vm.$el.click();
 
     expect(vm.setModalData).toHaveBeenCalled();
-    expect(vm.$root.$emit).toHaveBeenCalledWith('bv::show::modal', VULNERABILITY_MODAL_ID);
+    expect(vm.$root.$emit).toHaveBeenCalledWith(BV_SHOW_MODAL, VULNERABILITY_MODAL_ID);
   });
 });

ee/spec/frontend/security_dashboard/components/security_dashboard_table_row_spec.js

@@ -6,6 +6,7 @@ import { VULNERABILITY_MODAL_ID } from 'ee/vue_shared/security_reports/component
 import createStore from 'ee/security_dashboard/store';
 import { DASHBOARD_TYPES } from 'ee/security_dashboard/store/constants';
 import { trimText } from 'helpers/text_helper';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 import mockDataVulnerabilities from '../store/modules/vulnerabilities/data/mock_data_vulnerabilities';
 
 const localVue = createLocalVue();
@@ -115,10 +116,7 @@ describe('Security Dashboard Table Row', () => {
         expect(store.dispatch).toHaveBeenCalledWith('vulnerabilities/setModalData', {
           vulnerability,
         });
-        expect(wrapper.vm.$root.$emit).toHaveBeenCalledWith(
-          'bv::show::modal',
-          VULNERABILITY_MODAL_ID,
-        );
+        expect(wrapper.vm.$root.$emit).toHaveBeenCalledWith(BV_SHOW_MODAL, VULNERABILITY_MODAL_ID);
       });
     });
 

ee/spec/frontend/security_dashboard/components/vulnerability_action_buttons_spec.js

@@ -4,6 +4,7 @@ import component from 'ee/security_dashboard/components/vulnerability_action_but
 import createStore from 'ee/security_dashboard/store';
 import { mountComponentWithStore } from 'helpers/vue_mount_component_helper';
 import { VULNERABILITY_MODAL_ID } from 'ee/vue_shared/security_reports/components/constants';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 import { resetStore } from '../helpers';
 import mockDataVulnerabilities from '../store/modules/vulnerabilities/data/mock_data_vulnerabilities';
 
@@ -60,7 +61,7 @@ describe('Security Dashboard Action Buttons', () => {
         expect(vm.$store.dispatch).toHaveBeenCalledWith('vulnerabilities/setModalData', {
           vulnerability: mockDataVulnerabilities[0],
         });
-        expect(vm.$root.$emit).toHaveBeenCalledWith('bv::show::modal', VULNERABILITY_MODAL_ID);
+        expect(vm.$root.$emit).toHaveBeenCalledWith(BV_SHOW_MODAL, VULNERABILITY_MODAL_ID);
       });
     });
 

spec/frontend/projects/commit/components/form_modal_spec.js

@@ -8,6 +8,7 @@ import eventHub from '~/projects/commit/event_hub';
 import CommitFormModal from '~/projects/commit/components/form_modal.vue';
 import BranchesDropdown from '~/projects/commit/components/branches_dropdown.vue';
 import createStore from '~/projects/commit/store';
+import { BV_SHOW_MODAL } from '~/lib/utils/constants';
 import mockData from '../mock_data';
 
 describe('CommitFormModal', () => {
@@ -64,7 +65,7 @@ describe('CommitFormModal', () => {
 
       wrapper.vm.show();
 
-      expect(rootEmit).toHaveBeenCalledWith('bv::show::modal', mockData.modalPropsData.modalId);
+      expect(rootEmit).toHaveBeenCalledWith(BV_SHOW_MODAL, mockData.modalPropsData.modalId);
     });
 
     it('Clears the modal state once modal is hidden', () => {

spec/frontend/vue_shared/components/gl_modal_vuex_spec.js

@@ -3,6 +3,7 @@ import Vuex from 'vuex';
 import { GlModal } from '@gitlab/ui';
 import GlModalVuex from '~/vue_shared/components/gl_modal_vuex.vue';
 import createState from '~/vuex_shared/modules/modal/state';
+import { BV_SHOW_MODAL, BV_HIDE_MODAL } from '~/lib/utils/constants';
 
 const localVue = createLocalVue();
 localVue.use(Vuex);
@@ -129,7 +130,7 @@ describe('GlModalVuex', () => {
     wrapper.vm
       .$nextTick()
       .then(() => {
-        expect(rootEmit).toHaveBeenCalledWith('bv::show::modal', TEST_MODAL_ID);
+        expect(rootEmit).toHaveBeenCalledWith(BV_SHOW_MODAL, TEST_MODAL_ID);
       })
       .then(done)
       .catch(done.fail);
@@ -146,7 +147,7 @@ describe('GlModalVuex', () => {
     wrapper.vm
       .$nextTick()
       .then(() => {
-        expect(rootEmit).toHaveBeenCalledWith('bv::hide::modal', TEST_MODAL_ID);
+        expect(rootEmit).toHaveBeenCalledWith(BV_HIDE_MODAL, TEST_MODAL_ID);
       })
       .then(done)
       .catch(done.fail);