Commit de4aac71 authored by Vitaly Slobodin's avatar Vitaly Slobodin

Merge branch 'xanf-upgrade-vtu-to-v1' into 'master'

Upgrade @vue/test-utils to v1.1.2

See merge request gitlab-org/gitlab!50598
parents 47c39953 7af4dc13
......@@ -4,9 +4,9 @@ exports[`MergeRequestTable component template matches the snapshot 1`] = `
<table
aria-busy="false"
aria-colcount="7"
aria-describedby="__BVID__59__caption_"
aria-describedby="__BVID__36__caption_"
class="table b-table gl-table my-3 b-table-stacked-sm"
id="__BVID__59"
id="__BVID__36"
role="table"
>
<!---->
......
......@@ -63,7 +63,7 @@ describe('Approvals ApproversSelect', () => {
...options,
propsData,
localVue,
attachToDocument: true,
attachTo: document.body,
});
await waitForPromises();
......
......@@ -34,7 +34,7 @@ describe('Branches Select', () => {
},
localVue,
store: new Vuex.Store(store),
attachToDocument: true,
attachTo: document.body,
});
await waitForPromises();
......
......@@ -27,7 +27,7 @@ describe('EE Approvals MRRules', () => {
wrapper = mount(localVue.extend(MRRules), {
localVue,
store: new Vuex.Store(store),
attachToDocument: true,
attachTo: document.body,
});
};
......
......@@ -53,7 +53,7 @@ describe('User invites', () => {
beforeEach(() => {
wrapper = mount(Component, {
propsData: { emails: [], docsPath: 'https://some.doc.path' },
attachToDocument: true,
attachTo: document.body,
});
clickButton();
......
......@@ -77,7 +77,7 @@ describe('RelatedIssuableInput', () => {
references: ['foo', 'bar'],
},
// We need to attach to document, so that `document.activeElement` is properly set in jsdom
attachToDocument: true,
attachTo: document.body,
});
wrapper.find('li').trigger('click');
......
......@@ -6,10 +6,10 @@ exports[`NetworkPolicyList component renders policies table 1`] = `
<table
aria-busy="false"
aria-colcount="3"
aria-describedby="__BVID__432__caption_"
aria-describedby="__BVID__333__caption_"
aria-multiselectable="false"
class="table b-table gl-table table-hover b-table-stacked-md b-table-selectable b-table-select-single"
id="__BVID__432"
id="__BVID__333"
role="table"
>
<!---->
......
......@@ -24,7 +24,7 @@ describe('MrWidgetPipelineContainer', () => {
provide: {
...provide,
},
attachToDocument: true,
attachTo: document.body,
});
};
......
......@@ -2,7 +2,7 @@ export * from '@gitlab/ui';
/**
* The @gitlab/ui tooltip directive requires awkward and distracting set up in tests
* for components that use it (e.g., `attachToDocument: true` and `sync: true` passed
* for components that use it (e.g., `attachTo: document.body` and `sync: true` passed
* to the `mount` helper from `vue-test-utils`).
*
* This mock decouples those tests from the implementation, removing the need to set
......
......@@ -16,82 +16,84 @@ exports[`AlertsSettingsFormNew with default values renders the initial template
<!---->
</div>
</div>
<div class=\\"gl-mt-3 collapse\\" style=\\"display: none;\\" id=\\"__BVID__10\\">
<div>
<div id=\\"name-integration\\" role=\\"group\\" class=\\"form-group gl-form-group\\"><label id=\\"name-integration__BV_label_\\" for=\\"name-integration\\" class=\\"d-block col-form-label\\">2. Name integration</label>
<div class=\\"bv-no-focus-ring\\"><input type=\\"text\\" placeholder=\\"Enter integration name\\" class=\\"gl-form-input form-control\\" id=\\"__BVID__15\\">
<!---->
<!---->
<!---->
<transition-stub css=\\"true\\" enterclass=\\"\\" leaveclass=\\"collapse show\\" entertoclass=\\"collapse show\\" leavetoclass=\\"collapse\\" enteractiveclass=\\"collapsing\\" leaveactiveclass=\\"collapsing\\" class=\\"gl-mt-3\\">
<div class=\\"collapse\\" style=\\"display: none;\\" id=\\"__BVID__10\\">
<div>
<div id=\\"name-integration\\" role=\\"group\\" class=\\"form-group gl-form-group\\"><label id=\\"name-integration__BV_label_\\" for=\\"name-integration\\" class=\\"d-block col-form-label\\">2. Name integration</label>
<div class=\\"bv-no-focus-ring\\"><input type=\\"text\\" placeholder=\\"Enter integration name\\" class=\\"gl-form-input form-control\\" id=\\"__BVID__15\\">
<!---->
<!---->
<!---->
</div>
</div>
</div>
<div id=\\"integration-webhook\\" role=\\"group\\" class=\\"form-group gl-form-group\\"><label id=\\"integration-webhook__BV_label_\\" for=\\"integration-webhook\\" class=\\"d-block col-form-label\\">3. Set up webhook</label>
<div class=\\"bv-no-focus-ring\\"><span>Utilize the URL and authorization key below to authorize an external service to send alerts to GitLab. Review your external service's documentation to learn where to add these details, and the <a rel=\\"noopener noreferrer\\" target=\\"_blank\\" href=\\"https://docs.gitlab.com/ee/operations/incident_management/alert_integrations.html\\" class=\\"gl-link gl-display-inline-block\\">GitLab documentation</a> to learn more about configuring your endpoint.</span> <label class=\\"gl-display-flex gl-flex-direction-column gl-mb-0 gl-w-max-content gl-my-4 gl-font-weight-normal\\">
<div class=\\"gl-toggle-wrapper\\"><span class=\\"gl-toggle-label\\">Active</span>
<!----> <button aria-label=\\"Active\\" type=\\"button\\" class=\\"gl-toggle\\"><span class=\\"toggle-icon\\"><svg data-testid=\\"close-icon\\" aria-hidden=\\"true\\" class=\\"gl-icon s16\\"><use href=\\"#close\\"></use></svg></span></button></div>
<div id=\\"integration-webhook\\" role=\\"group\\" class=\\"form-group gl-form-group\\"><label id=\\"integration-webhook__BV_label_\\" for=\\"integration-webhook\\" class=\\"d-block col-form-label\\">3. Set up webhook</label>
<div class=\\"bv-no-focus-ring\\"><span>Utilize the URL and authorization key below to authorize an external service to send alerts to GitLab. Review your external service's documentation to learn where to add these details, and the <a rel=\\"noopener noreferrer\\" target=\\"_blank\\" href=\\"https://docs.gitlab.com/ee/operations/incident_management/alert_integrations.html\\" class=\\"gl-link gl-display-inline-block\\">GitLab documentation</a> to learn more about configuring your endpoint.</span> <label class=\\"gl-display-flex gl-flex-direction-column gl-mb-0 gl-w-max-content gl-my-4 gl-font-weight-normal\\">
<div class=\\"gl-toggle-wrapper\\"><span class=\\"gl-toggle-label\\">Active</span>
<!----> <button aria-label=\\"Active\\" type=\\"button\\" class=\\"gl-toggle\\"><span class=\\"toggle-icon\\"><svg data-testid=\\"close-icon\\" aria-hidden=\\"true\\" class=\\"gl-icon s16\\"><use href=\\"#close\\"></use></svg></span></button></div>
<!---->
</label>
<!---->
</label>
<!---->
<div class=\\"gl-my-4\\"><span class=\\"gl-font-weight-bold\\">
<div class=\\"gl-my-4\\"><span class=\\"gl-font-weight-bold\\">
Webhook URL
</span>
<div id=\\"url\\" readonly=\\"readonly\\">
<div role=\\"group\\" class=\\"input-group\\">
<!---->
<!----> <input id=\\"url\\" type=\\"text\\" readonly=\\"readonly\\" class=\\"gl-form-input form-control\\">
<div class=\\"input-group-append\\"><button title=\\"Copy\\" data-clipboard-text=\\"\\" aria-label=\\"Copy this value\\" type=\\"button\\" class=\\"btn gl-m-0! btn-default btn-md gl-button btn-default-secondary btn-icon\\">
<!----> <svg data-testid=\\"copy-to-clipboard-icon\\" aria-hidden=\\"true\\" class=\\"gl-button-icon gl-icon s16\\">
<use href=\\"#copy-to-clipboard\\"></use>
</svg>
<!----></button></div>
<!---->
<div id=\\"url\\" readonly=\\"readonly\\">
<div role=\\"group\\" class=\\"input-group\\">
<!---->
<!----> <input id=\\"url\\" type=\\"text\\" readonly=\\"readonly\\" class=\\"gl-form-input form-control\\">
<div class=\\"input-group-append\\"><button title=\\"Copy\\" data-clipboard-text=\\"\\" aria-label=\\"Copy this value\\" type=\\"button\\" class=\\"btn gl-m-0! btn-default btn-md gl-button btn-default-secondary btn-icon\\">
<!----> <svg data-testid=\\"copy-to-clipboard-icon\\" aria-hidden=\\"true\\" class=\\"gl-button-icon gl-icon s16\\">
<use href=\\"#copy-to-clipboard\\"></use>
</svg>
<!----></button></div>
<!---->
</div>
</div>
</div>
</div>
<div class=\\"gl-my-4\\"><span class=\\"gl-font-weight-bold\\">
<div class=\\"gl-my-4\\"><span class=\\"gl-font-weight-bold\\">
Authorization key
</span>
<div id=\\"authorization-key\\" readonly=\\"readonly\\" class=\\"gl-mb-3\\">
<div role=\\"group\\" class=\\"input-group\\">
<div id=\\"authorization-key\\" readonly=\\"readonly\\" class=\\"gl-mb-3\\">
<div role=\\"group\\" class=\\"input-group\\">
<!---->
<!----> <input id=\\"authorization-key\\" type=\\"text\\" readonly=\\"readonly\\" class=\\"gl-form-input form-control\\">
<div class=\\"input-group-append\\"><button title=\\"Copy\\" data-clipboard-text=\\"\\" aria-label=\\"Copy this value\\" type=\\"button\\" class=\\"btn gl-m-0! btn-default btn-md gl-button btn-default-secondary btn-icon\\">
<!----> <svg data-testid=\\"copy-to-clipboard-icon\\" aria-hidden=\\"true\\" class=\\"gl-button-icon gl-icon s16\\">
<use href=\\"#copy-to-clipboard\\"></use>
</svg>
<!----></button></div>
<!---->
</div>
</div> <button type=\\"button\\" disabled=\\"disabled\\" class=\\"btn btn-default btn-md disabled gl-button\\">
<!---->
<!----> <input id=\\"authorization-key\\" type=\\"text\\" readonly=\\"readonly\\" class=\\"gl-form-input form-control\\">
<div class=\\"input-group-append\\"><button title=\\"Copy\\" data-clipboard-text=\\"\\" aria-label=\\"Copy this value\\" type=\\"button\\" class=\\"btn gl-m-0! btn-default btn-md gl-button btn-default-secondary btn-icon\\">
<!----> <svg data-testid=\\"copy-to-clipboard-icon\\" aria-hidden=\\"true\\" class=\\"gl-button-icon gl-icon s16\\">
<use href=\\"#copy-to-clipboard\\"></use>
</svg>
<!----></button></div>
<!---->
</div>
</div> <button type=\\"button\\" disabled=\\"disabled\\" class=\\"btn btn-default btn-md disabled gl-button\\">
<!---->
<!----> <span class=\\"gl-button-text\\">
<!----> <span class=\\"gl-button-text\\">
Reset Key
</span></button>
<!---->
</div>
<!---->
<!---->
<!---->
</div>
</div>
<div id=\\"test-integration\\" role=\\"group\\" class=\\"form-group gl-form-group\\"><label id=\\"test-integration__BV_label_\\" for=\\"test-integration\\" class=\\"d-block col-form-label\\">4. Sample alert payload (optional)</label>
<div class=\\"bv-no-focus-ring\\"><span>Provide an example payload from the monitoring tool you intend to integrate with. This payload can be used to test the integration (optional).</span> <textarea id=\\"test-payload\\" disabled=\\"disabled\\" placeholder=\\"{ &quot;events&quot;: [{ &quot;application&quot;: &quot;Name of application&quot; }] }\\" wrap=\\"soft\\" class=\\"gl-form-input gl-form-textarea gl-my-3 form-control is-valid\\" style=\\"resize: none; overflow-y: scroll;\\"></textarea>
<!---->
<!---->
<!---->
</div>
<!---->
<!---->
<!---->
</div>
<!---->
<!---->
</div>
<div id=\\"test-integration\\" role=\\"group\\" class=\\"form-group gl-form-group\\"><label id=\\"test-integration__BV_label_\\" for=\\"test-integration\\" class=\\"d-block col-form-label\\">4. Sample alert payload (optional)</label>
<div class=\\"bv-no-focus-ring\\"><span>Provide an example payload from the monitoring tool you intend to integrate with. This payload can be used to test the integration (optional).</span> <textarea id=\\"test-payload\\" disabled=\\"disabled\\" placeholder=\\"{ &quot;events&quot;: [{ &quot;application&quot;: &quot;Name of application&quot; }] }\\" wrap=\\"soft\\" class=\\"gl-form-input gl-form-textarea gl-my-3 form-control is-valid\\" style=\\"resize: none; overflow-y: scroll;\\"></textarea>
<div class=\\"gl-display-flex gl-justify-content-start gl-py-3\\"><button data-testid=\\"integration-form-submit\\" type=\\"submit\\" class=\\"btn js-no-auto-disable btn-success btn-md gl-button\\">
<!---->
<!----> <span class=\\"gl-button-text\\">Save integration
</span></button> <button data-testid=\\"integration-test-and-submit\\" type=\\"button\\" disabled=\\"disabled\\" class=\\"btn gl-mx-3 js-no-auto-disable btn-success btn-md disabled gl-button btn-success-secondary\\">
<!---->
<!----> <span class=\\"gl-button-text\\">Save and test payload</span></button> <button type=\\"reset\\" class=\\"btn js-no-auto-disable btn-default btn-md gl-button\\">
<!---->
</div>
</div>
<!---->
<!---->
<!----> <span class=\\"gl-button-text\\">Cancel</span></button></div>
</div>
<div class=\\"gl-display-flex gl-justify-content-start gl-py-3\\"><button data-testid=\\"integration-form-submit\\" type=\\"submit\\" class=\\"btn js-no-auto-disable btn-success btn-md gl-button\\">
<!---->
<!----> <span class=\\"gl-button-text\\">Save integration
</span></button> <button data-testid=\\"integration-test-and-submit\\" type=\\"button\\" disabled=\\"disabled\\" class=\\"btn gl-mx-3 js-no-auto-disable btn-success btn-md disabled gl-button btn-success-secondary\\">
<!---->
<!----> <span class=\\"gl-button-text\\">Save and test payload</span></button> <button type=\\"reset\\" class=\\"btn js-no-auto-disable btn-default btn-md gl-button\\">
<!---->
<!----> <span class=\\"gl-button-text\\">Cancel</span></button></div>
</div>
</transition-stub>
</form>"
`;
......@@ -71,7 +71,7 @@ describe('BoardForm', () => {
mutate,
},
},
attachToDocument: true,
attachTo: document.body,
});
};
......
......@@ -94,7 +94,7 @@ describe('BoardsSelector', () => {
weights: [],
},
mocks: { $apollo },
attachToDocument: true,
attachTo: document.body,
});
wrapper.vm.$apollo.addSmartQuery = jest.fn((_, options) => {
......
......@@ -17,7 +17,7 @@ describe('Ci variable modal', () => {
const createComponent = (method, options = {}) => {
store = createStore();
wrapper = method(CiVariableModal, {
attachToDocument: true,
attachTo: document.body,
stubs: {
GlModal: ModalStub,
},
......
......@@ -17,7 +17,7 @@ describe('Ci variable table', () => {
store.state.isGroup = true;
jest.spyOn(store, 'dispatch').mockImplementation();
wrapper = mount(CiVariableTable, {
attachToDocument: true,
attachTo: document.body,
localVue,
store,
});
......
......@@ -19,7 +19,7 @@ describe('Deploy freeze modal', () => {
timezoneData: timezoneDataFixture,
});
wrapper = shallowMount(DeployFreezeModal, {
attachToDocument: true,
attachTo: document.body,
stubs: {
GlModal,
},
......
......@@ -18,7 +18,7 @@ describe('Deploy freeze table', () => {
});
jest.spyOn(store, 'dispatch').mockImplementation();
wrapper = mount(DeployFreezeTable, {
attachToDocument: true,
attachTo: document.body,
localVue,
store,
});
......
......@@ -36,7 +36,7 @@ describe('Design reply form component', () => {
it('textarea has focus after component mount', () => {
// We need to attach to document, so that `document.activeElement` is properly set in jsdom
createComponent({}, { attachToDocument: true });
createComponent({}, { attachTo: document.body });
expect(findTextarea().element).toEqual(document.activeElement);
});
......
......@@ -10,7 +10,10 @@ exports[`Design management list item component when item appears in view after i
exports[`Design management list item component with notes renders item with multiple comments 1`] = `
<router-link-stub
ariacurrentvalue="page"
class="card gl-cursor-pointer text-plain js-design-list-item design-list-item design-list-item-new"
event="click"
tag="a"
to="[object Object]"
>
<div
......@@ -81,7 +84,10 @@ exports[`Design management list item component with notes renders item with mult
exports[`Design management list item component with notes renders item with single comment 1`] = `
<router-link-stub
ariacurrentvalue="page"
class="card gl-cursor-pointer text-plain js-design-list-item design-list-item design-list-item-new"
event="click"
tag="a"
to="[object Object]"
>
<div
......
......@@ -160,7 +160,7 @@ describe('Design management index page', () => {
localVue,
router,
stubs: { DesignDestroyer, ApolloMutation, VueDraggable, ...stubs },
attachToDocument: true,
attachTo: document.body,
provide: {
projectPath: 'project-path',
issueIid: '1',
......
......@@ -26,7 +26,7 @@ describe('Stacked column chart component', () => {
stubs: {
GlPopover: true,
},
attachToDocument: true,
attachTo: document.body,
});
beforeEach(() => {
......
......@@ -53,7 +53,7 @@ describe('Time series component', () => {
stubs: {
GlPopover: true,
},
attachToDocument: true,
attachTo: document.body,
});
};
......
......@@ -11,7 +11,7 @@ const createMountedWrapper = (props = {}) => {
wrapper = mount(DuplicateDashboardForm, {
propsData: { ...props },
// We need to attach to document, so that `document.activeElement` is properly set in jsdom
attachToDocument: true,
attachTo: document.body,
});
};
......
......@@ -16,8 +16,8 @@ describe('~/pipeline_editor/pipeline_editor_app.vue', () => {
...props,
},
// attachToDocument is required for input/submit events
attachToDocument: mountFn === mount,
// attachTo is required for input/submit events
attachTo: mountFn === mount ? document.body : null,
});
};
......
......@@ -100,8 +100,8 @@ describe('~/pipeline_editor/pipeline_editor_app.vue', () => {
mutate: mockMutate,
},
},
// attachToDocument is required for input/submit events
attachToDocument: mountFn === mount,
// attachTo is required for input/submit events
attachTo: mountFn === mount ? document.body : null,
...options,
});
};
......
......@@ -20,7 +20,7 @@ describe('The DAG graph', () => {
}
wrapper = shallowMount(DagGraph, {
attachToDocument: true,
attachTo: document.body,
propsData,
data() {
return {
......
......@@ -26,7 +26,7 @@ describe('Pipelines filtered search', () => {
projectId: '21',
params,
},
attachToDocument: true,
attachTo: document.body,
});
};
......
......@@ -26,7 +26,7 @@ describe('Pipelines stage component', () => {
const createComponent = (props = {}) => {
wrapper = mount(StageComponent, {
attachToDocument: true,
attachTo: document.body,
propsData: {
...defaultProps,
...props,
......
......@@ -29,7 +29,7 @@ describe('sidebar assignees', () => {
},
},
// Attaching to document is required because this component emits something from the parent element :/
attachToDocument: true,
attachTo: document.body,
});
};
......
......@@ -58,8 +58,18 @@ Object.entries(jqueryMatchers).forEach(([matcherName, matcherFactory]) => {
expect.extend(customMatchers);
// Tech debt issue TBD
testUtilsConfig.logModifiedComponents = false;
testUtilsConfig.deprecationWarningHandler = (method, message) => {
const ALLOWED_DEPRECATED_METHODS = [
// https://gitlab.com/gitlab-org/gitlab/-/issues/295679
'finding components with `find` or `get`',
// https://gitlab.com/gitlab-org/gitlab/-/issues/295680
'finding components with `findAll`',
];
if (!ALLOWED_DEPRECATED_METHODS.includes(method)) {
global.console.error(message);
}
};
Object.assign(global, {
requestIdleCallback(cb) {
......
......@@ -31,7 +31,7 @@ describe('ProjectSelector component', () => {
showSearchErrorMessage: false,
totalResults: searchResults.length,
},
attachToDocument: true,
attachTo: document.body,
});
({ vm } = wrapper);
......
......@@ -18,7 +18,7 @@ describe('TooltipOnTruncate component', () => {
const createComponent = ({ propsData, ...options } = {}) => {
wrapper = shallowMount(TooltipOnTruncate, {
attachToDocument: true,
attachTo: document.body,
propsData: {
...propsData,
},
......@@ -44,7 +44,7 @@ describe('TooltipOnTruncate component', () => {
},
{
propsData: { ...propsData },
attachToDocument: true,
attachTo: document.body,
...options,
},
);
......
......@@ -19,7 +19,7 @@ describe('Tooltip directive', () => {
data: () => ({ tooltip: text }),
template,
},
{ attachToDocument: true },
{ attachTo: document.body },
);
}
......
......@@ -36,7 +36,7 @@ describe('validation directive', () => {
`,
};
wrapper = shallowMount(component, { attachToDocument: true });
wrapper = shallowMount(component, { attachTo: document.body });
};
afterEach(() => {
......
......@@ -1423,10 +1423,10 @@
source-map "~0.6.1"
vue-template-es2015-compiler "^1.9.0"
"@vue/test-utils@1.0.0-beta.30":
version "1.0.0-beta.30"
resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-1.0.0-beta.30.tgz#d5f26d1e2411fdb7fa7fdedb61b4b4ea4194c49d"
integrity sha512-Wyvcha9fNk8+kzTDwb3xWGjPkCPzHSYSwKP6MplrPTG/auhqoad7JqUEceZLc6u7AU4km2pPQ8/m9s0RgCZ0NA==
"@vue/test-utils@1.1.2":
version "1.1.2"
resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-1.1.2.tgz#fdb487448dceefeaf3d01d465f7c836a3d666dbc"
integrity sha512-utbIL7zn9c+SjhybPwh48lpWCiluFCbP1yyRNAy1fQsw/6hiNFioaWy05FoVAFIZXC5WwBf+5r4ypfM1j/nI4A==
dependencies:
dom-event-types "^1.0.0"
lodash "^4.17.15"
......
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