Replace bootstrap event strings with constants

This replaces the usage of the following bootstrap event names with
constants defined in ~/lib/utils/constants.js.

| Event Name           | Constant           |
| -------------------- | ------------------ |
| `bv::hide:tooltip`   | `BV_HIDE_TOOLTIP`  |
| `bv::dropdown::show` | `BV_DROPDOWN_SHOW` |
| `bv::dropdown::hide` | `BV_DROPDOWN_HIDE` |

app/assets/javascripts/boards/components/board_list_deprecated.vue

@@ -3,6 +3,7 @@ import { Sortable, MultiDrag } from 'sortablejs';
 import { GlLoadingIcon } from '@gitlab/ui';
 import { sprintf, __ } from '~/locale';
 import { deprecatedCreateFlash as createFlash } from '~/flash';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 import eventHub from '../eventhub';
 import boardsStore from '../stores/boards_store';
 import {
@@ -167,7 +168,7 @@ export default {
 
         boardsStore.startMoving(list, issue);
 
-        this.$root.$emit('bv::hide::tooltip');
+        this.$root.$emit(BV_HIDE_TOOLTIP);
 
         sortableStart();
       },

app/assets/javascripts/boards/components/board_list_header.vue

@@ -13,6 +13,7 @@ import { n__, s__, __ } from '~/locale';
 import sidebarEventHub from '~/sidebar/event_hub';
 import { isScopedLabel } from '~/lib/utils/common_utils';
 import { isListDraggable } from '~/boards/boards_util';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 import { inactiveId, LIST, ListType } from '../constants';
 import eventHub from '../eventhub';
 import AccessorUtilities from '../../lib/utils/accessor';
@@ -158,7 +159,7 @@ export default {
 
       // When expanding/collapsing, the tooltip on the caret button sometimes stays open.
       // Close all tooltips manually to prevent dangling tooltips.
-      this.$root.$emit('bv::hide::tooltip');
+      this.$root.$emit(BV_HIDE_TOOLTIP);
     },
     addToLocalStorage() {
       if (AccessorUtilities.isLocalStorageAccessSafe()) {

app/assets/javascripts/boards/components/board_list_header_deprecated.vue

@@ -17,6 +17,7 @@ import boardsStore from '../stores/boards_store';
 import eventHub from '../eventhub';
 import { inactiveId, LIST, ListType } from '../constants';
 import IssueCount from './issue_count.vue';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 
 // This component is being replaced in favor of './board_list_header.vue' for GraphQL boards
 
@@ -142,7 +143,7 @@ export default {
 
       // When expanding/collapsing, the tooltip on the caret button sometimes stays open.
       // Close all tooltips manually to prevent dangling tooltips.
-      this.$root.$emit('bv::hide::tooltip');
+      this.$root.$emit(BV_HIDE_TOOLTIP);
     },
     addToLocalStorage() {
       if (AccessorUtilities.isLocalStorageAccessSafe()) {

app/assets/javascripts/boards/components/sidebar/board_sidebar_milestone_select.vue

@@ -10,6 +10,7 @@ import {
 } from '@gitlab/ui';
 import BoardEditableItem from '~/boards/components/sidebar/board_editable_item.vue';
 import createFlash from '~/flash';
+import { BV_DROPDOWN_HIDE } from '~/lib/utils/constants';
 import { __, s__ } from '~/locale';
 import projectMilestones from '../../graphql/project_milestones.query.graphql';
 
@@ -73,7 +74,7 @@ export default {
     },
   },
   mounted() {
-    this.$root.$on('bv::dropdown::hide', () => {
+    this.$root.$on(BV_DROPDOWN_HIDE, () => {
       this.$refs.sidebarItem.collapse();
     });
   },

app/assets/javascripts/diffs/components/diff_row.vue

@@ -11,6 +11,7 @@ import {
   CONFLICT_THEIR,
   CONFLICT_MARKER,
 } from '../constants';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 import DiffGutterAvatars from './diff_gutter_avatars.vue';
 import * as utils from './diff_row_utils';
 
@@ -162,7 +163,7 @@ export default {
       this.$emit('enterdragging', { ...line, index });
     },
     onDragStart(line) {
-      this.$root.$emit('bv::hide::tooltip');
+      this.$root.$emit(BV_HIDE_TOOLTIP);
       this.dragging = true;
       this.$emit('startdragging', line);
     },

app/assets/javascripts/environments/components/environment_delete.vue

@@ -6,6 +6,7 @@
 
 import { GlTooltipDirective, GlButton, GlModalDirective } from '@gitlab/ui';
 import { s__ } from '~/locale';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 import eventHub from '../event_hub';
 
 export default {
@@ -40,7 +41,7 @@ export default {
   },
   methods: {
     onClick() {
-      this.$root.$emit('bv::hide::tooltip', this.$options.deleteEnvironmentTooltipId);
+      this.$root.$emit(BV_HIDE_TOOLTIP, this.$options.deleteEnvironmentTooltipId);
       eventHub.$emit('requestDeleteEnvironment', this.environment);
     },
     onDeleteEnvironment(environment) {

app/assets/javascripts/environments/components/environment_stop.vue

@@ -6,6 +6,7 @@
 
 import { GlTooltipDirective, GlButton, GlModalDirective } from '@gitlab/ui';
 import { s__ } from '~/locale';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 import eventHub from '../event_hub';
 
 export default {
@@ -40,7 +41,7 @@ export default {
   },
   methods: {
     onClick() {
-      this.$root.$emit('bv::hide::tooltip', this.$options.stopEnvironmentTooltipId);
+      this.$root.$emit(BV_HIDE_TOOLTIP, this.$options.stopEnvironmentTooltipId);
       eventHub.$emit('requestStopEnvironment', this.environment);
     },
     onStopEnvironment(environment) {

app/assets/javascripts/ide/components/activity_bar.vue

 <script>
 import { mapActions, mapState } from 'vuex';
 import { GlIcon, GlTooltipDirective } from '@gitlab/ui';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 import { leftSidebarViews } from '../constants';
 
 export default {
@@ -20,7 +21,7 @@ export default {
 
       this.updateActivityBarView(view);
 
-      this.$root.$emit('bv::hide::tooltip');
+      this.$root.$emit(BV_HIDE_TOOLTIP);
     },
   },
   leftSidebarViews,

app/assets/javascripts/ide/components/ide_sidebar_nav.vue

 <script>
 import { GlTooltipDirective, GlIcon } from '@gitlab/ui';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 import { otherSide } from '../utils';
 import { SIDE_RIGHT } from '../constants';
 
@@ -50,7 +51,7 @@ export default {
     },
     clickTab(e, tab) {
       e.currentTarget.blur();
-      this.$root.$emit('bv::hide::tooltip');
+      this.$root.$emit(BV_HIDE_TOOLTIP);
 
       if (this.isActiveTab(tab)) {
         this.$emit('close');

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

@@ -13,3 +13,6 @@ export const DATETIME_RANGE_TYPES = {
 
 export const BV_SHOW_MODAL = 'bv::show::modal';
 export const BV_HIDE_MODAL = 'bv::hide::modal';
+export const BV_HIDE_TOOLTIP = 'bv::hide::tooltip';
+export const BV_DROPDOWN_SHOW = 'bv::dropdown::show';
+export const BV_DROPDOWN_HIDE = 'bv::dropdown::hide';

app/assets/javascripts/notes/components/note_actions.vue

@@ -6,6 +6,7 @@ import resolvedStatusMixin from '~/batch_comments/mixins/resolved_status';
 import eventHub from '~/sidebar/event_hub';
 import Api from '~/api';
 import { deprecatedCreateFlash as flash } from '~/flash';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 import { splitCamelCase } from '../../lib/utils/text_utility';
 import ReplyButton from './note_actions/reply_button.vue';
 
@@ -193,7 +194,7 @@ export default {
     },
     closeTooltip() {
       this.$nextTick(() => {
-        this.$root.$emit('bv::hide::tooltip');
+        this.$root.$emit(BV_HIDE_TOOLTIP);
       });
     },
     handleAssigneeUpdate(assignees) {

app/assets/javascripts/pipelines/components/graph/action_component.vue

@@ -3,6 +3,7 @@ import { GlTooltipDirective, GlButton, GlLoadingIcon, GlIcon } from '@gitlab/ui'
 import axios from '~/lib/utils/axios_utils';
 import { dasherize } from '~/lib/utils/text_utility';
 import { __ } from '~/locale';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 import { deprecatedCreateFlash as createFlash } from '~/flash';
 import { reportToSentry } from './utils';
 
@@ -62,7 +63,7 @@ export default {
      *
      */
     onClickAction() {
-      this.$root.$emit('bv::hide::tooltip', `js-ci-action-${this.link}`);
+      this.$root.$emit(BV_HIDE_TOOLTIP, `js-ci-action-${this.link}`);
       this.isDisabled = true;
       this.isLoading = true;
 

app/assets/javascripts/pipelines/components/graph/job_item.vue

@@ -4,6 +4,7 @@ import { sprintf } from '~/locale';
 import delayedJobMixin from '~/jobs/mixins/delayed_job_mixin';
 import ActionComponent from './action_component.vue';
 import JobNameComponent from './job_name_component.vue';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 import { accessValue } from './accessors';
 import { REST } from './constants';
 import { reportToSentry } from './utils';
@@ -144,7 +145,7 @@ export default {
   },
   methods: {
     hideTooltips() {
-      this.$root.$emit('bv::hide::tooltip');
+      this.$root.$emit(BV_HIDE_TOOLTIP);
     },
     pipelineActionRequestComplete() {
       this.$emit('pipelineActionRequestComplete');

app/assets/javascripts/pipelines/components/graph/linked_pipeline.vue

@@ -2,6 +2,7 @@
 import { GlTooltipDirective, GlButton, GlLink, GlLoadingIcon, GlBadge } from '@gitlab/ui';
 import CiStatus from '~/vue_shared/components/ci_icon.vue';
 import { __, sprintf } from '~/locale';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 import { accessValue } from './accessors';
 import { DOWNSTREAM, REST, UPSTREAM } from './constants';
 import { reportToSentry } from './utils';
@@ -126,7 +127,7 @@ export default {
       this.$emit('pipelineExpandToggle', this.sourceJobName, !this.expanded);
     },
     hideTooltips() {
-      this.$root.$emit('bv::hide::tooltip');
+      this.$root.$emit(BV_HIDE_TOOLTIP);
     },
     onDownstreamHovered() {
       this.$emit('downstreamHovered', this.sourceJobName);

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

@@ -2,6 +2,7 @@
 import { GlButton, GlTooltipDirective } from '@gitlab/ui';
 import Clipboard from 'clipboard';
 import { uniqueId } from 'lodash';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 
 export default {
   components: {
@@ -76,7 +77,7 @@ export default {
       });
       this.clipboard
         .on('success', (e) => {
-          this.$root.$emit('bv::hide::tooltip', this.id);
+          this.$root.$emit(BV_HIDE_TOOLTIP, this.id);
           this.$emit('success', e);
           // Clear the selection and blur the trigger so it loses its border
           e.clearSelection();

changelogs/unreleased/Replace-bootstrap-event-strings-with-constants.yml

+---
+title: Replace bootstrap event strings with constants
+merge_request: 52777
+author: Kev @KevSlashNull
+type: other

spec/frontend/ide/components/ide_sidebar_nav_spec.js

@@ -3,6 +3,7 @@ import { GlIcon } from '@gitlab/ui';
 import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
 import IdeSidebarNav from '~/ide/components/ide_sidebar_nav.vue';
 import { SIDE_RIGHT, SIDE_LEFT } from '~/ide/constants';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 
 const TEST_TABS = [
   {
@@ -74,7 +75,7 @@ describe('ide/components/ide_sidebar_nav', () => {
         createComponent({ isOpen, side });
 
         bsTooltipHide = jest.fn();
-        wrapper.vm.$root.$on('bv::hide::tooltip', bsTooltipHide);
+        wrapper.vm.$root.$on(BV_HIDE_TOOLTIP, bsTooltipHide);
       });
 
       it('renders buttons', () => {

spec/frontend/members/components/table/role_dropdown_spec.js

@@ -6,6 +6,7 @@ import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
 import { GlBreakpointInstance as bp } from '@gitlab/ui/dist/utils';
 import waitForPromises from 'helpers/wait_for_promises';
 import RoleDropdown from '~/members/components/table/role_dropdown.vue';
+import { BV_DROPDOWN_SHOW } from '~/lib/utils/constants';
 import { member } from '../../mock_data';
 
 const localVue = createLocalVue();
@@ -67,7 +68,7 @@ describe('RoleDropdown', () => {
       createComponent();
 
       findDropdownToggle().trigger('click');
-      wrapper.vm.$root.$on('bv::dropdown::shown', () => {
+      wrapper.vm.$root.$on(BV_DROPDOWN_SHOW, () => {
         done();
       });
     });

spec/frontend/notes/components/note_actions_spec.js

@@ -6,6 +6,7 @@ import createStore from '~/notes/stores';
 import noteActions from '~/notes/components/note_actions.vue';
 import axios from '~/lib/utils/axios_utils';
 import { userDataMock } from '../mock_data';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 
 describe('noteActions', () => {
   let wrapper;
@@ -135,7 +136,7 @@ describe('noteActions', () => {
           .then(() => {
             const emitted = Object.keys(rootWrapper.emitted());
 
-            expect(emitted).toEqual(['bv::hide::tooltip']);
+            expect(emitted).toEqual([BV_HIDE_TOOLTIP]);
             done();
           })
           .catch(done.fail);

spec/frontend/pipelines/graph/linked_pipeline_spec.js

@@ -4,6 +4,7 @@ import LinkedPipelineComponent from '~/pipelines/components/graph/linked_pipelin
 import CiStatus from '~/vue_shared/components/ci_icon.vue';
 import { UPSTREAM, DOWNSTREAM } from '~/pipelines/components/graph/constants';
 import mockData from './linked_pipelines_mock_data';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 
 const mockPipeline = mockData.triggered[0];
 const validTriggeredPipelineId = mockPipeline.project.id;
@@ -212,11 +213,11 @@ describe('Linked pipeline', () => {
       expect(wrapper.emitted().pipelineClicked).toBeTruthy();
     });
 
-    it('should emit `bv::hide::tooltip` to close the tooltip', () => {
+    it(`should emit ${BV_HIDE_TOOLTIP} to close the tooltip`, () => {
       jest.spyOn(wrapper.vm.$root, '$emit');
       findButton().trigger('click');
 
-      expect(wrapper.vm.$root.$emit.mock.calls[0]).toEqual(['bv::hide::tooltip']);
+      expect(wrapper.vm.$root.$emit.mock.calls[0]).toEqual([BV_HIDE_TOOLTIP]);
     });
 
     it('should emit downstreamHovered with job name on mouseover', () => {

spec/frontend/vue_shared/components/modal_copy_button_spec.js

 import { shallowMount, createWrapper } from '@vue/test-utils';
 import ModalCopyButton from '~/vue_shared/components/modal_copy_button.vue';
+import { BV_HIDE_TOOLTIP } from '~/lib/utils/constants';
 
 describe('modal copy button', () => {
   let wrapper;
@@ -31,7 +32,7 @@ describe('modal copy button', () => {
       return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.emitted().success).not.toBeEmpty();
         expect(document.execCommand).toHaveBeenCalledWith('copy');
-        expect(root.emitted('bv::hide::tooltip')).toEqual([['test-id']]);
+        expect(root.emitted(BV_HIDE_TOOLTIP)).toEqual([['test-id']]);
       });
     });
     it("should propagate the clipboard error event if execCommand doesn't work", () => {