Add latest changes from gitlab-org/gitlab@master

10 files changed, 240 insertions, 50 deletions

diff --git a/spec/frontend/diffs/store/mutations_spec.js b/spec/frontend/diffs/store/mutations_spec.js
index ad05f27b325..c44feaf4b63 100644
--- a/spec/frontend/diffs/store/mutations_spec.js
+++ b/spec/frontend/diffs/store/mutations_spec.js
@@ -796,11 +796,13 @@ describe('DiffsStoreMutations', () => {
     it('sets showWhitespace', () => {
       const state = {
         showWhitespace: true,
+        diffFiles: ['test'],
       };
 
       mutations[types.SET_SHOW_WHITESPACE](state, false);
 
       expect(state.showWhitespace).toBe(false);
+      expect(state.diffFiles).toEqual([]);
     });
   });
 
diff --git a/spec/frontend/header_spec.js b/spec/frontend/header_spec.js
index 00b5b306d66..0a74799283a 100644
--- a/spec/frontend/header_spec.js
+++ b/spec/frontend/header_spec.js
@@ -1,53 +1,87 @@
 import $ from 'jquery';
-import initTodoToggle from '~/header';
+import initTodoToggle, { initNavUserDropdownTracking } from '~/header';
+import { mockTracking, unmockTracking } from 'helpers/tracking_helper';
 
 describe('Header', () => {
-  const todosPendingCount = '.todos-count';
-  const fixtureTemplate = 'issues/open-issue.html';
+  describe('Todos notification', () => {
+    const todosPendingCount = '.todos-count';
+    const fixtureTemplate = 'issues/open-issue.html';
 
-  function isTodosCountHidden() {
-    return $(todosPendingCount).hasClass('hidden');
-  }
+    function isTodosCountHidden() {
+      return $(todosPendingCount).hasClass('hidden');
+    }
 
-  function triggerToggle(newCount) {
-    $(document).trigger('todo:toggle', newCount);
-  }
+    function triggerToggle(newCount) {
+      $(document).trigger('todo:toggle', newCount);
+    }
 
-  preloadFixtures(fixtureTemplate);
-  beforeEach(() => {
-    initTodoToggle();
-    loadFixtures(fixtureTemplate);
-  });
+    preloadFixtures(fixtureTemplate);
+    beforeEach(() => {
+      initTodoToggle();
+      loadFixtures(fixtureTemplate);
+    });
 
-  it('should update todos-count after receiving the todo:toggle event', () => {
-    triggerToggle(5);
+    it('should update todos-count after receiving the todo:toggle event', () => {
+      triggerToggle(5);
 
-    expect($(todosPendingCount).text()).toEqual('5');
-  });
+      expect($(todosPendingCount).text()).toEqual('5');
+    });
 
-  it('should hide todos-count when it is 0', () => {
-    triggerToggle(0);
+    it('should hide todos-count when it is 0', () => {
+      triggerToggle(0);
 
-    expect(isTodosCountHidden()).toEqual(true);
-  });
+      expect(isTodosCountHidden()).toEqual(true);
+    });
+
+    it('should show todos-count when it is more than 0', () => {
+      triggerToggle(10);
+
+      expect(isTodosCountHidden()).toEqual(false);
+    });
+
+    describe('when todos-count is 1000', () => {
+      beforeEach(() => {
+        triggerToggle(1000);
+      });
 
-  it('should show todos-count when it is more than 0', () => {
-    triggerToggle(10);
+      it('should show todos-count', () => {
+        expect(isTodosCountHidden()).toEqual(false);
+      });
 
-    expect(isTodosCountHidden()).toEqual(false);
+      it('should show 99+ for todos-count', () => {
+        expect($(todosPendingCount).text()).toEqual('99+');
+      });
+    });
   });
 
-  describe('when todos-count is 1000', () => {
+  describe('Track user dropdown open', () => {
+    let trackingSpy;
+
     beforeEach(() => {
-      triggerToggle(1000);
+      setFixtures(`
+      <li class="js-nav-user-dropdown">
+        <a class="js-buy-ci-minutes-link" data-track-event="click_buy_ci_minutes" data-track-label="free" data-track-property="user_dropdown">Buy CI minutes
+        </a>
+      </li>`);
+
+      trackingSpy = mockTracking('_category_', $('.js-nav-user-dropdown').element, jest.spyOn);
+      document.body.dataset.page = 'some:page';
+
+      initNavUserDropdownTracking();
     });
 
-    it('should show todos-count', () => {
-      expect(isTodosCountHidden()).toEqual(false);
+    afterEach(() => {
+      unmockTracking();
     });
 
-    it('should show 99+ for todos-count', () => {
-      expect($(todosPendingCount).text()).toEqual('99+');
+    it('sends a tracking event when the dropdown is opened and contains Buy CI minutes link', () => {
+      $('.js-nav-user-dropdown').trigger('shown.bs.dropdown');
+
+      expect(trackingSpy).toHaveBeenCalledTimes(1);
+      expect(trackingSpy).toHaveBeenCalledWith(undefined, 'show_buy_ci_minutes', {
+        label: 'free',
+        property: 'user_dropdown',
+      });
     });
   });
 });
diff --git a/spec/frontend/helpers/monitor_helper_spec.js b/spec/frontend/helpers/monitor_helper_spec.js
index 0798ca580e2..f7163d496d2 100644
--- a/spec/frontend/helpers/monitor_helper_spec.js
+++ b/spec/frontend/helpers/monitor_helper_spec.js
@@ -56,6 +56,32 @@ describe('monitor helper', () => {
       expect(result.name).toEqual('brpop');
     });
 
+    it('supports a multi metric label template expression', () => {
+      const config = {
+        ...defaultConfig,
+        name: '',
+      };
+
+      const [result] = monitorHelper.makeDataSeries(
+        [
+          {
+            metric: {
+              backend: 'HA Server',
+              frontend: 'BA Server',
+              app: 'prometheus',
+              instance: 'k8 cluster 1',
+            },
+            values: series,
+          },
+        ],
+        config,
+      );
+
+      expect(result.name).toBe(
+        'backend: HA Server, frontend: BA Server, app: prometheus, instance: k8 cluster 1',
+      );
+    });
+
     it('supports space-padded template expressions', () => {
       const config = {
         ...defaultConfig,
diff --git a/spec/frontend/monitoring/store/utils_spec.js b/spec/frontend/monitoring/store/utils_spec.js
index e1c8e694122..fcc5614850b 100644
--- a/spec/frontend/monitoring/store/utils_spec.js
+++ b/spec/frontend/monitoring/store/utils_spec.js
@@ -251,7 +251,7 @@ describe('mapToDashboardViewModel', () => {
     };
 
     it('creates a metric', () => {
-      const dashboard = dashboardWithMetric({});
+      const dashboard = dashboardWithMetric({ label: 'Panel Label' });
 
       expect(getMappedMetric(dashboard)).toEqual({
         label: expect.any(String),
@@ -268,11 +268,11 @@ describe('mapToDashboardViewModel', () => {
       expect(getMappedMetric(dashboard).metricId).toEqual('1_http_responses');
     });
 
-    it('creates a metric with a default label', () => {
+    it('creates a metric without a default label', () => {
       const dashboard = dashboardWithMetric({});
 
       expect(getMappedMetric(dashboard)).toMatchObject({
-        label: defaultLabel,
+        label: undefined,
       });
     });
 
diff --git a/spec/frontend/repository/router_spec.js b/spec/frontend/repository/router_spec.js
index 8f3ac53c37a..6944b23558a 100644
--- a/spec/frontend/repository/router_spec.js
+++ b/spec/frontend/repository/router_spec.js
@@ -4,14 +4,15 @@ import createRouter from '~/repository/router';
 
 describe('Repository router spec', () => {
   it.each`
-    path                           | component    | componentName
-    ${'/'}                         | ${IndexPage} | ${'IndexPage'}
-    ${'/tree/master'}              | ${TreePage}  | ${'TreePage'}
-    ${'/-/tree/master'}            | ${TreePage}  | ${'TreePage'}
-    ${'/-/tree/master/app/assets'} | ${TreePage}  | ${'TreePage'}
-    ${'/-/tree/123/app/assets'}    | ${null}      | ${'null'}
-  `('sets component as $componentName for path "$path"', ({ path, component }) => {
-    const router = createRouter('', 'master');
+    path                                     | branch              | component    | componentName
+    ${'/'}                                   | ${'master'}         | ${IndexPage} | ${'IndexPage'}
+    ${'/tree/master'}                        | ${'master'}         | ${TreePage}  | ${'TreePage'}
+    ${'/-/tree/master'}                      | ${'master'}         | ${TreePage}  | ${'TreePage'}
+    ${'/-/tree/master/app/assets'}           | ${'master'}         | ${TreePage}  | ${'TreePage'}
+    ${'/-/tree/feature/test-%23/app/assets'} | ${'feature/test-#'} | ${TreePage}  | ${'TreePage'}
+    ${'/-/tree/123/app/assets'}              | ${'master'}         | ${null}      | ${'null'}
+  `('sets component as $componentName for path "$path"', ({ path, component, branch }) => {
+    const router = createRouter('', branch);
 
     const componentsForRoute = router.getMatchedComponents(path);
 
diff --git a/spec/frontend/static_site_editor/components/publish_toolbar_spec.js b/spec/frontend/static_site_editor/components/publish_toolbar_spec.js
new file mode 100644
index 00000000000..55e30825621
--- /dev/null
+++ b/spec/frontend/static_site_editor/components/publish_toolbar_spec.js
@@ -0,0 +1,43 @@
+import { shallowMount } from '@vue/test-utils';
+import { GlNewButton } from '@gitlab/ui';
+
+import PublishToolbar from '~/static_site_editor/components/publish_toolbar.vue';
+
+describe('Static Site Editor Toolbar', () => {
+  let wrapper;
+
+  const buildWrapper = (propsData = {}) => {
+    wrapper = shallowMount(PublishToolbar, {
+      propsData: {
+        saveable: false,
+        ...propsData,
+      },
+    });
+  };
+
+  const findSaveChangesButton = () => wrapper.find(GlNewButton);
+
+  beforeEach(() => {
+    buildWrapper();
+  });
+
+  afterEach(() => {
+    wrapper.destroy();
+  });
+
+  it('renders Submit Changes button', () => {
+    expect(findSaveChangesButton().exists()).toBe(true);
+  });
+
+  it('disables Submit Changes button', () => {
+    expect(findSaveChangesButton().attributes('disabled')).toBe('true');
+  });
+
+  describe('when saveable', () => {
+    it('enables Submit Changes button', () => {
+      buildWrapper({ saveable: true });
+
+      expect(findSaveChangesButton().attributes('disabled')).toBeFalsy();
+    });
+  });
+});
diff --git a/spec/frontend/static_site_editor/components/static_site_editor_spec.js b/spec/frontend/static_site_editor/components/static_site_editor_spec.js
index cde95d0a21e..ec984102250 100644
--- a/spec/frontend/static_site_editor/components/static_site_editor_spec.js
+++ b/spec/frontend/static_site_editor/components/static_site_editor_spec.js
@@ -7,6 +7,7 @@ import createState from '~/static_site_editor/store/state';
 
 import StaticSiteEditor from '~/static_site_editor/components/static_site_editor.vue';
 import EditArea from '~/static_site_editor/components/edit_area.vue';
+import PublishToolbar from '~/static_site_editor/components/publish_toolbar.vue';
 
 const localVue = createLocalVue();
 
@@ -16,18 +17,31 @@ describe('StaticSiteEditor', () => {
   let wrapper;
   let store;
   let loadContentActionMock;
+  let setContentActionMock;
 
   const buildStore = ({ initialState, getters } = {}) => {
     loadContentActionMock = jest.fn();
+    setContentActionMock = jest.fn();
 
     store = new Vuex.Store({
       state: createState(initialState),
       getters: {
         isContentLoaded: () => false,
+        contentChanged: () => false,
         ...getters,
       },
       actions: {
         loadContent: loadContentActionMock,
+        setContent: setContentActionMock,
+      },
+    });
+  };
+  const buildContentLoadedStore = ({ initialState, getters } = {}) => {
+    buildStore({
+      initialState,
+      getters: {
+        isContentLoaded: () => true,
+        ...getters,
       },
     });
   };
@@ -40,6 +54,8 @@ describe('StaticSiteEditor', () => {
   };
 
   const findEditArea = () => wrapper.find(EditArea);
+  const findPublishToolbar = () => wrapper.find(PublishToolbar);
+  const findSkeletonLoader = () => wrapper.find(GlSkeletonLoader);
 
   beforeEach(() => {
     buildStore();
@@ -54,6 +70,10 @@ describe('StaticSiteEditor', () => {
     it('does not render edit area', () => {
       expect(findEditArea().exists()).toBe(false);
     });
+
+    it('does not render toolbar', () => {
+      expect(findPublishToolbar().exists()).toBe(false);
+    });
   });
 
   describe('when content is loaded', () => {
@@ -68,19 +88,49 @@ describe('StaticSiteEditor', () => {
       expect(findEditArea().exists()).toBe(true);
     });
 
+    it('does not render skeleton loader', () => {
+      expect(findSkeletonLoader().exists()).toBe(false);
+    });
+
     it('passes page content to edit area', () => {
       expect(findEditArea().props('value')).toBe(content);
     });
+
+    it('renders toolbar', () => {
+      expect(findPublishToolbar().exists()).toBe(true);
+    });
+  });
+
+  it('sets toolbar as saveable when content changes', () => {
+    buildContentLoadedStore({
+      getters: {
+        contentChanged: () => true,
+      },
+    });
+    buildWrapper();
+
+    expect(findPublishToolbar().props('saveable')).toBe(true);
   });
 
-  it('displays skeleton loader while loading content', () => {
+  it('displays skeleton loader when loading content', () => {
     buildStore({ initialState: { isLoadingContent: true } });
     buildWrapper();
 
-    expect(wrapper.find(GlSkeletonLoader).exists()).toBe(true);
+    expect(findSkeletonLoader().exists()).toBe(true);
   });
 
   it('dispatches load content action', () => {
     expect(loadContentActionMock).toHaveBeenCalled();
   });
+
+  it('dispatches setContent action when edit area emits input event', () => {
+    const content = 'new content';
+
+    buildContentLoadedStore();
+    buildWrapper();
+
+    findEditArea().vm.$emit('input', content);
+
+    expect(setContentActionMock).toHaveBeenCalledWith(expect.anything(), content, undefined);
+  });
 });
diff --git a/spec/frontend/static_site_editor/store/actions_spec.js b/spec/frontend/static_site_editor/store/actions_spec.js
index 98d7d0d2c2d..4ad1e798ccd 100644
--- a/spec/frontend/static_site_editor/store/actions_spec.js
+++ b/spec/frontend/static_site_editor/store/actions_spec.js
@@ -73,4 +73,15 @@ describe('Static Site Editor Store actions', () => {
       });
     });
   });
+
+  describe('setContent', () => {
+    it('commits setContent mutation', () => {
+      testAction(actions.setContent, content, state, [
+        {
+          type: mutationTypes.SET_CONTENT,
+          payload: content,
+        },
+      ]);
+    });
+  });
 });
diff --git a/spec/frontend/static_site_editor/store/getters_spec.js b/spec/frontend/static_site_editor/store/getters_spec.js
index 8800216f3b0..1b482db9366 100644
--- a/spec/frontend/static_site_editor/store/getters_spec.js
+++ b/spec/frontend/static_site_editor/store/getters_spec.js
@@ -1,15 +1,29 @@
 import createState from '~/static_site_editor/store/state';
-import { isContentLoaded } from '~/static_site_editor/store/getters';
+import { isContentLoaded, contentChanged } from '~/static_site_editor/store/getters';
 import { sourceContent as content } from '../mock_data';
 
 describe('Static Site Editor Store getters', () => {
   describe('isContentLoaded', () => {
-    it('returns true when content is not empty', () => {
-      expect(isContentLoaded(createState({ content }))).toBe(true);
+    it('returns true when originalContent is not empty', () => {
+      expect(isContentLoaded(createState({ originalContent: content }))).toBe(true);
     });
 
-    it('returns false when content is empty', () => {
-      expect(isContentLoaded(createState({ content: '' }))).toBe(false);
+    it('returns false when originalContent is empty', () => {
+      expect(isContentLoaded(createState({ originalContent: '' }))).toBe(false);
+    });
+  });
+
+  describe('contentChanged', () => {
+    it('returns true when content and originalContent are different', () => {
+      const state = createState({ content, originalContent: 'something else' });
+
+      expect(contentChanged(state)).toBe(true);
+    });
+
+    it('returns false when content and originalContent are the same', () => {
+      const state = createState({ content, originalContent: content });
+
+      expect(contentChanged(state)).toBe(false);
     });
   });
 });
diff --git a/spec/frontend/static_site_editor/store/mutations_spec.js b/spec/frontend/static_site_editor/store/mutations_spec.js
index c7055fbb2f0..db3a1081af5 100644
--- a/spec/frontend/static_site_editor/store/mutations_spec.js
+++ b/spec/frontend/static_site_editor/store/mutations_spec.js
@@ -35,8 +35,9 @@ describe('Static Site Editor Store mutations', () => {
       expect(state.title).toBe(payload.title);
     });
 
-    it('sets content', () => {
+    it('sets originalContent and content', () => {
       expect(state.content).toBe(payload.content);
+      expect(state.originalContent).toBe(payload.content);
     });
   });
 
@@ -49,4 +50,12 @@ describe('Static Site Editor Store mutations', () => {
       expect(state.isLoadingContent).toBe(false);
     });
   });
+
+  describe('setContent', () => {
+    it('sets content', () => {
+      mutations[types.SET_CONTENT](state, content);
+
+      expect(state.content).toBe(content);
+    });
+  });
 });