diff options
Diffstat (limited to 'spec/frontend/vue_shared/alert_details/alert_management_sidebar_todo_spec.js')
-rw-r--r-- | spec/frontend/vue_shared/alert_details/alert_management_sidebar_todo_spec.js | 112 |
1 files changed, 112 insertions, 0 deletions
diff --git a/spec/frontend/vue_shared/alert_details/alert_management_sidebar_todo_spec.js b/spec/frontend/vue_shared/alert_details/alert_management_sidebar_todo_spec.js new file mode 100644 index 00000000000..87ad5e36564 --- /dev/null +++ b/spec/frontend/vue_shared/alert_details/alert_management_sidebar_todo_spec.js @@ -0,0 +1,112 @@ +import { mount } from '@vue/test-utils'; +import todoMarkDoneMutation from '~/graphql_shared/mutations/todo_mark_done.mutation.graphql'; +import SidebarTodo from '~/vue_shared/alert_details/components/sidebar/sidebar_todo.vue'; +import createAlertTodoMutation from '~/vue_shared/alert_details/graphql/mutations/alert_todo_create.mutation.graphql'; +import mockAlerts from './mocks/alerts.json'; + +const mockAlert = mockAlerts[0]; + +describe('Alert Details Sidebar To Do', () => { + let wrapper; + + function mountComponent({ data, sidebarCollapsed = true, loading = false, stubs = {} } = {}) { + wrapper = mount(SidebarTodo, { + propsData: { + alert: { ...mockAlert }, + ...data, + sidebarCollapsed, + projectPath: 'projectPath', + }, + mocks: { + $apollo: { + mutate: jest.fn(), + queries: { + alert: { + loading, + }, + }, + }, + }, + stubs, + }); + } + + afterEach(() => { + wrapper.destroy(); + }); + + const findToDoButton = () => wrapper.find('[data-testid="alert-todo-button"]'); + + describe('updating the alert to do', () => { + const mockUpdatedMutationResult = { + data: { + updateAlertTodo: { + errors: [], + alert: {}, + }, + }, + }; + + describe('adding a todo', () => { + beforeEach(() => { + mountComponent({ + data: { alert: mockAlert }, + sidebarCollapsed: false, + loading: false, + }); + }); + + it('renders a button for adding a To-Do', async () => { + await wrapper.vm.$nextTick(); + + expect(findToDoButton().text()).toBe('Add a to do'); + }); + + it('calls `$apollo.mutate` with `createAlertTodoMutation` mutation and variables containing `iid`, `todoEvent`, & `projectPath`', async () => { + jest.spyOn(wrapper.vm.$apollo, 'mutate').mockResolvedValue(mockUpdatedMutationResult); + + findToDoButton().trigger('click'); + await wrapper.vm.$nextTick(); + + expect(wrapper.vm.$apollo.mutate).toHaveBeenCalledWith({ + mutation: createAlertTodoMutation, + variables: { + iid: '1527542', + projectPath: 'projectPath', + }, + }); + }); + }); + + describe('removing a todo', () => { + beforeEach(() => { + mountComponent({ + data: { alert: { ...mockAlert, todos: { nodes: [{ id: '1234' }] } } }, + sidebarCollapsed: false, + loading: false, + }); + }); + + it('renders a Mark As Done button when todo is present', async () => { + await wrapper.vm.$nextTick(); + + expect(findToDoButton().text()).toBe('Mark as done'); + }); + + it('calls `$apollo.mutate` with `todoMarkDoneMutation` mutation and variables containing `id`', async () => { + jest.spyOn(wrapper.vm.$apollo, 'mutate').mockResolvedValue(mockUpdatedMutationResult); + + findToDoButton().trigger('click'); + await wrapper.vm.$nextTick(); + + expect(wrapper.vm.$apollo.mutate).toHaveBeenCalledWith({ + mutation: todoMarkDoneMutation, + update: expect.anything(), + variables: { + id: '1234', + }, + }); + }); + }); + }); +}); |