Add latest changes from gitlab-org/gitlab@master

2 files changed, 81 insertions, 27 deletions

diff --git a/spec/frontend/pipelines/notification/pipeline_notification_spec.js b/spec/frontend/pipelines/notification/pipeline_notification_spec.js
new file mode 100644
index 00000000000..79aa337ba9d
--- /dev/null
+++ b/spec/frontend/pipelines/notification/pipeline_notification_spec.js
@@ -0,0 +1,79 @@
+import { GlBanner } from '@gitlab/ui';
+import { createLocalVue, shallowMount } from '@vue/test-utils';
+import { nextTick } from 'vue';
+import VueApollo from 'vue-apollo';
+import createMockApollo from 'helpers/mock_apollo_helper';
+import PipelineNotification from '~/pipelines/components/notification/pipeline_notification.vue';
+import getUserCallouts from '~/pipelines/graphql/queries/get_user_callouts.query.graphql';
+
+describe('Pipeline notification', () => {
+  const localVue = createLocalVue();
+
+  let wrapper;
+  const dagDocPath = 'my/dag/path';
+
+  const createWrapper = (apolloProvider) => {
+    return shallowMount(PipelineNotification, {
+      localVue,
+      provide: {
+        dagDocPath,
+      },
+      apolloProvider,
+    });
+  };
+
+  const createWrapperWithApollo = async ({ callouts = [], isLoading = false } = {}) => {
+    localVue.use(VueApollo);
+
+    const mappedCallouts = callouts.map((callout) => {
+      return { featureName: callout, __typename: 'UserCallout' };
+    });
+
+    const mockCalloutsResponse = {
+      data: {
+        currentUser: {
+          id: 45,
+          __typename: 'User',
+          callouts: {
+            id: 5,
+            __typename: 'UserCalloutConnection',
+            nodes: mappedCallouts,
+          },
+        },
+      },
+    };
+    const getUserCalloutsHandler = jest.fn().mockResolvedValue(mockCalloutsResponse);
+    const requestHandlers = [[getUserCallouts, getUserCalloutsHandler]];
+
+    const apolloWrapper = createWrapper(createMockApollo(requestHandlers));
+    if (!isLoading) {
+      await nextTick();
+    }
+
+    return apolloWrapper;
+  };
+
+  const findBanner = () => wrapper.findComponent(GlBanner);
+
+  afterEach(() => {
+    wrapper.destroy();
+  });
+
+  it('shows the banner if the user has never seen it', async () => {
+    wrapper = await createWrapperWithApollo({ callouts: ['random'] });
+
+    expect(findBanner().exists()).toBe(true);
+  });
+
+  it('does not show the banner while the user callout query is loading', async () => {
+    wrapper = await createWrapperWithApollo({ callouts: ['random'], isLoading: true });
+
+    expect(findBanner().exists()).toBe(false);
+  });
+
+  it('does not show the banner if the user has previously dismissed it', async () => {
+    wrapper = await createWrapperWithApollo({ callouts: ['pipeline_needs_banner'.toUpperCase()] });
+
+    expect(findBanner().exists()).toBe(false);
+  });
+});
diff --git a/spec/frontend/pipelines/pipeline_graph/pipeline_graph_spec.js b/spec/frontend/pipelines/pipeline_graph/pipeline_graph_spec.js
index 6deec06e344..258f2bda829 100644
--- a/spec/frontend/pipelines/pipeline_graph/pipeline_graph_spec.js
+++ b/spec/frontend/pipelines/pipeline_graph/pipeline_graph_spec.js
@@ -1,12 +1,12 @@
 import { GlAlert } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
-import { CI_CONFIG_STATUS_INVALID, CI_CONFIG_STATUS_VALID } from '~/pipeline_editor/constants';
+import { CI_CONFIG_STATUS_VALID } from '~/pipeline_editor/constants';
 import LinksInner from '~/pipelines/components/graph_shared/links_inner.vue';
 import LinksLayer from '~/pipelines/components/graph_shared/links_layer.vue';
 import JobPill from '~/pipelines/components/pipeline_graph/job_pill.vue';
 import PipelineGraph from '~/pipelines/components/pipeline_graph/pipeline_graph.vue';
 import StagePill from '~/pipelines/components/pipeline_graph/stage_pill.vue';
-import { DRAW_FAILURE, EMPTY_PIPELINE_DATA, INVALID_CI_CONFIG } from '~/pipelines/constants';
+import { DRAW_FAILURE } from '~/pipelines/constants';
 import { invalidNeedsData, pipelineData, singleStageData } from './mock_data';
 
 describe('pipeline graph component', () => {
@@ -42,31 +42,6 @@ describe('pipeline graph component', () => {
     wrapper.destroy();
   });
 
-  describe('with no data', () => {
-    beforeEach(() => {
-      wrapper = createComponent({ pipelineData: {} });
-    });
-
-    it('does not render the graph', () => {
-      expect(wrapper.text()).toBe(wrapper.vm.$options.errorTexts[EMPTY_PIPELINE_DATA]);
-      expect(findPipelineGraph().exists()).toBe(false);
-      expect(findAllStagePills()).toHaveLength(0);
-      expect(findAllJobPills()).toHaveLength(0);
-    });
-  });
-
-  describe('with `INVALID` status', () => {
-    beforeEach(() => {
-      wrapper = createComponent({ pipelineData: { status: CI_CONFIG_STATUS_INVALID } });
-    });
-
-    it('renders an error message and does not render the graph', () => {
-      expect(findAlert().exists()).toBe(true);
-      expect(findAlert().text()).toBe(wrapper.vm.$options.errorTexts[INVALID_CI_CONFIG]);
-      expect(findPipelineGraph().exists()).toBe(false);
-    });
-  });
-
   describe('with `VALID` status', () => {
     beforeEach(() => {
       wrapper = createComponent({