diff --git a/app/assets/javascripts/work_items/components/work_item_bulk_edit/work_item_bulk_edit_sidebar.vue b/app/assets/javascripts/work_items/components/work_item_bulk_edit/work_item_bulk_edit_sidebar.vue
index 61e7af8c5faa0c3332a0dd491db8e19e7e3c2845..94fbabb621b7b713ea27ebddc4738b214434eaec 100644
--- a/app/assets/javascripts/work_items/components/work_item_bulk_edit/work_item_bulk_edit_sidebar.vue
+++ b/app/assets/javascripts/work_items/components/work_item_bulk_edit/work_item_bulk_edit_sidebar.vue
@@ -276,7 +276,6 @@ export default {
data-testid="bulk-edit-state"
/>
{
});
});
+ describe('widget visibility', () => {
+ it('shows the correct widgets when GraphQL is disabled', () => {
+ createComponent({ provide: { hasIssuableHealthStatusFeature: true } });
+
+ // visible
+ expect(findStateComponent().exists()).toBe(true);
+ expect(findAssigneeComponent().exists()).toBe(true);
+ expect(findAddLabelsComponent().exists()).toBe(true);
+ expect(findRemoveLabelsComponent().exists()).toBe(true);
+ expect(findHealthStatusComponent().exists()).toBe(true);
+ expect(findSubscriptionComponent().exists()).toBe(true);
+ expect(findConfidentialityComponent().exists()).toBe(true);
+
+ // hidden
+ expect(findMilestoneComponent().exists()).toBe(false);
+ expect(findParentComponent().exists()).toBe(false);
+ expect(findBulkMoveComponent().exists()).toBe(false);
+ });
+
+ it('shows the correct widgets when GraphQL is enabled', () => {
+ createComponent({
+ provide: { hasIssuableHealthStatusFeature: true, glFeatures: { workItemsBulkEdit: true } },
+ });
+
+ // visible
+ expect(findStateComponent().exists()).toBe(true);
+ expect(findAssigneeComponent().exists()).toBe(true);
+ expect(findAddLabelsComponent().exists()).toBe(true);
+ expect(findRemoveLabelsComponent().exists()).toBe(true);
+ expect(findHealthStatusComponent().exists()).toBe(true);
+ expect(findSubscriptionComponent().exists()).toBe(true);
+ expect(findConfidentialityComponent().exists()).toBe(true);
+ expect(findMilestoneComponent().exists()).toBe(true);
+ expect(findParentComponent().exists()).toBe(true);
+ expect(findBulkMoveComponent().exists()).toBe(true);
+ });
+
+ it('shows the correct widgets when GraphQL is enabled and on epics list', () => {
+ createComponent({
+ props: { isEpicsList: true },
+ provide: { hasIssuableHealthStatusFeature: true, glFeatures: { workItemsBulkEdit: true } },
+ });
+
+ // visible
+ expect(findAssigneeComponent().exists()).toBe(true);
+ expect(findAddLabelsComponent().exists()).toBe(true);
+ expect(findRemoveLabelsComponent().exists()).toBe(true);
+ expect(findHealthStatusComponent().exists()).toBe(true);
+ expect(findSubscriptionComponent().exists()).toBe(true);
+ expect(findConfidentialityComponent().exists()).toBe(true);
+ expect(findMilestoneComponent().exists()).toBe(true);
+
+ // hidden
+ expect(findStateComponent().exists()).toBe(false);
+ expect(findParentComponent().exists()).toBe(false);
+ expect(findBulkMoveComponent().exists()).toBe(false);
+ });
+ });
+
describe('getAvailableBulkEditWidgets query', () => {
beforeEach(() => {
createComponent({ provide: { glFeatures: { workItemsBulkEdit: true } } });
@@ -366,12 +425,6 @@ describe('WorkItemBulkEditSidebar component', () => {
});
describe('"Assignee" component', () => {
- it.each([true, false])('renders depending on isEpicsList prop', (isEpicsList) => {
- createComponent({ props: { isEpicsList } });
-
- expect(findAssigneeComponent().exists()).toBe(!isEpicsList);
- });
-
it('updates assignee when "Assignee" component emits "input" event', async () => {
createComponent();
@@ -526,18 +579,19 @@ describe('WorkItemBulkEditSidebar component', () => {
});
describe('"Health status" component', () => {
- it.each`
- isEpicsList | hasIssuableHealthStatusFeature | expected
- ${false} | ${false} | ${false}
- ${false} | ${true} | ${true}
- ${true} | ${false} | ${false}
- ${true} | ${true} | ${false}
- `(
- 'renders only when isEpicsList=false and hasIssuableHealthStatusFeature=true',
- ({ isEpicsList, hasIssuableHealthStatusFeature, expected }) => {
- createComponent({ provide: { hasIssuableHealthStatusFeature }, props: { isEpicsList } });
-
- expect(findHealthStatusComponent().exists()).toBe(expected);
+ it.each([true, false])(
+ 'renders depending on hasIssuableHealthStatusFeature feature',
+ (hasIssuableHealthStatusFeature) => {
+ createComponent({
+ provide: {
+ glFeatures: {
+ workItemsBulkEdit: true,
+ },
+ hasIssuableHealthStatusFeature,
+ },
+ });
+
+ expect(findHealthStatusComponent().exists()).toBe(hasIssuableHealthStatusFeature);
},
);
@@ -589,12 +643,6 @@ describe('WorkItemBulkEditSidebar component', () => {
});
describe('"Subscription" component', () => {
- it.each([true, false])('renders depending on isEpicsList prop', (isEpicsList) => {
- createComponent({ props: { isEpicsList } });
-
- expect(findSubscriptionComponent().exists()).toBe(!isEpicsList);
- });
-
it('updates subscription when "Subscription" component emits "input" event', async () => {
createComponent();
@@ -606,12 +654,6 @@ describe('WorkItemBulkEditSidebar component', () => {
});
describe('"Confidentiality" component', () => {
- it.each([true, false])('renders depending on isEpicsList prop', (isEpicsList) => {
- createComponent({ props: { isEpicsList } });
-
- expect(findConfidentialityComponent().exists()).toBe(!isEpicsList);
- });
-
it('updates confidentiality when "Confidentiality" component emits "input" event', async () => {
createComponent();
@@ -623,19 +665,6 @@ describe('WorkItemBulkEditSidebar component', () => {
});
describe('"Milestone" component', () => {
- it.each([true, false])('renders depending on isEpicsList prop', (isEpicsList) => {
- createComponent({
- provide: {
- glFeatures: {
- workItemsBulkEdit: true,
- },
- },
- props: { isEpicsList },
- });
-
- expect(findMilestoneComponent().exists()).toBe(!isEpicsList);
- });
-
it('updates milestone when "Milestone" component emits "input" event', async () => {
createComponent({
provide: {