Merge branch...

Merge branch '326924-follow-up-from-add-findby-and-findallby-to-extendwrapper-jest-helper' into 'master'

Update VTU to v1.2.0

See merge request gitlab-org/gitlab!61293

app/assets/javascripts/boards/components/issue_time_estimate_deprecated.vue

@@ -10,7 +10,7 @@ export default {
   },
   props: {
     estimate: {
-      type: Number,
+      type: [Number, String],
       required: true,
     },
   },

package.json

@@ -193,7 +193,7 @@
     "@gitlab/eslint-plugin": "8.4.0",
     "@gitlab/stylelint-config": "2.3.0",
     "@testing-library/dom": "^7.16.2",
-    "@vue/test-utils": "1.1.2",
+    "@vue/test-utils": "1.2.0",
     "acorn": "^6.3.0",
     "axios-mock-adapter": "^1.15.0",
     "babel-jest": "^26.5.2",

spec/frontend/__helpers__/vue_test_utils_helper.js

 import * as testingLibrary from '@testing-library/dom';
-import { createWrapper, WrapperArray, mount, shallowMount } from '@vue/test-utils';
+import { createWrapper, WrapperArray, ErrorWrapper, mount, shallowMount } from '@vue/test-utils';
 import { isArray, upperFirst } from 'lodash';
 
 const vNodeContainsText = (vnode, text) =>
@@ -81,14 +81,9 @@ export const extendedWrapper = (wrapper) => {
               options,
             );
 
-            // Return VTU `ErrorWrapper` if element is not found
-            // https://github.com/vuejs/vue-test-utils/blob/dev/packages/test-utils/src/error-wrapper.js
-            // VTU does not expose `ErrorWrapper` so, as of now, this is the best way to
-            // create an `ErrorWrapper`
+            // Element not found, return an `ErrorWrapper`
             if (!elements.length) {
-              const emptyElement = document.createElement('div');
-
-              return createWrapper(emptyElement).find('testing-library-element-not-found');
+              return new ErrorWrapper(query);
             }
 
             return createWrapper(elements[0], this.options || {});

spec/frontend/__helpers__/vue_test_utils_helper_spec.js

@@ -4,6 +4,7 @@ import {
   shallowMount,
   Wrapper as VTUWrapper,
   WrapperArray as VTUWrapperArray,
+  ErrorWrapper as VTUErrorWrapper,
 } from '@vue/test-utils';
 import {
   extendedWrapper,
@@ -195,7 +196,7 @@ describe('Vue test utils helpers', () => {
         });
 
         it('returns a VTU error wrapper', () => {
-          expect(wrapper[findMethod](text, options).exists()).toBe(false);
+          expect(wrapper[findMethod](text, options)).toBeInstanceOf(VTUErrorWrapper);
         });
       });
     });

spec/frontend/ide/components/repo_editor_spec.js

@@ -656,7 +656,7 @@ describe('RepoEditor', () => {
     });
 
     it("does not add file to state or set markdown image syntax if the file isn't markdown", async () => {
-      wrapper.setProps({
+      await wrapper.setProps({
         file: setFileName('myfile.txt'),
       });
       pasteImage();

spec/frontend/notes/components/discussion_actions_spec.js

@@ -20,7 +20,7 @@ const createUnallowedNote = () =>
 
 describe('DiscussionActions', () => {
   let wrapper;
-  const createComponentFactory = (shallow = true) => (props) => {
+  const createComponentFactory = (shallow = true) => (props, options) => {
     const store = createStore();
     const mountFn = shallow ? shallowMount : mount;
 
@@ -34,6 +34,7 @@ describe('DiscussionActions', () => {
         shouldShowJumpToNextDiscussion: true,
         ...props,
       },
+      ...options,
     });
   };
 
@@ -90,17 +91,17 @@ describe('DiscussionActions', () => {
   describe('events handling', () => {
     const createComponent = createComponentFactory(false);
 
-    beforeEach(() => {
-      createComponent();
-    });
-
     it('emits showReplyForm event when clicking on reply placeholder', () => {
+      createComponent({}, { attachTo: document.body });
+
       jest.spyOn(wrapper.vm, '$emit');
       wrapper.find(ReplyPlaceholder).find('textarea').trigger('focus');
       expect(wrapper.vm.$emit).toHaveBeenCalledWith('showReplyForm');
     });
 
     it('emits resolve event when clicking on resolve button', () => {
+      createComponent();
+
       jest.spyOn(wrapper.vm, '$emit');
       wrapper.find(ResolveDiscussionButton).find('button').trigger('click');
       expect(wrapper.vm.$emit).toHaveBeenCalledWith('resolve');

spec/frontend/notes/components/discussion_reply_placeholder_spec.js

@@ -6,31 +6,34 @@ const placeholderText = 'Test Button Text';
 describe('ReplyPlaceholder', () => {
   let wrapper;
 
-  const findTextarea = () => wrapper.find({ ref: 'textarea' });
-
-  beforeEach(() => {
+  const createComponent = ({ options = {} } = {}) => {
     wrapper = shallowMount(ReplyPlaceholder, {
       propsData: {
         placeholderText,
       },
+      ...options,
     });
-  });
+  };
+
+  const findTextarea = () => wrapper.find({ ref: 'textarea' });
 
   afterEach(() => {
     wrapper.destroy();
   });
 
-  it('emits focus event on button click', () => {
-    findTextarea().trigger('focus');
+  it('emits focus event on button click', async () => {
+    createComponent({ options: { attachTo: document.body } });
+
+    await findTextarea().trigger('focus');
 
-    return wrapper.vm.$nextTick().then(() => {
-      expect(wrapper.emitted()).toEqual({
-        focus: [[]],
-      });
+    expect(wrapper.emitted()).toEqual({
+      focus: [[]],
     });
   });
 
   it('should render reply button', () => {
+    createComponent();
+
     expect(findTextarea().attributes('placeholder')).toEqual(placeholderText);
   });
 });

spec/frontend/pages/projects/graphs/__snapshots__/code_coverage_spec.js.snap

@@ -66,7 +66,7 @@ exports[`Code Coverage when fetching data is successful matches the snapshot 1`]
   <gl-area-chart-stub
     annotations=""
     data="[object Object]"
-    formattooltiptext="function () { [native code] }"
+    formattooltiptext="[Function]"
     height="200"
     includelegendavgmax="true"
     legendaveragetext="Avg"

yarn.lock

@@ -1816,10 +1816,10 @@
     source-map "~0.6.1"
     vue-template-es2015-compiler "^1.9.0"
 
-"@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==
+"@vue/test-utils@1.2.0":
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/@vue/test-utils/-/test-utils-1.2.0.tgz#3bc8c17ed549157275f0aec6b95da40887f7297f"
+  integrity sha512-poBTLqeJYNq1TXVhtVfnY8vELUVOFdJY8KZZoUuaAkIqPTWsxonU1M8nMWpZT+xEMrM+49+YcuEqtMHVD9Q9gw==
   dependencies:
     dom-event-types "^1.0.0"
     lodash "^4.17.15"