Merge remote-tracking branch 'upstream/master' into ce-to-ee-2018-03-21

# Conflicts:
#	spec/javascripts/vue_shared/components/markdown/toolbar_spec.js

[ci skip]

changelogs/unreleased/update-spec-import-path-for-vue-mount-component-helper.yml

+---
+title: Update spec import path for vue mount component helper
+merge_request: 17880
+author: George Tsiolis
+type: performance

doc/development/new_fe_guide/development/performance.md

 # Performance
 
-> TODO: Add content
+## Monitoring
+
+We have a performance dashboard available in one of our [grafana instances](https://performance.gprd.gitlab.com/dashboard/db/sitespeed-page-summary?orgId=1). This dashboard automatically aggregates metric data from [sitespeed.io](https://sitespeed.io) every 6 hours. These changes are displayed after a set number of pages are aggregated.
+
+These pages can be found inside a text file in the gitlab-build-images [repository](https://gitlab.com/gitlab-org/gitlab-build-images) called [gitlab.txt](https://gitlab.com/gitlab-org/gitlab-build-images/blob/master/scripts/gitlab.txt)
+Any frontend engineer can contribute to this dashboard. They can contribute by adding or removing urls of pages from this text file. Please have a [frontend monitoring expert](https://about.gitlab.com/team) review your changes before assigning to a maintainer of the `gitlab-build-images` project. The changes will go live on the next scheduled run after the changes are merged into `master`.
+
+There are 3 recommended high impact metrics to review on each page
+
+* [First visual change](https://developers.google.com/web/tools/lighthouse/audits/first-meaningful-paint)
+* [Speed Index](https://sites.google.com/a/webpagetest.org/docs/using-webpagetest/metrics/speed-index)
+* [Visual Complete 95%](https://sites.google.com/a/webpagetest.org/docs/using-webpagetest/metrics/speed-index)
+
+For these metrics, lower numbers are better as it means that the website is more performant.

spec/javascripts/notes/components/diff_file_header_spec.js

 import Vue from 'vue';
 import DiffFileHeader from '~/notes/components/diff_file_header.vue';
 import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
-import mountComponent from '../../helpers/vue_mount_component_helper';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
 const discussionFixture = 'merge_requests/diff_discussion.json';
 

spec/javascripts/notes/components/diff_with_note_spec.js

 import Vue from 'vue';
 import DiffWithNote from '~/notes/components/diff_with_note.vue';
 import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
-import mountComponent from '../../helpers/vue_mount_component_helper';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
 const discussionFixture = 'merge_requests/diff_discussion.json';
 const imageDiscussionFixture = 'merge_requests/image_diff_discussion.json';

spec/javascripts/pages/labels/components/promote_label_modal_spec.js

@@ -2,7 +2,7 @@ import Vue from 'vue';
 import promoteLabelModal from '~/pages/projects/labels/components/promote_label_modal.vue';
 import eventHub from '~/pages/projects/labels/event_hub';
 import axios from '~/lib/utils/axios_utils';
-import mountComponent from '../../../helpers/vue_mount_component_helper';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
 describe('Promote label modal', () => {
   let vm;

spec/javascripts/pages/milestones/shared/components/promote_milestone_modal_spec.js

@@ -2,7 +2,7 @@ import Vue from 'vue';
 import promoteMilestoneModal from '~/pages/milestones/shared/components/promote_milestone_modal.vue';
 import eventHub from '~/pages/milestones/shared/event_hub';
 import axios from '~/lib/utils/axios_utils';
-import mountComponent from '../../../../helpers/vue_mount_component_helper';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
 describe('Promote milestone modal', () => {
   let vm;

spec/javascripts/vue_shared/components/markdown/toolbar_spec.js

+import Vue from 'vue';
+import toolbar from '~/vue_shared/components/markdown/toolbar.vue';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
+
+describe('toolbar', () => {
+  let vm;
+  const Toolbar = Vue.extend(toolbar);
+  const props = {
+    markdownDocsPath: '',
+  };
+
+  afterEach(() => {
+    vm.$destroy();
+  });
+
+  describe('user can attach file', () => {
+    beforeEach(() => {
+      vm = mountComponent(Toolbar, props);
+    });
+
+    it('should render uploading-container', () => {
+      expect(vm.$el.querySelector('.uploading-container')).not.toBeNull();
+    });
+  });
+
+  describe('user cannot attach file', () => {
+    beforeEach(() => {
+      vm = mountComponent(Toolbar, Object.assign({}, props, {
+        canAttachFile: false,
+      }));
+    });
+
+    it('should not render uploading-container', () => {
+      expect(vm.$el.querySelector('.uploading-container')).toBeNull();
+    });
+  });
+});

spec/javascripts/vue_shared/components/sidebar/labels_select/base_spec.js

@@ -3,9 +3,9 @@ import Vue from 'vue';
 import LabelsSelect from '~/labels_select';
 import baseComponent from '~/vue_shared/components/sidebar/labels_select/base.vue';
 
-import { mockConfig, mockLabels } from './mock_data';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
-import mountComponent from '../../../../helpers/vue_mount_component_helper';
+import { mockConfig, mockLabels } from './mock_data';
 
 const createComponent = (config = mockConfig) => {
   const Component = Vue.extend(baseComponent);

spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_button_spec.js

@@ -2,9 +2,9 @@ import Vue from 'vue';
 
 import dropdownButtonComponent from '~/vue_shared/components/sidebar/labels_select/dropdown_button.vue';
 
-import { mockConfig, mockLabels } from './mock_data';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
-import mountComponent from '../../../../helpers/vue_mount_component_helper';
+import { mockConfig, mockLabels } from './mock_data';
 
 const componentConfig = Object.assign({}, mockConfig, {
   fieldName: 'label_id[]',

spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_create_label_spec.js

@@ -2,9 +2,9 @@ import Vue from 'vue';
 
 import dropdownCreateLabelComponent from '~/vue_shared/components/sidebar/labels_select/dropdown_create_label.vue';
 
-import { mockSuggestedColors } from './mock_data';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
-import mountComponent from '../../../../helpers/vue_mount_component_helper';
+import { mockSuggestedColors } from './mock_data';
 
 const createComponent = (headerTitle) => {
   const Component = Vue.extend(dropdownCreateLabelComponent);

spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_footer_spec.js

@@ -2,9 +2,9 @@ import Vue from 'vue';
 
 import dropdownFooterComponent from '~/vue_shared/components/sidebar/labels_select/dropdown_footer.vue';
 
-import { mockConfig } from './mock_data';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
-import mountComponent from '../../../../helpers/vue_mount_component_helper';
+import { mockConfig } from './mock_data';
 
 const createComponent = (
   labelsWebUrl = mockConfig.labelsWebUrl,

spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_header_spec.js

@@ -2,7 +2,7 @@ import Vue from 'vue';
 
 import dropdownHeaderComponent from '~/vue_shared/components/sidebar/labels_select/dropdown_header.vue';
 
-import mountComponent from '../../../../helpers/vue_mount_component_helper';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
 const createComponent = () => {
   const Component = Vue.extend(dropdownHeaderComponent);

spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_hidden_input_spec.js

@@ -2,9 +2,9 @@ import Vue from 'vue';
 
 import dropdownHiddenInputComponent from '~/vue_shared/components/sidebar/labels_select/dropdown_hidden_input.vue';
 
-import { mockLabels } from './mock_data';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
-import mountComponent from '../../../../helpers/vue_mount_component_helper';
+import { mockLabels } from './mock_data';
 
 const createComponent = (name = 'label_id[]', label = mockLabels[0]) => {
   const Component = Vue.extend(dropdownHiddenInputComponent);

spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_search_input_spec.js

@@ -2,7 +2,7 @@ import Vue from 'vue';
 
 import dropdownSearchInputComponent from '~/vue_shared/components/sidebar/labels_select/dropdown_search_input.vue';
 
-import mountComponent from '../../../../helpers/vue_mount_component_helper';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
 const createComponent = () => {
   const Component = Vue.extend(dropdownSearchInputComponent);

spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_title_spec.js

@@ -2,7 +2,7 @@ import Vue from 'vue';
 
 import dropdownTitleComponent from '~/vue_shared/components/sidebar/labels_select/dropdown_title.vue';
 
-import mountComponent from '../../../../helpers/vue_mount_component_helper';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
 const createComponent = (canEdit = true) => {
   const Component = Vue.extend(dropdownTitleComponent);

spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_value_collapsed_spec.js

@@ -2,9 +2,9 @@ import Vue from 'vue';
 
 import dropdownValueCollapsedComponent from '~/vue_shared/components/sidebar/labels_select/dropdown_value_collapsed.vue';
 
-import { mockLabels } from './mock_data';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
-import mountComponent from '../../../../helpers/vue_mount_component_helper';
+import { mockLabels } from './mock_data';
 
 const createComponent = (labels = mockLabels) => {
   const Component = Vue.extend(dropdownValueCollapsedComponent);

spec/javascripts/vue_shared/components/sidebar/labels_select/dropdown_value_spec.js

@@ -2,9 +2,9 @@ import Vue from 'vue';
 
 import dropdownValueComponent from '~/vue_shared/components/sidebar/labels_select/dropdown_value.vue';
 
-import { mockConfig, mockLabels } from './mock_data';
+import mountComponent from 'spec/helpers/vue_mount_component_helper';
 
-import mountComponent from '../../../../helpers/vue_mount_component_helper';
+import { mockConfig, mockLabels } from './mock_data';
 
 const createComponent = (
   labels = mockLabels,