debian-mirror-gitlab/spec/frontend/issuable/components/issuable_by_email_spec.js
2021-03-11 19:13:27 +05:30

164 lines
4.6 KiB
JavaScript

import { GlModal, GlSprintf, GlFormInputGroup, GlButton } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
import { extendedWrapper } from 'helpers/vue_test_utils_helper';
import waitForPromises from 'helpers/wait_for_promises';
import IssuableByEmail from '~/issuable/components/issuable_by_email.vue';
import httpStatus from '~/lib/utils/http_status';
const initialEmail = 'user@gitlab.com';
const mockToastShow = jest.fn();
describe('IssuableByEmail', () => {
let wrapper;
let mockAxios;
let glModalDirective;
function createComponent(injectedProperties = {}) {
glModalDirective = jest.fn();
return extendedWrapper(
shallowMount(IssuableByEmail, {
stubs: {
GlModal,
GlSprintf,
GlFormInputGroup,
GlButton,
},
directives: {
glModal: {
bind(_, { value }) {
glModalDirective(value);
},
},
},
mocks: {
$toast: {
show: mockToastShow,
},
},
provide: {
issuableType: 'issue',
initialEmail,
...injectedProperties,
},
}),
);
}
beforeEach(() => {
mockAxios = new MockAdapter(axios);
});
afterEach(() => {
wrapper.destroy();
wrapper = null;
mockAxios.restore();
});
const findFormInputGroup = () => wrapper.find(GlFormInputGroup);
const clickResetEmail = async () => {
wrapper.findByTestId('incoming-email-token-reset').vm.$emit('click');
await waitForPromises();
};
describe('modal button', () => {
it.each`
issuableType | buttonText
${'issue'} | ${'Email a new issue to this project'}
${'merge_request'} | ${'Email a new merge request to this project'}
`(
'renders a link with "$buttonText" when type is "$issuableType"',
({ issuableType, buttonText }) => {
wrapper = createComponent({ issuableType });
expect(wrapper.findByTestId('issuable-email-modal-btn').text()).toBe(buttonText);
},
);
it('opens the modal when the user clicks the button', () => {
wrapper = createComponent();
wrapper.findByTestId('issuable-email-modal-btn').vm.$emit('click');
expect(glModalDirective).toHaveBeenCalled();
});
});
describe('modal', () => {
it('renders a read-only email input field', () => {
wrapper = createComponent();
expect(findFormInputGroup().props('value')).toBe('user@gitlab.com');
});
it.each`
issuableType | subject | body
${'issue'} | ${'Enter the issue title'} | ${'Enter the issue description'}
${'merge_request'} | ${'Enter the merge request title'} | ${'Enter the merge request description'}
`('renders a mailto button when type is "$issuableType"', ({ issuableType, subject, body }) => {
wrapper = createComponent({
issuableType,
initialEmail,
});
expect(wrapper.findByTestId('mail-to-btn').attributes('href')).toBe(
`mailto:${initialEmail}?subject=${subject}&body=${body}`,
);
});
describe('reset email', () => {
const resetPath = 'gitlab-test/new_issuable_address?issuable_type=issue';
beforeEach(() => {
jest.spyOn(axios, 'put');
});
it('should send request to reset email token', async () => {
wrapper = createComponent({
issuableType: 'issue',
initialEmail,
resetPath,
});
await clickResetEmail();
expect(axios.put).toHaveBeenCalledWith(resetPath);
});
it('should update the email when the request succeeds', async () => {
mockAxios.onPut(resetPath).reply(httpStatus.OK, { new_address: 'foo@bar.com' });
wrapper = createComponent({
issuableType: 'issue',
initialEmail,
resetPath,
});
await clickResetEmail();
expect(findFormInputGroup().props('value')).toBe('foo@bar.com');
});
it('should show a toast message when the request fails', async () => {
mockAxios.onPut(resetPath).reply(httpStatus.NOT_FOUND, {});
wrapper = createComponent({
issuableType: 'issue',
initialEmail,
resetPath,
});
await clickResetEmail();
expect(mockToastShow).toHaveBeenCalledWith(
'There was an error when reseting email token.',
{ type: 'error' },
);
expect(findFormInputGroup().props('value')).toBe('user@gitlab.com');
});
});
});
});