Commit f1c18ebd authored by Jose Ivan Vargas's avatar Jose Ivan Vargas

Merge branch 'justin_ho-clean-up-integration-form-specs' into 'master'

Clean up integration form specs

See merge request gitlab-org/gitlab!62984
parents 9641dac4 58cc7568
import { GlFormCheckbox } from '@gitlab/ui'; import { GlFormCheckbox } from '@gitlab/ui';
import { mount } from '@vue/test-utils'; import { mount } from '@vue/test-utils';
import ActiveCheckbox from '~/integrations/edit/components/active_checkbox.vue'; import ActiveCheckbox from '~/integrations/edit/components/active_checkbox.vue';
import { createStore } from '~/integrations/edit/store'; import { createStore } from '~/integrations/edit/store';
......
import { GlModal } from '@gitlab/ui'; import { GlModal } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils'; import { shallowMount } from '@vue/test-utils';
import ConfirmationModal from '~/integrations/edit/components/confirmation_modal.vue'; import ConfirmationModal from '~/integrations/edit/components/confirmation_modal.vue';
import { createStore } from '~/integrations/edit/store'; import { createStore } from '~/integrations/edit/store';
...@@ -13,13 +14,10 @@ describe('ConfirmationModal', () => { ...@@ -13,13 +14,10 @@ describe('ConfirmationModal', () => {
}; };
afterEach(() => { afterEach(() => {
if (wrapper) {
wrapper.destroy(); wrapper.destroy();
wrapper = null;
}
}); });
const findGlModal = () => wrapper.find(GlModal); const findGlModal = () => wrapper.findComponent(GlModal);
describe('template', () => { describe('template', () => {
beforeEach(() => { beforeEach(() => {
......
import { GlFormGroup, GlFormCheckbox, GlFormInput, GlFormSelect, GlFormTextarea } from '@gitlab/ui'; import { GlFormGroup, GlFormCheckbox, GlFormInput, GlFormSelect, GlFormTextarea } from '@gitlab/ui';
import { mount } from '@vue/test-utils'; import { mount } from '@vue/test-utils';
import DynamicField from '~/integrations/edit/components/dynamic_field.vue'; import DynamicField from '~/integrations/edit/components/dynamic_field.vue';
describe('DynamicField', () => { describe('DynamicField', () => {
...@@ -24,17 +25,14 @@ describe('DynamicField', () => { ...@@ -24,17 +25,14 @@ describe('DynamicField', () => {
}; };
afterEach(() => { afterEach(() => {
if (wrapper) {
wrapper.destroy(); wrapper.destroy();
wrapper = null;
}
}); });
const findGlFormGroup = () => wrapper.find(GlFormGroup); const findGlFormGroup = () => wrapper.findComponent(GlFormGroup);
const findGlFormCheckbox = () => wrapper.find(GlFormCheckbox); const findGlFormCheckbox = () => wrapper.findComponent(GlFormCheckbox);
const findGlFormInput = () => wrapper.find(GlFormInput); const findGlFormInput = () => wrapper.findComponent(GlFormInput);
const findGlFormSelect = () => wrapper.find(GlFormSelect); const findGlFormSelect = () => wrapper.findComponent(GlFormSelect);
const findGlFormTextarea = () => wrapper.find(GlFormTextarea); const findGlFormTextarea = () => wrapper.findComponent(GlFormTextarea);
describe('template', () => { describe('template', () => {
describe.each([ describe.each([
......
import { shallowMount } from '@vue/test-utils';
import { setHTMLFixture } from 'helpers/fixtures'; import { setHTMLFixture } from 'helpers/fixtures';
import { extendedWrapper } from 'helpers/vue_test_utils_helper'; import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
import { mockIntegrationProps } from 'jest/integrations/edit/mock_data'; import { mockIntegrationProps } from 'jest/integrations/edit/mock_data';
import ActiveCheckbox from '~/integrations/edit/components/active_checkbox.vue'; import ActiveCheckbox from '~/integrations/edit/components/active_checkbox.vue';
import ConfirmationModal from '~/integrations/edit/components/confirmation_modal.vue'; import ConfirmationModal from '~/integrations/edit/components/confirmation_modal.vue';
...@@ -23,8 +23,7 @@ describe('IntegrationForm', () => { ...@@ -23,8 +23,7 @@ describe('IntegrationForm', () => {
initialState = {}, initialState = {},
props = {}, props = {},
} = {}) => { } = {}) => {
wrapper = extendedWrapper( wrapper = shallowMountExtended(IntegrationForm, {
shallowMount(IntegrationForm, {
propsData: { ...props }, propsData: { ...props },
store: createStore({ store: createStore({
customState: { ...mockIntegrationProps, ...customStateProps }, customState: { ...mockIntegrationProps, ...customStateProps },
...@@ -40,25 +39,21 @@ describe('IntegrationForm', () => { ...@@ -40,25 +39,21 @@ describe('IntegrationForm', () => {
provide: { provide: {
glFeatures: featureFlags, glFeatures: featureFlags,
}, },
}), });
);
}; };
afterEach(() => { afterEach(() => {
if (wrapper) {
wrapper.destroy(); wrapper.destroy();
wrapper = null;
}
}); });
const findOverrideDropdown = () => wrapper.find(OverrideDropdown); const findOverrideDropdown = () => wrapper.findComponent(OverrideDropdown);
const findActiveCheckbox = () => wrapper.find(ActiveCheckbox); const findActiveCheckbox = () => wrapper.findComponent(ActiveCheckbox);
const findConfirmationModal = () => wrapper.find(ConfirmationModal); const findConfirmationModal = () => wrapper.findComponent(ConfirmationModal);
const findResetConfirmationModal = () => wrapper.find(ResetConfirmationModal); const findResetConfirmationModal = () => wrapper.findComponent(ResetConfirmationModal);
const findResetButton = () => wrapper.find('[data-testid="reset-button"]'); const findResetButton = () => wrapper.findByTestId('reset-button');
const findJiraTriggerFields = () => wrapper.find(JiraTriggerFields); const findJiraTriggerFields = () => wrapper.findComponent(JiraTriggerFields);
const findJiraIssuesFields = () => wrapper.find(JiraIssuesFields); const findJiraIssuesFields = () => wrapper.findComponent(JiraIssuesFields);
const findTriggerFields = () => wrapper.find(TriggerFields); const findTriggerFields = () => wrapper.findComponent(TriggerFields);
describe('template', () => { describe('template', () => {
describe('showActive is true', () => { describe('showActive is true', () => {
...@@ -286,7 +281,7 @@ describe('IntegrationForm', () => { ...@@ -286,7 +281,7 @@ describe('IntegrationForm', () => {
</div> </div>
`); `);
it('renders `helpHtml`', async () => { it('renders `helpHtml`', () => {
const mockHelpHtml = document.querySelector(`[data-testid="${mockTestId}"]`); const mockHelpHtml = document.querySelector(`[data-testid="${mockTestId}"]`);
createComponent({ createComponent({
......
import { GlFormCheckbox, GlFormInput } from '@gitlab/ui'; import { GlFormCheckbox, GlFormInput } from '@gitlab/ui';
import { mount } from '@vue/test-utils'; import { mountExtended } from 'helpers/vue_test_utils_helper';
import JiraIssuesFields from '~/integrations/edit/components/jira_issues_fields.vue'; import JiraIssuesFields from '~/integrations/edit/components/jira_issues_fields.vue';
import JiraUpgradeCta from '~/integrations/edit/components/jira_upgrade_cta.vue'; import JiraUpgradeCta from '~/integrations/edit/components/jira_upgrade_cta.vue';
import eventHub from '~/integrations/edit/event_hub'; import eventHub from '~/integrations/edit/event_hub';
...@@ -20,7 +21,7 @@ describe('JiraIssuesFields', () => { ...@@ -20,7 +21,7 @@ describe('JiraIssuesFields', () => {
defaultState: isInheriting ? {} : undefined, defaultState: isInheriting ? {} : undefined,
}); });
wrapper = mount(JiraIssuesFields, { wrapper = mountExtended(JiraIssuesFields, {
propsData: { ...defaultProps, ...props }, propsData: { ...defaultProps, ...props },
store, store,
stubs: ['jira-issue-creation-vulnerabilities'], stubs: ['jira-issue-creation-vulnerabilities'],
...@@ -37,7 +38,7 @@ describe('JiraIssuesFields', () => { ...@@ -37,7 +38,7 @@ describe('JiraIssuesFields', () => {
findEnableCheckbox().find('[type=checkbox]').attributes('disabled'); findEnableCheckbox().find('[type=checkbox]').attributes('disabled');
const findProjectKey = () => wrapper.findComponent(GlFormInput); const findProjectKey = () => wrapper.findComponent(GlFormInput);
const findJiraUpgradeCta = () => wrapper.findComponent(JiraUpgradeCta); const findJiraUpgradeCta = () => wrapper.findComponent(JiraUpgradeCta);
const findJiraForVulnerabilities = () => wrapper.find('[data-testid="jira-for-vulnerabilities"]'); const findJiraForVulnerabilities = () => wrapper.findByTestId('jira-for-vulnerabilities');
const setEnableCheckbox = async (isEnabled = true) => const setEnableCheckbox = async (isEnabled = true) =>
findEnableCheckbox().vm.$emit('input', isEnabled); findEnableCheckbox().vm.$emit('input', isEnabled);
......
import { GlFormCheckbox } from '@gitlab/ui'; import { GlFormCheckbox } from '@gitlab/ui';
import { mount } from '@vue/test-utils'; import { mountExtended } from 'helpers/vue_test_utils_helper';
import JiraTriggerFields from '~/integrations/edit/components/jira_trigger_fields.vue'; import JiraTriggerFields from '~/integrations/edit/components/jira_trigger_fields.vue';
describe('JiraTriggerFields', () => { describe('JiraTriggerFields', () => {
...@@ -12,7 +13,7 @@ describe('JiraTriggerFields', () => { ...@@ -12,7 +13,7 @@ describe('JiraTriggerFields', () => {
}; };
const createComponent = (props, isInheriting = false) => { const createComponent = (props, isInheriting = false) => {
wrapper = mount(JiraTriggerFields, { wrapper = mountExtended(JiraTriggerFields, {
propsData: { ...defaultProps, ...props }, propsData: { ...defaultProps, ...props },
computed: { computed: {
isInheriting: () => isInheriting, isInheriting: () => isInheriting,
...@@ -21,18 +22,15 @@ describe('JiraTriggerFields', () => { ...@@ -21,18 +22,15 @@ describe('JiraTriggerFields', () => {
}; };
afterEach(() => { afterEach(() => {
if (wrapper) {
wrapper.destroy(); wrapper.destroy();
wrapper = null;
}
}); });
const findCommentSettings = () => wrapper.find('[data-testid="comment-settings"]'); const findCommentSettings = () => wrapper.findByTestId('comment-settings');
const findCommentDetail = () => wrapper.find('[data-testid="comment-detail"]'); const findCommentDetail = () => wrapper.findByTestId('comment-detail');
const findCommentSettingsCheckbox = () => findCommentSettings().find(GlFormCheckbox); const findCommentSettingsCheckbox = () => findCommentSettings().findComponent(GlFormCheckbox);
const findIssueTransitionEnabled = () => const findIssueTransitionEnabled = () =>
wrapper.find('[data-testid="issue-transition-enabled"] input[type="checkbox"]'); wrapper.find('[data-testid="issue-transition-enabled"] input[type="checkbox"]');
const findIssueTransitionMode = () => wrapper.find('[data-testid="issue-transition-mode"]'); const findIssueTransitionMode = () => wrapper.findByTestId('issue-transition-mode');
const findIssueTransitionModeRadios = () => const findIssueTransitionModeRadios = () =>
findIssueTransitionMode().findAll('input[type="radio"]'); findIssueTransitionMode().findAll('input[type="radio"]');
const findIssueTransitionIdsField = () => const findIssueTransitionIdsField = () =>
......
import { shallowMount } from '@vue/test-utils'; import { shallowMount } from '@vue/test-utils';
import JiraUpgradeCta from '~/integrations/edit/components/jira_upgrade_cta.vue'; import JiraUpgradeCta from '~/integrations/edit/components/jira_upgrade_cta.vue';
describe('JiraUpgradeCta', () => { describe('JiraUpgradeCta', () => {
...@@ -18,13 +19,13 @@ describe('JiraUpgradeCta', () => { ...@@ -18,13 +19,13 @@ describe('JiraUpgradeCta', () => {
it('displays the correct message for premium and lower users', () => { it('displays the correct message for premium and lower users', () => {
createComponent({ showPremiumMessage: true }); createComponent({ showPremiumMessage: true });
expect(wrapper.html()).toContain('This is a Premium feature'); expect(wrapper.text()).toContain('This is a Premium feature');
expect(wrapper.html()).toContain(contentMessage); expect(wrapper.text()).toContain(contentMessage);
}); });
it('displays the correct message for ultimate and lower users', () => { it('displays the correct message for ultimate and lower users', () => {
createComponent({ showUltimateMessage: true }); createComponent({ showUltimateMessage: true });
expect(wrapper.html()).toContain('This is an Ultimate feature'); expect(wrapper.text()).toContain('This is an Ultimate feature');
expect(wrapper.html()).toContain(contentMessage); expect(wrapper.text()).toContain(contentMessage);
}); });
}); });
import { GlDropdown, GlLink } from '@gitlab/ui'; import { GlDropdown, GlLink } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils'; import { shallowMount } from '@vue/test-utils';
import OverrideDropdown from '~/integrations/edit/components/override_dropdown.vue'; import OverrideDropdown from '~/integrations/edit/components/override_dropdown.vue';
import { integrationLevels, overrideDropdownDescriptions } from '~/integrations/edit/constants'; import { integrationLevels, overrideDropdownDescriptions } from '~/integrations/edit/constants';
import { createStore } from '~/integrations/edit/store'; import { createStore } from '~/integrations/edit/store';
...@@ -26,14 +27,11 @@ describe('OverrideDropdown', () => { ...@@ -26,14 +27,11 @@ describe('OverrideDropdown', () => {
}; };
afterEach(() => { afterEach(() => {
if (wrapper) {
wrapper.destroy(); wrapper.destroy();
wrapper = null;
}
}); });
const findGlLink = () => wrapper.find(GlLink); const findGlLink = () => wrapper.findComponent(GlLink);
const findGlDropdown = () => wrapper.find(GlDropdown); const findGlDropdown = () => wrapper.findComponent(GlDropdown);
describe('template', () => { describe('template', () => {
describe('override prop is true', () => { describe('override prop is true', () => {
......
import { GlFormGroup, GlFormCheckbox, GlFormInput } from '@gitlab/ui'; import { GlFormGroup, GlFormCheckbox, GlFormInput } from '@gitlab/ui';
import { mount } from '@vue/test-utils'; import { mountExtended } from 'helpers/vue_test_utils_helper';
import TriggerFields from '~/integrations/edit/components/trigger_fields.vue'; import TriggerFields from '~/integrations/edit/components/trigger_fields.vue';
describe('TriggerFields', () => { describe('TriggerFields', () => {
...@@ -10,7 +11,7 @@ describe('TriggerFields', () => { ...@@ -10,7 +11,7 @@ describe('TriggerFields', () => {
}; };
const createComponent = (props, isInheriting = false) => { const createComponent = (props, isInheriting = false) => {
wrapper = mount(TriggerFields, { wrapper = mountExtended(TriggerFields, {
propsData: { ...defaultProps, ...props }, propsData: { ...defaultProps, ...props },
computed: { computed: {
isInheriting: () => isInheriting, isInheriting: () => isInheriting,
...@@ -19,21 +20,19 @@ describe('TriggerFields', () => { ...@@ -19,21 +20,19 @@ describe('TriggerFields', () => {
}; };
afterEach(() => { afterEach(() => {
if (wrapper) {
wrapper.destroy(); wrapper.destroy();
wrapper = null;
}
}); });
const findTriggerLabel = () => wrapper.findByTestId('trigger-fields-group').find('label');
const findAllGlFormGroups = () => wrapper.find('#trigger-fields').findAll(GlFormGroup); const findAllGlFormGroups = () => wrapper.find('#trigger-fields').findAll(GlFormGroup);
const findAllGlFormCheckboxes = () => wrapper.findAll(GlFormCheckbox); const findAllGlFormCheckboxes = () => wrapper.findAllComponents(GlFormCheckbox);
const findAllGlFormInputs = () => wrapper.findAll(GlFormInput); const findAllGlFormInputs = () => wrapper.findAllComponents(GlFormInput);
describe.each([true, false])('template, isInheriting = `%p`', (isInheriting) => { describe.each([true, false])('template, isInheriting = `%p`', (isInheriting) => {
it('renders a label with text "Trigger"', () => { it('renders a label with text "Trigger"', () => {
createComponent(); createComponent();
const triggerLabel = wrapper.find('[data-testid="trigger-fields-group"]').find('label'); const triggerLabel = findTriggerLabel();
expect(triggerLabel.exists()).toBe(true); expect(triggerLabel.exists()).toBe(true);
expect(triggerLabel.text()).toBe('Trigger'); expect(triggerLabel.text()).toBe('Trigger');
}); });
...@@ -68,7 +67,7 @@ describe('TriggerFields', () => { ...@@ -68,7 +67,7 @@ describe('TriggerFields', () => {
}); });
it('renders GlFormInput with description for each event', () => { it('renders GlFormInput with description for each event', () => {
const groups = wrapper.find('#trigger-fields').findAll(GlFormGroup); const groups = findAllGlFormGroups();
expect(groups).toHaveLength(2); expect(groups).toHaveLength(2);
groups.wrappers.forEach((group, index) => { groups.wrappers.forEach((group, index) => {
......
import { shallowMount } from '@vue/test-utils'; import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
import { extendedWrapper } from 'helpers/vue_test_utils_helper';
import IntegrationsList from '~/integrations/index/components/integrations_list.vue'; import IntegrationsList from '~/integrations/index/components/integrations_list.vue';
import { mockActiveIntegrations, mockInactiveIntegrations } from '../mock_data'; import { mockActiveIntegrations, mockInactiveIntegrations } from '../mock_data';
...@@ -10,7 +10,7 @@ describe('IntegrationsList', () => { ...@@ -10,7 +10,7 @@ describe('IntegrationsList', () => {
const findInactiveIntegrationsTable = () => wrapper.findByTestId('inactive-integrations-table'); const findInactiveIntegrationsTable = () => wrapper.findByTestId('inactive-integrations-table');
const createComponent = (propsData = {}) => { const createComponent = (propsData = {}) => {
wrapper = extendedWrapper(shallowMount(IntegrationsList, { propsData })); wrapper = shallowMountExtended(IntegrationsList, { propsData });
}; };
afterEach(() => { afterEach(() => {
......
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