Commit 45d9cbf2 authored by Florie Guibert's avatar Florie Guibert

Clean up weight board sidebar related code

Remove unused code - Follow up from weight sidebar widget migration
parent e378ebea
<script>
import { GlButton, GlForm, GlFormInput } from '@gitlab/ui';
import { mapGetters, mapActions } from 'vuex';
import BoardEditableItem from '~/boards/components/sidebar/board_editable_item.vue';
import { __ } from '~/locale';
import autofocusonshow from '~/vue_shared/directives/autofocusonshow';
export default {
components: {
BoardEditableItem,
GlForm,
GlButton,
GlFormInput,
},
directives: {
autofocusonshow,
},
data() {
return {
weight: null,
loading: false,
};
},
computed: {
...mapGetters(['activeBoardItem', 'projectPathForActiveIssue']),
hasWeight() {
return this.activeBoardItem.weight > 0;
},
},
watch: {
activeBoardItem: {
handler(updatedIssue) {
this.weight = updatedIssue.weight;
},
immediate: true,
},
},
methods: {
...mapActions(['setActiveItemWeight', 'setError']),
handleFormSubmit() {
this.$refs.sidebarItem.collapse({ emitEvent: false });
this.setWeight();
},
async setWeight(provided) {
const weight = provided ?? this.weight;
if (this.loading || weight === this.activeBoardItem.weight) {
return;
}
this.loading = true;
try {
await this.setActiveItemWeight({ weight, projectPath: this.projectPathForActiveIssue });
this.weight = weight;
} catch (e) {
this.weight = this.activeBoardItem.weight;
this.setError({ message: __('An error occurred when updating the issue weight') });
} finally {
this.loading = false;
}
},
},
};
</script>
<template>
<board-editable-item
ref="sidebarItem"
:title="__('Weight')"
:loading="loading"
data-testid="sidebar-weight"
@close="setWeight()"
>
<template v-if="hasWeight" #collapsed>
<div class="gl-display-flex gl-align-items-center">
<strong
class="gl-text-gray-900 js-weight-weight-label-value"
data-qa-selector="weight_label_value"
>{{ activeBoardItem.weight }}</strong
>
<span class="gl-mx-2">-</span>
<gl-button
variant="link"
class="gl-text-gray-500!"
data-testid="reset-button"
:disabled="loading"
@click="setWeight(0)"
>
{{ __('remove weight') }}
</gl-button>
</div>
</template>
<gl-form @submit.prevent="handleFormSubmit()">
<gl-form-input
v-model.number="weight"
v-autofocusonshow
type="number"
min="0"
:placeholder="__('Enter a number')"
/>
</gl-form>
</board-editable-item>
</template>
mutation issueSetWeight($input: IssueSetWeightInput!) {
issueSetWeight(input: $input) {
issue {
weight
}
errors
}
}
import { GlFormInput, GlForm } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import BoardSidebarWeightInput from 'ee/boards/components/sidebar/board_sidebar_weight_input.vue';
import BoardEditableItem from '~/boards/components/sidebar/board_editable_item.vue';
import { createStore } from '~/boards/stores';
const TEST_WEIGHT = 1;
const TEST_ISSUE = { id: 'gid://gitlab/Issue/1', iid: 9, weight: 0, referencePath: 'h/b#2' };
describe('ee/boards/components/sidebar/board_sidebar_weight_input.vue', () => {
let wrapper;
let store;
afterEach(() => {
wrapper.destroy();
store = null;
wrapper = null;
});
const createWrapper = ({ weight = 0 } = {}) => {
store = createStore();
store.state.boardItems = { [TEST_ISSUE.id]: { ...TEST_ISSUE, weight } };
store.state.activeId = TEST_ISSUE.id;
wrapper = shallowMount(BoardSidebarWeightInput, {
store,
provide: {
canUpdate: true,
},
stubs: {
'board-editable-item': BoardEditableItem,
},
});
};
const findWeightForm = () => wrapper.find(GlForm);
const findWeightInput = () => wrapper.find(GlFormInput);
const findResetButton = () => wrapper.find('[data-testid="reset-button"]');
const findCollapsed = () => wrapper.find('[data-testid="collapsed-content"]');
it('renders "None" when no weight is selected', () => {
createWrapper();
expect(findCollapsed().text()).toBe('None');
});
it('renders weight with reset button when weight is set', () => {
createWrapper({ weight: TEST_WEIGHT });
expect(findCollapsed().text()).toContain(TEST_WEIGHT);
expect(findResetButton().exists()).toBe(true);
});
describe('when weight is submitted', () => {
beforeEach(async () => {
createWrapper();
jest.spyOn(wrapper.vm, 'setActiveItemWeight');
findWeightInput().vm.$emit('input', TEST_WEIGHT);
findWeightForm().vm.$emit('submit', { preventDefault: () => {} });
store.state.boardItems[TEST_ISSUE.id].weight = TEST_WEIGHT;
await wrapper.vm.$nextTick();
});
it('collapses sidebar and renders weight with reset button', () => {
expect(findCollapsed().isVisible()).toBe(true);
expect(findCollapsed().text()).toContain(TEST_WEIGHT);
expect(findResetButton().exists()).toBe(true);
});
it('commits change to the server', () => {
expect(wrapper.vm.setActiveItemWeight).toHaveBeenCalledWith({
weight: TEST_WEIGHT,
projectPath: 'h/b',
});
});
});
describe('when weight is set to 0', () => {
beforeEach(async () => {
createWrapper({ weight: TEST_WEIGHT });
jest.spyOn(wrapper.vm, 'setActiveItemWeight');
findWeightInput().vm.$emit('input', 0);
findWeightForm().vm.$emit('submit', { preventDefault: () => {} });
store.state.boardItems[TEST_ISSUE.id].weight = 0;
await wrapper.vm.$nextTick();
});
it('collapses sidebar and renders "None"', () => {
expect(wrapper.vm.setActiveItemWeight).toHaveBeenCalled();
expect(findCollapsed().isVisible()).toBe(true);
expect(findCollapsed().text()).toBe('None');
});
});
describe('when weight is resetted', () => {
beforeEach(async () => {
createWrapper({ weight: TEST_WEIGHT });
jest.spyOn(wrapper.vm, 'setActiveItemWeight');
findResetButton().vm.$emit('click');
store.state.boardItems[TEST_ISSUE.id].weight = 0;
await wrapper.vm.$nextTick();
});
it('collapses sidebar and renders "None"', () => {
expect(wrapper.vm.setActiveItemWeight).toHaveBeenCalled();
expect(findCollapsed().isVisible()).toBe(true);
expect(findCollapsed().text()).toBe('None');
});
});
describe('when the mutation fails', () => {
beforeEach(async () => {
createWrapper({ weight: TEST_WEIGHT });
jest.spyOn(wrapper.vm, 'setActiveItemWeight').mockImplementation(() => {
throw new Error(['failed mutation']);
});
jest.spyOn(wrapper.vm, 'setError').mockImplementation(() => {});
findWeightInput().vm.$emit('input', -1);
findWeightForm().vm.$emit('submit', { preventDefault: () => {} });
await wrapper.vm.$nextTick();
});
it('collapses sidebar and renders former issue weight', () => {
expect(findCollapsed().isVisible()).toBe(true);
expect(findCollapsed().text()).toContain(TEST_WEIGHT);
expect(wrapper.vm.setError).toHaveBeenCalled();
});
});
});
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment