Add latest changes from gitlab-org/gitlab@master

spec/frontend/clusters/components/knative_domain_editor_spec.js

@@ -25,6 +25,7 @@ describe('KnativeDomainEditor', () => {
   afterEach(() => {
     wrapper.destroy();
+    wrapper = null;
   });
   describe('knative has an assigned IP address', () => {
@@ -101,11 +102,15 @@ describe('KnativeDomainEditor', () => {
   describe('when knative domain name input changes', () => {
     it('emits "set" event with updated domain name', () => {
+      createComponent({ knative });
+
       const newHostname = 'newhostname.com';
       wrapper.setData({ knativeHostname: newHostname });
-      expect(wrapper.emitted('set')[0]).toEqual([newHostname]);
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted('set')[0]).toEqual([newHostname]);
+      });
     });
   });

spec/frontend/create_cluster/eks_cluster/components/cluster_form_dropdown_spec.js

@@ -61,15 +61,20 @@ describe('ClusterFormDropdown', () => {
     beforeEach(() => {
       vm.setProps({ items, multiple: true, value });
-      return vm.vm.$nextTick().then(() => {
-        vm.findAll('.js-dropdown-item')
-          .at(0)
-          .trigger('click');
-        vm.findAll('.js-dropdown-item')
-          .at(1)
-          .trigger('click');
-        return vm.vm.$nextTick();
-      });
+      return vm.vm
+        .$nextTick()
+        .then(() => {
+          vm.findAll('.js-dropdown-item')
+            .at(0)
+            .trigger('click');
+          return vm.vm.$nextTick();
+        })
+        .then(() => {
+          vm.findAll('.js-dropdown-item')
+            .at(1)
+            .trigger('click');
+          return vm.vm.$nextTick();
+        });
     });
     it('emits input event with an array of selected items', () => {
@@ -198,8 +203,10 @@ describe('ClusterFormDropdown', () => {
     vm.setProps({ items });
     vm.setData({ searchQuery });
-    expect(vm.findAll('.js-dropdown-item').length).toEqual(1);
-    expect(vm.find('.js-dropdown-item').text()).toEqual(secondItem.name);
+    return vm.vm.$nextTick().then(() => {
+      expect(vm.findAll('.js-dropdown-item').length).toEqual(1);
+      expect(vm.find('.js-dropdown-item').text()).toEqual(secondItem.name);
+    });
   });
   it('focuses dropdown search input when dropdown is displayed', () => {

spec/frontend/create_cluster/eks_cluster/components/service_credentials_form_spec.js

@@ -72,7 +72,9 @@ describe('ServiceCredentialsForm', () => {
   it('enables submit button when role ARN is not provided', () => {
     vm.setData({ roleArn: '123' });
-    expect(findSubmitButton().attributes('disabled')).toBeFalsy();
+    return vm.vm.$nextTick().then(() => {
+      expect(findSubmitButton().attributes('disabled')).toBeFalsy();
+    });
   });
   it('dispatches createRole action when form is submitted', () => {
@@ -86,6 +88,8 @@ describe('ServiceCredentialsForm', () => {
       vm.setData({ roleArn: '123' }); // set role ARN to enable button
       state.isCreatingRole = true;
+
+      return vm.vm.$nextTick();
     });
     it('disables submit button', () => {

spec/frontend/cycle_analytics/stage_nav_item_spec.js

@@ -92,7 +92,9 @@ describe('StageNavItem', () => {
     it('emits the `select` event when clicked', () => {
       expect(wrapper.emitted().select).toBeUndefined();
       wrapper.trigger('click');
-      expect(wrapper.emitted().select.length).toBe(1);
+      return wrapper.vm.$nextTick(() => {
+        expect(wrapper.emitted().select.length).toBe(1);
+      });
     });
   });

spec/frontend/diffs/components/diff_file_header_spec.js

@@ -117,7 +117,10 @@ describe('DiffFileHeader component', () => {
   it('when header is clicked emits toggleFile', () => {
     createComponent();
     findHeader().trigger('click');
-    expect(wrapper.emitted().toggleFile).toBeDefined();
+
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted().toggleFile).toBeDefined();
+    });
   });
   it('when collapseIcon is clicked emits toggleFile', () => {
@@ -129,7 +132,10 @@ describe('DiffFileHeader component', () => {
   it('when other element in header is clicked does not emits toggleFile', () => {
     createComponent({ collapsible: true });
     findTitleLink().trigger('click');
-    expect(wrapper.emitted().toggleFile).not.toBeDefined();
+
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted().toggleFile).not.toBeDefined();
+    });
   });
   it('displays a copy to clipboard button', () => {

spec/frontend/diffs/components/diff_gutter_avatars_spec.js

@@ -42,7 +42,9 @@ describe('DiffGutterAvatars', () => {
     it('should emit toggleDiscussions event on button click', () => {
       findCollapseButton().trigger('click');
-      expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
+      });
     });
   });
@@ -72,13 +74,17 @@ describe('DiffGutterAvatars', () => {
         .at(0)
         .trigger('click');
-      expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
+      });
     });
     it('should emit toggleDiscussions event on more count text click', () => {
       findMoreCount().trigger('click');
-      expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().toggleLineDiscussions).toBeTruthy();
+      });
     });
   });

spec/frontend/diffs/components/edit_button_spec.js

@@ -36,7 +36,9 @@ describe('EditButton', () => {
     });
     wrapper.trigger('click');
-    expect(wrapper.emitted('showForkMessage')).toBeTruthy();
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted('showForkMessage')).toBeTruthy();
+    });
   });
   it('doesnt emit a show fork message event if current user cannot fork', () => {
@@ -46,7 +48,9 @@ describe('EditButton', () => {
     });
     wrapper.trigger('click');
-    expect(wrapper.emitted('showForkMessage')).toBeFalsy();
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted('showForkMessage')).toBeFalsy();
+    });
   });
   it('doesnt emit a show fork message event if current user can modify blob', () => {
@@ -57,6 +61,8 @@ describe('EditButton', () => {
     });
     wrapper.trigger('click');
-    expect(wrapper.emitted('showForkMessage')).toBeFalsy();
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted('showForkMessage')).toBeFalsy();
+    });
   });
 });

spec/frontend/ide/components/error_message_spec.js

@@ -90,8 +90,13 @@ describe('IDE error message component', () => {
     it('does not dispatch action when already loading', () => {
       wrapper.find('button').trigger('click');
       actionMock.mockReset();
-      wrapper.find('button').trigger('click');
-      expect(actionMock).not.toHaveBeenCalled();
+      return wrapper.vm.$nextTick(() => {
+        wrapper.find('button').trigger('click');
+
+        return wrapper.vm.$nextTick().then(() => {
+          expect(actionMock).not.toHaveBeenCalled();
+        });
+      });
     });
     it('shows loading icon when loading', () => {

spec/frontend/ide/components/file_templates/dropdown_spec.js

@@ -62,7 +62,9 @@ describe('IDE file templates dropdown component', () => {
     const item = findItemButtons().at(0);
     item.trigger('click');
-    expect(wrapper.emitted().click[0][0]).toBe(itemData);
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted().click[0][0]).toBe(itemData);
+    });
   });
   it('renders dropdown title', () => {

spec/frontend/ide/components/jobs/stage_spec.js

@@ -52,7 +52,10 @@ describe('IDE pipeline stage', () => {
     const id = 5;
     createComponent({ stage: { ...defaultProps.stage, id } });
     findHeader().trigger('click');
-    expect(wrapper.emitted().toggleCollapsed[0][0]).toBe(id);
+
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted().toggleCollapsed[0][0]).toBe(id);
+    });
   });
   it('emits clickViewLog entity with job', () => {

spec/frontend/issuable_suggestions/components/app_spec.js

@@ -42,14 +42,18 @@ describe('Issuable suggestions app component', () => {
     it('renders component', () => {
       wrapper.setData(data);
-      expect(wrapper.isEmpty()).toBe(false);
+      return wrapper.vm.$nextTick(() => {
+        expect(wrapper.isEmpty()).toBe(false);
+      });
     });
     it('does not render with empty search', () => {
       wrapper.setProps({ search: '' });
       wrapper.setData(data);
-      expect(wrapper.isVisible()).toBe(false);
+      return wrapper.vm.$nextTick(() => {
+        expect(wrapper.isVisible()).toBe(false);
+      });
     });
     it('does not render when loading', () => {
@@ -58,13 +62,17 @@ describe('Issuable suggestions app component', () => {
         loading: 1,
       });
-      expect(wrapper.isVisible()).toBe(false);
+      return wrapper.vm.$nextTick(() => {
+        expect(wrapper.isVisible()).toBe(false);
+      });
     });
     it('does not render with empty issues data', () => {
       wrapper.setData({ issues: [] });
-      expect(wrapper.isVisible()).toBe(false);
+      return wrapper.vm.$nextTick(() => {
+        expect(wrapper.isVisible()).toBe(false);
+      });
     });
     it('renders list of issues', () => {

spec/frontend/issuables_list/components/issuable_spec.js

@@ -339,7 +339,9 @@ describe('Issuable component', () => {
         findBulkCheckbox().trigger('click');
-        expect(wrapper.emitted().select).toEqual([[{ issuable, selected: !selected }]]);
+        return wrapper.vm.$nextTick().then(() => {
+          expect(wrapper.emitted().select).toEqual([[{ issuable, selected: !selected }]]);
+        });
       });
     });
   });

spec/frontend/jobs/components/log/collapsible_section_spec.js

@@ -68,6 +68,9 @@ describe('Job Log Collapsible Section', () => {
     });
     findCollapsibleLine().trigger('click');
-    expect(wrapper.emitted('onClickCollapsibleLine').length).toBe(1);
+
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted('onClickCollapsibleLine').length).toBe(1);
+    });
   });
 });

spec/frontend/jobs/components/log/line_header_spec.js

@@ -79,7 +79,9 @@ describe('Job Log Header Line', () => {
     it('emits toggleLine event', () => {
       wrapper.trigger('click');
-      expect(wrapper.emitted().toggleLine.length).toBe(1);
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.emitted().toggleLine.length).toBe(1);
+      });
     });
   });

spec/frontend/monitoring/components/charts/time_series_spec.js

@@ -348,11 +348,10 @@ describe('Time series component', () => {
     glChartComponents.forEach(dynamicComponent => {
       describe(`GitLab UI: ${dynamicComponent.chartType}`, () => {
         let timeSeriesAreaChart;
-        let glChart;
+        const findChart = () => timeSeriesAreaChart.find(dynamicComponent.component);
         beforeEach(done => {
           timeSeriesAreaChart = makeTimeSeriesChart(mockGraphData, dynamicComponent.chartType);
-          glChart = timeSeriesAreaChart.find(dynamicComponent.component);
           timeSeriesAreaChart.vm.$nextTick(done);
         });
@@ -361,12 +360,12 @@ describe('Time series component', () => {
         });
         it('is a Vue instance', () => {
-          expect(glChart.exists()).toBe(true);
-          expect(glChart.isVueInstance()).toBe(true);
+          expect(findChart().exists()).toBe(true);
+          expect(findChart().isVueInstance()).toBe(true);
         });
         it('receives data properties needed for proper chart render', () => {
-          const props = glChart.props();
+          const props = findChart().props();
           expect(props.data).toBe(timeSeriesAreaChart.vm.chartData);
           expect(props.option).toBe(timeSeriesAreaChart.vm.chartOptions);
@@ -379,7 +378,9 @@ describe('Time series component', () => {
           timeSeriesAreaChart.vm.tooltip.title = mockTitle;
           timeSeriesAreaChart.vm.$nextTick(() => {
-            expect(shallowWrapperContainsSlotText(glChart, 'tooltipTitle', mockTitle)).toBe(true);
+            expect(shallowWrapperContainsSlotText(findChart(), 'tooltipTitle', mockTitle)).toBe(
+              true,
+            );
             done();
           });
         });
@@ -394,7 +395,9 @@ describe('Time series component', () => {
           });
           it('uses deployment title', () => {
-            expect(shallowWrapperContainsSlotText(glChart, 'tooltipTitle', 'Deployed')).toBe(true);
+            expect(shallowWrapperContainsSlotText(findChart(), 'tooltipTitle', 'Deployed')).toBe(
+              true,
+            );
           });
           it('renders clickable commit sha in tooltip content', done => {

spec/frontend/monitoring/components/date_time_picker/date_time_picker_input_spec.js

@@ -58,8 +58,9 @@ describe('DateTimePickerInput', () => {
   it('input event is emitted when focus is lost', () => {
     createComponent();
     jest.spyOn(wrapper.vm, '$emit');
-    wrapper.find('input').setValue(inputValue);
-    wrapper.find('input').trigger('blur');
+    const input = wrapper.find('input');
+    input.setValue(inputValue);
+    input.trigger('blur');
     expect(wrapper.vm.$emit).toHaveBeenCalledWith('input', inputValue);
   });

spec/frontend/monitoring/components/date_time_picker/date_time_picker_spec.js

@@ -18,7 +18,10 @@ describe('DateTimePicker', () => {
   const cancelButtonElement = () => dateTimePicker.find('button.btn-secondary').element;
   const fillInputAndBlur = (input, val) => {
     dateTimePicker.find(input).setValue(val);
-    dateTimePicker.find(input).trigger('blur');
+    return dateTimePicker.vm.$nextTick().then(() => {
+      dateTimePicker.find(input).trigger('blur');
+      return dateTimePicker.vm.$nextTick();
+    });
   };
   const createComponent = props => {
@@ -103,52 +106,54 @@ describe('DateTimePicker', () => {
   it('displays inline error message if custom time range inputs are invalid', done => {
     createComponent();
-    fillInputAndBlur('#custom-time-from', '2019-10-01abc');
-    fillInputAndBlur('#custom-time-to', '2019-10-10abc');
-
-    dateTimePicker.vm.$nextTick(() => {
-      expect(dateTimePicker.findAll('.invalid-feedback').length).toBe(2);
-      done();
-    });
+    fillInputAndBlur('#custom-time-from', '2019-10-01abc')
+      .then(() => fillInputAndBlur('#custom-time-to', '2019-10-10abc'))
+      .then(() => {
+        expect(dateTimePicker.findAll('.invalid-feedback').length).toBe(2);
+        done();
+      })
+      .catch(done);
   });
   it('keeps apply button disabled with invalid custom time range inputs', done => {
     createComponent();
-    fillInputAndBlur('#custom-time-from', '2019-10-01abc');
-    fillInputAndBlur('#custom-time-to', '2019-09-19');
-
-    dateTimePicker.vm.$nextTick(() => {
-      expect(applyButtonElement().getAttribute('disabled')).toBe('disabled');
-      done();
-    });
+    fillInputAndBlur('#custom-time-from', '2019-10-01abc')
+      .then(() => fillInputAndBlur('#custom-time-to', '2019-09-19'))
+      .then(() => {
+        expect(applyButtonElement().getAttribute('disabled')).toBe('disabled');
+        done();
+      })
+      .catch(done);
   });
   it('enables apply button with valid custom time range inputs', done => {
     createComponent();
-    fillInputAndBlur('#custom-time-from', '2019-10-01');
-    fillInputAndBlur('#custom-time-to', '2019-10-19');
-
-    dateTimePicker.vm.$nextTick(() => {
-      expect(applyButtonElement().getAttribute('disabled')).toBeNull();
-      done();
-    });
+    fillInputAndBlur('#custom-time-from', '2019-10-01')
+      .then(() => fillInputAndBlur('#custom-time-to', '2019-10-19'))
+      .then(() => {
+        dateTimePicker.vm.$nextTick(() => {
+          expect(applyButtonElement().getAttribute('disabled')).toBeNull();
+          done();
+        });
+      })
+      .catch(done);
   });
   it('returns an object when apply is clicked', done => {
     createComponent();
-    fillInputAndBlur('#custom-time-from', '2019-10-01');
-    fillInputAndBlur('#custom-time-to', '2019-10-19');
-
-    dateTimePicker.vm.$nextTick(() => {
-      jest.spyOn(dateTimePicker.vm, '$emit');
-      applyButtonElement().click();
-
-      expect(dateTimePicker.vm.$emit).toHaveBeenCalledWith('onApply', {
-        end: '2019-10-19T00:00:00Z',
-        start: '2019-10-01T00:00:00Z',
-      });
-      done();
-    });
+    fillInputAndBlur('#custom-time-from', '2019-10-01')
+      .then(() => fillInputAndBlur('#custom-time-to', '2019-10-19'))
+      .then(() => {
+        jest.spyOn(dateTimePicker.vm, '$emit');
+        applyButtonElement().click();
+
+        expect(dateTimePicker.vm.$emit).toHaveBeenCalledWith('onApply', {
+          end: '2019-10-19T00:00:00Z',
+          start: '2019-10-01T00:00:00Z',
+        });
+        done();
+      })
+      .catch(done);
   });
   it('hides the popover with cancel button', done => {

spec/frontend/mr_popover/mr_popover_spec.js

@@ -41,7 +41,9 @@ describe('MR Popover', () => {
         },
       });
-      expect(wrapper.element).toMatchSnapshot();
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.element).toMatchSnapshot();
+      });
     });
     it('does not show CI Icon if there is no pipeline data', () => {
@@ -55,7 +57,9 @@ describe('MR Popover', () => {
         },
       });
-      expect(wrapper.contains('ciicon-stub')).toBe(false);
+      return wrapper.vm.$nextTick().then(() => {
+        expect(wrapper.contains('ciicon-stub')).toBe(false);
+      });
     });
   });
 });

spec/frontend/notes/components/discussion_jump_to_next_button_spec.js

@@ -24,7 +24,9 @@ describe('JumpToNextDiscussionButton', () => {
     button.trigger('click');
-    expect(wrapper.emitted().onClick).toBeTruthy();
-    expect(wrapper.emitted().onClick.length).toBe(1);
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted().onClick).toBeTruthy();
+      expect(wrapper.emitted().onClick.length).toBe(1);
+    });
   });
 });

spec/frontend/notes/components/discussion_reply_placeholder_spec.js

@@ -25,8 +25,10 @@ describe('ReplyPlaceholder', () => {
   it('emits onClick even on button click', () => {
     findButton().trigger('click');
-    expect(wrapper.emitted()).toEqual({
-      onClick: [[]],
+    return wrapper.vm.$nextTick().then(() => {
+      expect(wrapper.emitted()).toEqual({
+        onClick: [[]],
+      });
     });
   });