summaryrefslogtreecommitdiff
path: root/spec/frontend/sidebar
diff options
context:
space:
mode:
Diffstat (limited to 'spec/frontend/sidebar')
-rw-r--r--spec/frontend/sidebar/__snapshots__/confidential_issue_sidebar_spec.js.snap40
-rw-r--r--spec/frontend/sidebar/__snapshots__/todo_spec.js.snap2
-rw-r--r--spec/frontend/sidebar/assignees_spec.js5
-rw-r--r--spec/frontend/sidebar/components/assignees/collapsed_assignee_list_spec.js4
-rw-r--r--spec/frontend/sidebar/components/severity/severity_spec.js57
-rw-r--r--spec/frontend/sidebar/components/severity/sidebar_severity_spec.js166
-rw-r--r--spec/frontend/sidebar/issuable_assignees_spec.js59
-rw-r--r--spec/frontend/sidebar/participants_spec.js10
-rw-r--r--spec/frontend/sidebar/sidebar_labels_spec.js124
-rw-r--r--spec/frontend/sidebar/sidebar_move_issue_spec.js6
-rw-r--r--spec/frontend/sidebar/subscriptions_spec.js2
-rw-r--r--spec/frontend/sidebar/todo_spec.js11
12 files changed, 439 insertions, 47 deletions
diff --git a/spec/frontend/sidebar/__snapshots__/confidential_issue_sidebar_spec.js.snap b/spec/frontend/sidebar/__snapshots__/confidential_issue_sidebar_spec.js.snap
index 4c1ab4a499c..11ab1ca3aaa 100644
--- a/spec/frontend/sidebar/__snapshots__/confidential_issue_sidebar_spec.js.snap
+++ b/spec/frontend/sidebar/__snapshots__/confidential_issue_sidebar_spec.js.snap
@@ -7,13 +7,9 @@ exports[`Confidential Issue Sidebar Block renders for confidential = false and i
>
<div
class="sidebar-collapsed-icon"
- data-boundary="viewport"
- data-container="body"
- data-original-title="Not confidential"
- data-placement="left"
- title=""
+ title="Not confidential"
>
- <icon-stub
+ <gl-icon-stub
aria-hidden="true"
name="eye"
size="16"
@@ -38,7 +34,7 @@ exports[`Confidential Issue Sidebar Block renders for confidential = false and i
class="no-value sidebar-item-value"
data-testid="not-confidential"
>
- <icon-stub
+ <gl-icon-stub
aria-hidden="true"
class="sidebar-item-icon inline"
name="eye"
@@ -59,13 +55,9 @@ exports[`Confidential Issue Sidebar Block renders for confidential = false and i
>
<div
class="sidebar-collapsed-icon"
- data-boundary="viewport"
- data-container="body"
- data-original-title="Not confidential"
- data-placement="left"
- title=""
+ title="Not confidential"
>
- <icon-stub
+ <gl-icon-stub
aria-hidden="true"
name="eye"
size="16"
@@ -98,7 +90,7 @@ exports[`Confidential Issue Sidebar Block renders for confidential = false and i
class="no-value sidebar-item-value"
data-testid="not-confidential"
>
- <icon-stub
+ <gl-icon-stub
aria-hidden="true"
class="sidebar-item-icon inline"
name="eye"
@@ -119,13 +111,9 @@ exports[`Confidential Issue Sidebar Block renders for confidential = true and is
>
<div
class="sidebar-collapsed-icon"
- data-boundary="viewport"
- data-container="body"
- data-original-title="Confidential"
- data-placement="left"
- title=""
+ title="Confidential"
>
- <icon-stub
+ <gl-icon-stub
aria-hidden="true"
name="eye-slash"
size="16"
@@ -149,7 +137,7 @@ exports[`Confidential Issue Sidebar Block renders for confidential = true and is
<div
class="value sidebar-item-value hide-collapsed"
>
- <icon-stub
+ <gl-icon-stub
aria-hidden="true"
class="sidebar-item-icon inline is-active"
name="eye-slash"
@@ -170,13 +158,9 @@ exports[`Confidential Issue Sidebar Block renders for confidential = true and is
>
<div
class="sidebar-collapsed-icon"
- data-boundary="viewport"
- data-container="body"
- data-original-title="Confidential"
- data-placement="left"
- title=""
+ title="Confidential"
>
- <icon-stub
+ <gl-icon-stub
aria-hidden="true"
name="eye-slash"
size="16"
@@ -208,7 +192,7 @@ exports[`Confidential Issue Sidebar Block renders for confidential = true and is
<div
class="value sidebar-item-value hide-collapsed"
>
- <icon-stub
+ <gl-icon-stub
aria-hidden="true"
class="sidebar-item-icon inline is-active"
name="eye-slash"
diff --git a/spec/frontend/sidebar/__snapshots__/todo_spec.js.snap b/spec/frontend/sidebar/__snapshots__/todo_spec.js.snap
index 0a12eb327de..42012841f0b 100644
--- a/spec/frontend/sidebar/__snapshots__/todo_spec.js.snap
+++ b/spec/frontend/sidebar/__snapshots__/todo_spec.js.snap
@@ -13,7 +13,7 @@ exports[`SidebarTodo template renders component container element with proper da
title=""
type="button"
>
- <icon-stub
+ <gl-icon-stub
class="todo-undone"
name="todo-done"
size="16"
diff --git a/spec/frontend/sidebar/assignees_spec.js b/spec/frontend/sidebar/assignees_spec.js
index 3418680f8ea..d1810ada97a 100644
--- a/spec/frontend/sidebar/assignees_spec.js
+++ b/spec/frontend/sidebar/assignees_spec.js
@@ -1,5 +1,6 @@
import { mount } from '@vue/test-utils';
import { trimText } from 'helpers/text_helper';
+import { GlIcon } from '@gitlab/ui';
import Assignee from '~/sidebar/components/assignees/assignees.vue';
import UsersMock from './mock_data';
import UsersMockHelper from '../helpers/user_mock_data_helper';
@@ -29,10 +30,12 @@ describe('Assignee component', () => {
it('displays no assignee icon when collapsed', () => {
createWrapper();
const collapsedChildren = findCollapsedChildren();
+ const userIcon = collapsedChildren.at(0).find(GlIcon);
expect(collapsedChildren.length).toBe(1);
expect(collapsedChildren.at(0).attributes('aria-label')).toBe('None');
- expect(collapsedChildren.at(0).classes()).toContain('fa', 'fa-user');
+ expect(userIcon.exists()).toBe(true);
+ expect(userIcon.props('name')).toBe('user');
});
it('displays only "None" when no users are assigned and the issue is read-only', () => {
diff --git a/spec/frontend/sidebar/components/assignees/collapsed_assignee_list_spec.js b/spec/frontend/sidebar/components/assignees/collapsed_assignee_list_spec.js
index a1e19c1dd8e..907d6144415 100644
--- a/spec/frontend/sidebar/components/assignees/collapsed_assignee_list_spec.js
+++ b/spec/frontend/sidebar/components/assignees/collapsed_assignee_list_spec.js
@@ -1,4 +1,5 @@
import { shallowMount } from '@vue/test-utils';
+import { GlIcon } from '@gitlab/ui';
import UsersMockHelper from 'helpers/user_mock_data_helper';
import CollapsedAssigneeList from '~/sidebar/components/assignees/collapsed_assignee_list.vue';
import CollapsedAssignee from '~/sidebar/components/assignees/collapsed_assignee.vue';
@@ -20,7 +21,7 @@ describe('CollapsedAssigneeList component', () => {
});
}
- const findNoUsersIcon = () => wrapper.find('i[aria-label=None]');
+ const findNoUsersIcon = () => wrapper.find(GlIcon);
const findAvatarCounter = () => wrapper.find('.avatar-counter');
const findAssignees = () => wrapper.findAll(CollapsedAssignee);
const getTooltipTitle = () => wrapper.attributes('title');
@@ -38,6 +39,7 @@ describe('CollapsedAssigneeList component', () => {
it('has no users', () => {
expect(findNoUsersIcon().exists()).toBe(true);
+ expect(findNoUsersIcon().props('name')).toBe('user');
});
});
diff --git a/spec/frontend/sidebar/components/severity/severity_spec.js b/spec/frontend/sidebar/components/severity/severity_spec.js
new file mode 100644
index 00000000000..b6690f11d6b
--- /dev/null
+++ b/spec/frontend/sidebar/components/severity/severity_spec.js
@@ -0,0 +1,57 @@
+import { shallowMount } from '@vue/test-utils';
+import { GlIcon } from '@gitlab/ui';
+import SeverityToken from '~/sidebar/components/severity/severity.vue';
+import { INCIDENT_SEVERITY } from '~/sidebar/components/severity/constants';
+
+describe('SeverityToken', () => {
+ let wrapper;
+
+ function createComponent(props) {
+ wrapper = shallowMount(SeverityToken, {
+ propsData: {
+ ...props,
+ },
+ });
+ }
+
+ afterEach(() => {
+ if (wrapper) {
+ wrapper.destroy();
+ wrapper = null;
+ }
+ });
+
+ const findIcon = () => wrapper.find(GlIcon);
+
+ it('renders severity token for each severity type', () => {
+ Object.values(INCIDENT_SEVERITY).forEach(severity => {
+ createComponent({ severity });
+ expect(findIcon().classes()).toContain(`icon-${severity.icon}`);
+ expect(findIcon().attributes('name')).toBe(`severity-${severity.icon}`);
+ expect(wrapper.text()).toBe(severity.label);
+ });
+ });
+
+ it('renders only icon when `iconOnly` prop is set to `true`', () => {
+ const severity = INCIDENT_SEVERITY.CRITICAL;
+ createComponent({ severity, iconOnly: true });
+ expect(findIcon().classes()).toContain(`icon-${severity.icon}`);
+ expect(findIcon().attributes('name')).toBe(`severity-${severity.icon}`);
+ expect(wrapper.text()).toBe('');
+ });
+
+ describe('icon size', () => {
+ it('renders the icon in default size when other is not specified', () => {
+ const severity = INCIDENT_SEVERITY.HIGH;
+ createComponent({ severity });
+ expect(findIcon().attributes('size')).toBe('12');
+ });
+
+ it('renders the icon in provided size', () => {
+ const severity = INCIDENT_SEVERITY.HIGH;
+ const iconSize = 14;
+ createComponent({ severity, iconSize });
+ expect(findIcon().attributes('size')).toBe(`${iconSize}`);
+ });
+ });
+});
diff --git a/spec/frontend/sidebar/components/severity/sidebar_severity_spec.js b/spec/frontend/sidebar/components/severity/sidebar_severity_spec.js
new file mode 100644
index 00000000000..638d3706d12
--- /dev/null
+++ b/spec/frontend/sidebar/components/severity/sidebar_severity_spec.js
@@ -0,0 +1,166 @@
+import { shallowMount } from '@vue/test-utils';
+import { GlDropdown, GlDropdownItem, GlLoadingIcon, GlTooltip, GlSprintf } from '@gitlab/ui';
+import waitForPromises from 'helpers/wait_for_promises';
+import createFlash from '~/flash';
+import SidebarSeverity from '~/sidebar/components/severity/sidebar_severity.vue';
+import SeverityToken from '~/sidebar/components/severity/severity.vue';
+import updateIssuableSeverity from '~/sidebar/components/severity/graphql/mutations/update_issuable_severity.mutation.graphql';
+import { INCIDENT_SEVERITY, ISSUABLE_TYPES } from '~/sidebar/components/severity/constants';
+
+jest.mock('~/flash');
+
+describe('SidebarSeverity', () => {
+ let wrapper;
+ let mutate;
+ const projectPath = 'gitlab-org/gitlab-test';
+ const iid = '1';
+ const severity = 'CRITICAL';
+
+ function createComponent(props = {}) {
+ const propsData = {
+ projectPath,
+ iid,
+ issuableType: ISSUABLE_TYPES.INCIDENT,
+ initialSeverity: severity,
+ ...props,
+ };
+ mutate = jest.fn();
+ wrapper = shallowMount(SidebarSeverity, {
+ propsData,
+ mocks: {
+ $apollo: {
+ mutate,
+ },
+ },
+ stubs: {
+ GlSprintf,
+ },
+ });
+ }
+
+ beforeEach(() => {
+ createComponent();
+ });
+
+ afterEach(() => {
+ if (wrapper) {
+ wrapper.destroy();
+ wrapper = null;
+ }
+ });
+
+ const findSeverityToken = () => wrapper.findAll(SeverityToken);
+ const findEditBtn = () => wrapper.find('[data-testid="editButton"]');
+ const findDropdown = () => wrapper.find(GlDropdown);
+ const findCriticalSeverityDropdownItem = () => wrapper.find(GlDropdownItem);
+ const findLoadingIcon = () => wrapper.find(GlLoadingIcon);
+ const findTooltip = () => wrapper.find(GlTooltip);
+ const findCollapsedSeverity = () => wrapper.find({ ref: 'severity' });
+
+ it('renders severity widget', () => {
+ expect(findEditBtn().exists()).toBe(true);
+ expect(findSeverityToken().exists()).toBe(true);
+ expect(findDropdown().exists()).toBe(true);
+ });
+
+ describe('Update severity', () => {
+ it('calls `$apollo.mutate` with `updateIssuableSeverity`', () => {
+ jest
+ .spyOn(wrapper.vm.$apollo, 'mutate')
+ .mockResolvedValueOnce({ data: { issueSetSeverity: { issue: { severity } } } });
+
+ findCriticalSeverityDropdownItem().vm.$emit('click');
+ expect(wrapper.vm.$apollo.mutate).toHaveBeenCalledWith({
+ mutation: updateIssuableSeverity,
+ variables: {
+ iid,
+ projectPath,
+ severity,
+ },
+ });
+ });
+
+ it('shows error alert when severity update fails ', () => {
+ const errorMsg = 'Something went wrong';
+ jest.spyOn(wrapper.vm.$apollo, 'mutate').mockRejectedValueOnce(errorMsg);
+ findCriticalSeverityDropdownItem().vm.$emit('click');
+
+ setImmediate(() => {
+ expect(createFlash).toHaveBeenCalled();
+ });
+ });
+
+ it('shows loading icon while updating', async () => {
+ let resolvePromise;
+ wrapper.vm.$apollo.mutate = jest.fn(
+ () =>
+ new Promise(resolve => {
+ resolvePromise = resolve;
+ }),
+ );
+ findCriticalSeverityDropdownItem().vm.$emit('click');
+
+ await wrapper.vm.$nextTick();
+ expect(findLoadingIcon().exists()).toBe(true);
+
+ resolvePromise();
+ await waitForPromises();
+ expect(findLoadingIcon().exists()).toBe(false);
+ });
+ });
+
+ describe('Switch between collapsed/expanded view of the sidebar', () => {
+ const HIDDDEN_CLASS = 'gl-display-none';
+ const SHOWN_CLASS = 'show';
+
+ describe('collapsed', () => {
+ it('should have collapsed icon class', () => {
+ expect(findCollapsedSeverity().classes('sidebar-collapsed-icon')).toBe(true);
+ });
+
+ it('should display only icon with a tooltip', () => {
+ expect(
+ findSeverityToken()
+ .at(0)
+ .attributes('icononly'),
+ ).toBe('true');
+ expect(
+ findSeverityToken()
+ .at(0)
+ .attributes('iconsize'),
+ ).toBe('14');
+ expect(
+ findTooltip()
+ .text()
+ .replace(/\s+/g, ' '),
+ ).toContain(`Severity: ${INCIDENT_SEVERITY[severity].label}`);
+ });
+
+ it('should expand the dropdown on collapsed icon click', async () => {
+ wrapper.vm.isDropdownShowing = false;
+ await wrapper.vm.$nextTick();
+ expect(findDropdown().classes(HIDDDEN_CLASS)).toBe(true);
+
+ findCollapsedSeverity().trigger('click');
+ await wrapper.vm.$nextTick();
+ expect(findDropdown().classes(SHOWN_CLASS)).toBe(true);
+ });
+ });
+
+ describe('expanded', () => {
+ it('toggles dropdown with edit button', async () => {
+ wrapper.vm.isDropdownShowing = false;
+ await wrapper.vm.$nextTick();
+ expect(findDropdown().classes(HIDDDEN_CLASS)).toBe(true);
+
+ findEditBtn().vm.$emit('click');
+ await wrapper.vm.$nextTick();
+ expect(findDropdown().classes(SHOWN_CLASS)).toBe(true);
+
+ findEditBtn().vm.$emit('click');
+ await wrapper.vm.$nextTick();
+ expect(findDropdown().classes(HIDDDEN_CLASS)).toBe(true);
+ });
+ });
+ });
+});
diff --git a/spec/frontend/sidebar/issuable_assignees_spec.js b/spec/frontend/sidebar/issuable_assignees_spec.js
new file mode 100644
index 00000000000..aa930bd4198
--- /dev/null
+++ b/spec/frontend/sidebar/issuable_assignees_spec.js
@@ -0,0 +1,59 @@
+import { shallowMount } from '@vue/test-utils';
+import IssuableAssignees from '~/sidebar/components/assignees/issuable_assignees.vue';
+import UncollapsedAssigneeList from '~/sidebar/components/assignees/uncollapsed_assignee_list.vue';
+
+describe('IssuableAssignees', () => {
+ let wrapper;
+
+ const createComponent = (props = { users: [] }) => {
+ wrapper = shallowMount(IssuableAssignees, {
+ provide: {
+ rootPath: '',
+ },
+ propsData: { ...props },
+ });
+ };
+ const findLabel = () => wrapper.find('[data-testid="assigneeLabel"');
+ const findUncollapsedAssigneeList = () => wrapper.find(UncollapsedAssigneeList);
+ const findEmptyAssignee = () => wrapper.find('[data-testid="none"]');
+
+ afterEach(() => {
+ wrapper.destroy();
+ wrapper = null;
+ });
+
+ describe('when no assignees are present', () => {
+ beforeEach(() => {
+ createComponent();
+ });
+
+ it('renders "None"', () => {
+ expect(findEmptyAssignee().text()).toBe('None');
+ });
+
+ it('renders "0 assignees"', () => {
+ expect(findLabel().text()).toBe('0 Assignees');
+ });
+ });
+
+ describe('when assignees are present', () => {
+ it('renders UncollapsedAssigneesList', () => {
+ createComponent({ users: [{ id: 1 }] });
+
+ expect(findUncollapsedAssigneeList().exists()).toBe(true);
+ });
+
+ it.each`
+ assignees | expected
+ ${[{ id: 1 }]} | ${'Assignee'}
+ ${[{ id: 1 }, { id: 2 }]} | ${'2 Assignees'}
+ `(
+ 'when assignees have a length of $assignees.length, it renders $expected',
+ ({ assignees, expected }) => {
+ createComponent({ users: assignees });
+
+ expect(findLabel().text()).toBe(expected);
+ },
+ );
+ });
+});
diff --git a/spec/frontend/sidebar/participants_spec.js b/spec/frontend/sidebar/participants_spec.js
index ebe94582588..93c9b3b84c3 100644
--- a/spec/frontend/sidebar/participants_spec.js
+++ b/spec/frontend/sidebar/participants_spec.js
@@ -37,7 +37,7 @@ describe('Participants', () => {
loading: true,
});
- expect(wrapper.contains(GlLoadingIcon)).toBe(true);
+ expect(wrapper.find(GlLoadingIcon).exists()).toBe(true);
});
it('does not show loading spinner not loading', () => {
@@ -45,7 +45,7 @@ describe('Participants', () => {
loading: false,
});
- expect(wrapper.contains(GlLoadingIcon)).toBe(false);
+ expect(wrapper.find(GlLoadingIcon).exists()).toBe(false);
});
it('shows participant count when given', () => {
@@ -74,7 +74,7 @@ describe('Participants', () => {
loading: true,
});
- expect(wrapper.contains(GlLoadingIcon)).toBe(true);
+ expect(wrapper.find(GlLoadingIcon).exists()).toBe(true);
});
it('when only showing visible participants, shows an avatar only for each participant under the limit', () => {
@@ -196,11 +196,11 @@ describe('Participants', () => {
});
it('does not show sidebar collapsed icon', () => {
- expect(wrapper.contains('.sidebar-collapsed-icon')).toBe(false);
+ expect(wrapper.find('.sidebar-collapsed-icon').exists()).toBe(false);
});
it('does not show participants label title', () => {
- expect(wrapper.contains('.title')).toBe(false);
+ expect(wrapper.find('.title').exists()).toBe(false);
});
});
});
diff --git a/spec/frontend/sidebar/sidebar_labels_spec.js b/spec/frontend/sidebar/sidebar_labels_spec.js
new file mode 100644
index 00000000000..29333a344e1
--- /dev/null
+++ b/spec/frontend/sidebar/sidebar_labels_spec.js
@@ -0,0 +1,124 @@
+import { createLocalVue, shallowMount } from '@vue/test-utils';
+import AxiosMockAdapter from 'axios-mock-adapter';
+import Vuex from 'vuex';
+import {
+ mockLabels,
+ mockRegularLabel,
+} from 'jest/vue_shared/components/sidebar/labels_select_vue/mock_data';
+import axios from '~/lib/utils/axios_utils';
+import SidebarLabels from '~/sidebar/components/labels/sidebar_labels.vue';
+import { DropdownVariant } from '~/vue_shared/components/sidebar/labels_select_vue/constants';
+import LabelsSelect from '~/vue_shared/components/sidebar/labels_select_vue/labels_select_root.vue';
+import labelsSelectModule from '~/vue_shared/components/sidebar/labels_select_vue/store';
+
+const localVue = createLocalVue();
+localVue.use(Vuex);
+
+describe('sidebar labels', () => {
+ let axiosMock;
+ let wrapper;
+
+ const store = new Vuex.Store(labelsSelectModule());
+
+ const defaultProps = {
+ allowLabelCreate: true,
+ allowLabelEdit: true,
+ allowScopedLabels: true,
+ canEdit: true,
+ iid: '1',
+ initiallySelectedLabels: mockLabels,
+ issuableType: 'issue',
+ labelsFetchPath: '/gitlab-org/gitlab-test/-/labels.json?include_ancestor_groups=true',
+ labelsManagePath: '/gitlab-org/gitlab-test/-/labels',
+ labelsUpdatePath: '/gitlab-org/gitlab-test/-/issues/1.json',
+ projectIssuesPath: '/gitlab-org/gitlab-test/-/issues',
+ projectPath: 'gitlab-org/gitlab-test',
+ };
+
+ const findLabelsSelect = () => wrapper.find(LabelsSelect);
+
+ const mountComponent = () => {
+ wrapper = shallowMount(SidebarLabels, {
+ localVue,
+ provide: {
+ ...defaultProps,
+ },
+ store,
+ });
+ };
+
+ beforeEach(() => {
+ axiosMock = new AxiosMockAdapter(axios);
+ });
+
+ afterEach(() => {
+ wrapper.destroy();
+ wrapper = null;
+ axiosMock.restore();
+ });
+
+ describe('LabelsSelect props', () => {
+ beforeEach(() => {
+ mountComponent();
+ });
+
+ it('are as expected', () => {
+ expect(findLabelsSelect().props()).toMatchObject({
+ allowLabelCreate: defaultProps.allowLabelCreate,
+ allowLabelEdit: defaultProps.allowLabelEdit,
+ allowMultiselect: true,
+ allowScopedLabels: defaultProps.allowScopedLabels,
+ footerCreateLabelTitle: 'Create project label',
+ footerManageLabelTitle: 'Manage project labels',
+ labelsCreateTitle: 'Create project label',
+ labelsFetchPath: defaultProps.labelsFetchPath,
+ labelsFilterBasePath: defaultProps.projectIssuesPath,
+ labelsManagePath: defaultProps.labelsManagePath,
+ labelsSelectInProgress: false,
+ selectedLabels: defaultProps.initiallySelectedLabels,
+ variant: DropdownVariant.Sidebar,
+ });
+ });
+ });
+
+ describe('when labels are changed', () => {
+ beforeEach(() => {
+ mountComponent();
+ });
+
+ it('makes an API call to update labels', async () => {
+ const labels = [
+ {
+ ...mockRegularLabel,
+ set: false,
+ },
+ {
+ id: 40,
+ title: 'Security',
+ color: '#ddd',
+ text_color: '#fff',
+ set: true,
+ },
+ {
+ id: 55,
+ title: 'Tooling',
+ color: '#ddd',
+ text_color: '#fff',
+ set: false,
+ },
+ ];
+
+ findLabelsSelect().vm.$emit('updateSelectedLabels', labels);
+
+ await axios.waitForAll();
+
+ const expected = {
+ [defaultProps.issuableType]: {
+ label_ids: [27, 28, 40],
+ },
+ };
+
+ expect(axiosMock.history.put[0].data).toEqual(JSON.stringify(expected));
+ });
+ });
+});
diff --git a/spec/frontend/sidebar/sidebar_move_issue_spec.js b/spec/frontend/sidebar/sidebar_move_issue_spec.js
index db0d3e06272..ad919f69546 100644
--- a/spec/frontend/sidebar/sidebar_move_issue_spec.js
+++ b/spec/frontend/sidebar/sidebar_move_issue_spec.js
@@ -68,12 +68,10 @@ describe('SidebarMoveIssue', () => {
});
describe('initDropdown', () => {
- it('should initialize the gl_dropdown', () => {
- jest.spyOn($.fn, 'glDropdown').mockImplementation(() => {});
-
+ it('should initialize the deprecatedJQueryDropdown', () => {
test.sidebarMoveIssue.initDropdown();
- expect($.fn.glDropdown).toHaveBeenCalled();
+ expect(test.sidebarMoveIssue.$dropdownToggle.data('deprecatedJQueryDropdown')).toBeTruthy();
});
it('escapes html from project name', done => {
diff --git a/spec/frontend/sidebar/subscriptions_spec.js b/spec/frontend/sidebar/subscriptions_spec.js
index cce35666985..dddb9c2bba9 100644
--- a/spec/frontend/sidebar/subscriptions_spec.js
+++ b/spec/frontend/sidebar/subscriptions_spec.js
@@ -100,7 +100,7 @@ describe('Subscriptions', () => {
});
it('does not render the toggle button', () => {
- expect(wrapper.contains('.js-issuable-subscribe-button')).toBe(false);
+ expect(wrapper.find('.js-issuable-subscribe-button').exists()).toBe(false);
});
});
});
diff --git a/spec/frontend/sidebar/todo_spec.js b/spec/frontend/sidebar/todo_spec.js
index e56a78989eb..b0e94f16dd7 100644
--- a/spec/frontend/sidebar/todo_spec.js
+++ b/spec/frontend/sidebar/todo_spec.js
@@ -1,8 +1,7 @@
import { shallowMount } from '@vue/test-utils';
-import { GlLoadingIcon } from '@gitlab/ui';
+import { GlLoadingIcon, GlIcon } from '@gitlab/ui';
import SidebarTodos from '~/sidebar/components/todo_toggle/todo.vue';
-import Icon from '~/vue_shared/components/icon.vue';
const defaultProps = {
issuableId: 1,
@@ -45,11 +44,11 @@ describe('SidebarTodo', () => {
expect(
wrapper
- .find(Icon)
+ .find(GlIcon)
.classes()
.join(' '),
).toStrictEqual(iconClass);
- expect(wrapper.find(Icon).props('name')).toStrictEqual(icon);
+ expect(wrapper.find(GlIcon).props('name')).toStrictEqual(icon);
expect(wrapper.find('button').text()).toBe(label);
},
);
@@ -82,7 +81,7 @@ describe('SidebarTodo', () => {
it('renders button icon when `collapsed` prop is `true`', () => {
createComponent({ collapsed: true });
- expect(wrapper.find(Icon).props('name')).toBe('todo-done');
+ expect(wrapper.find(GlIcon).props('name')).toBe('todo-done');
});
it('renders loading icon when `isActionActive` prop is true', () => {
@@ -94,7 +93,7 @@ describe('SidebarTodo', () => {
it('hides button icon when `isActionActive` prop is true', () => {
createComponent({ collapsed: true, isActionActive: true });
- expect(wrapper.find(Icon).isVisible()).toBe(false);
+ expect(wrapper.find(GlIcon).isVisible()).toBe(false);
});
});
});