1 files changed, 22 insertions, 6 deletions

diff --git a/spec/frontend/boards/components/board_settings_sidebar_spec.js b/spec/frontend/boards/components/board_settings_sidebar_spec.js
index 46dd109ffb1..7f40c426b30 100644
--- a/spec/frontend/boards/components/board_settings_sidebar_spec.js
+++ b/spec/frontend/boards/components/board_settings_sidebar_spec.js
@@ -1,8 +1,9 @@
-import { GlDrawer, GlLabel } from '@gitlab/ui';
+import { GlDrawer, GlLabel, GlModal, GlButton } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import { MountingPortal } from 'portal-vue';
-import Vue from 'vue';
+import Vue, { nextTick } from 'vue';
 import Vuex from 'vuex';
+import { createMockDirective, getBinding } from 'helpers/vue_mock_directive';
 import { stubComponent } from 'helpers/stub_component';
 import { extendedWrapper } from 'helpers/vue_test_utils_helper';
 import BoardSettingsSidebar from '~/boards/components/board_settings_sidebar.vue';
@@ -20,8 +21,7 @@ describe('BoardSettingsSidebar', () => {
   const labelTitle = mockLabelList.label.title;
   const labelColor = mockLabelList.label.color;
   const listId = mockLabelList.id;
-
-  const findRemoveButton = () => wrapper.findByTestId('remove-list');
+  const modalID = 'board-settings-sidebar-modal';
 
   const createComponent = ({
     canAdminList = false,
@@ -46,6 +46,9 @@ describe('BoardSettingsSidebar', () => {
           canAdminList,
           scopedLabelsAvailable: false,
         },
+        directives: {
+          GlModal: createMockDirective(),
+        },
         stubs: {
           GlDrawer: stubComponent(GlDrawer, {
             template: '<div><slot name="header"></slot><slot></slot></div>',
@@ -56,6 +59,8 @@ describe('BoardSettingsSidebar', () => {
   };
   const findLabel = () => wrapper.find(GlLabel);
   const findDrawer = () => wrapper.find(GlDrawer);
+  const findModal = () => wrapper.find(GlModal);
+  const findRemoveButton = () => wrapper.find(GlButton);
 
   afterEach(() => {
     jest.restoreAllMocks();
@@ -86,7 +91,7 @@ describe('BoardSettingsSidebar', () => {
 
         findDrawer().vm.$emit('close');
 
-        await wrapper.vm.$nextTick();
+        await nextTick();
 
         expect(wrapper.find(GlDrawer).exists()).toBe(false);
       });
@@ -96,7 +101,7 @@ describe('BoardSettingsSidebar', () => {
 
         sidebarEventHub.$emit('sidebar.closeAll');
 
-        await wrapper.vm.$nextTick();
+        await nextTick();
 
         expect(wrapper.find(GlDrawer).exists()).toBe(false);
       });
@@ -161,5 +166,16 @@ describe('BoardSettingsSidebar', () => {
 
       expect(findRemoveButton().exists()).toBe(true);
     });
+
+    it('has the correct ID on the button', () => {
+      createComponent({ canAdminList: true, activeId: listId, list: mockLabelList });
+      const binding = getBinding(findRemoveButton().element, 'gl-modal');
+      expect(binding.value).toBe(modalID);
+    });
+
+    it('has the correct ID on the modal', () => {
+      createComponent({ canAdminList: true, activeId: listId, list: mockLabelList });
+      expect(findModal().props('modalId')).toBe(modalID);
+    });
   });
 });