diff options
Diffstat (limited to 'spec/frontend/admin/analytics/devops_score')
3 files changed, 87 insertions, 9 deletions
diff --git a/spec/frontend/admin/analytics/devops_score/components/devops_score_callout_spec.js b/spec/frontend/admin/analytics/devops_score/components/devops_score_callout_spec.js new file mode 100644 index 00000000000..ee14e002f1b --- /dev/null +++ b/spec/frontend/admin/analytics/devops_score/components/devops_score_callout_spec.js @@ -0,0 +1,67 @@ +import { GlBanner } from '@gitlab/ui'; +import { shallowMount } from '@vue/test-utils'; +import DevopsScoreCallout from '~/analytics/devops_report/components/devops_score_callout.vue'; +import { INTRO_COOKIE_KEY } from '~/analytics/devops_report/constants'; +import * as utils from '~/lib/utils/common_utils'; +import { devopsReportDocsPath, devopsScoreIntroImagePath } from '../mock_data'; + +describe('DevopsScoreCallout', () => { + let wrapper; + + const createComponent = () => { + wrapper = shallowMount(DevopsScoreCallout, { + provide: { + devopsReportDocsPath, + devopsScoreIntroImagePath, + }, + }); + }; + + const findBanner = () => wrapper.findComponent(GlBanner); + + afterEach(() => { + wrapper.destroy(); + }); + + describe('with no cookie set', () => { + beforeEach(() => { + utils.setCookie = jest.fn(); + + createComponent(); + }); + + it('displays the banner', () => { + expect(findBanner().exists()).toBe(true); + }); + + it('does not call setCookie', () => { + expect(utils.setCookie).not.toHaveBeenCalled(); + }); + + describe('when the close button is clicked', () => { + beforeEach(() => { + findBanner().vm.$emit('close'); + }); + + it('sets the dismissed cookie', () => { + expect(utils.setCookie).toHaveBeenCalledWith(INTRO_COOKIE_KEY, 'true'); + }); + + it('hides the banner', () => { + expect(findBanner().exists()).toBe(false); + }); + }); + }); + + describe('with the dismissed cookie set', () => { + beforeEach(() => { + jest.spyOn(utils, 'getCookie').mockReturnValue('true'); + + createComponent(); + }); + + it('hides the banner', () => { + expect(findBanner().exists()).toBe(false); + }); + }); +}); diff --git a/spec/frontend/admin/analytics/devops_score/components/devops_score_spec.js b/spec/frontend/admin/analytics/devops_score/components/devops_score_spec.js index 7c20bbe21c8..8f8dac977de 100644 --- a/spec/frontend/admin/analytics/devops_score/components/devops_score_spec.js +++ b/spec/frontend/admin/analytics/devops_score/components/devops_score_spec.js @@ -1,14 +1,10 @@ -import { GlTable, GlBadge, GlEmptyState, GlLink } from '@gitlab/ui'; +import { GlTable, GlBadge, GlEmptyState } from '@gitlab/ui'; import { GlSingleStat } from '@gitlab/ui/dist/charts'; import { mount } from '@vue/test-utils'; import { extendedWrapper } from 'helpers/vue_test_utils_helper'; import DevopsScore from '~/analytics/devops_report/components/devops_score.vue'; -import { - devopsScoreMetricsData, - devopsReportDocsPath, - noDataImagePath, - devopsScoreTableHeaders, -} from '../mock_data'; +import DevopsScoreCallout from '~/analytics/devops_report/components/devops_score_callout.vue'; +import { devopsScoreMetricsData, noDataImagePath, devopsScoreTableHeaders } from '../mock_data'; describe('DevopsScore', () => { let wrapper; @@ -18,7 +14,6 @@ describe('DevopsScore', () => { mount(DevopsScore, { provide: { devopsScoreMetrics, - devopsReportDocsPath, noDataImagePath, }, }), @@ -30,12 +25,19 @@ describe('DevopsScore', () => { const findCol = (testId) => findTable().find(`[data-testid="${testId}"]`); const findUsageCol = () => findCol('usageCol'); const findDevopsScoreApp = () => wrapper.findByTestId('devops-score-app'); + const bannerExists = () => wrapper.findComponent(DevopsScoreCallout).exists(); + const findDocsLink = () => + wrapper.findByRole('link', { name: 'See example DevOps Score page in our documentation.' }); describe('with no data', () => { beforeEach(() => { createComponent({ devopsScoreMetrics: {} }); }); + it('includes the DevopsScoreCallout component ', () => { + expect(bannerExists()).toBe(true); + }); + describe('empty state', () => { it('displays the empty state', () => { expect(findEmptyState().exists()).toBe(true); @@ -48,7 +50,10 @@ describe('DevopsScore', () => { }); it('contains a link to the feature documentation', () => { - expect(wrapper.findComponent(GlLink).exists()).toBe(true); + expect(findDocsLink().exists()).toBe(true); + expect(findDocsLink().attributes('href')).toBe( + '/help/user/admin_area/analytics/dev_ops_report', + ); }); }); @@ -62,6 +67,10 @@ describe('DevopsScore', () => { createComponent(); }); + it('includes the DevopsScoreCallout component ', () => { + expect(bannerExists()).toBe(true); + }); + it('does not display the empty state', () => { expect(findEmptyState().exists()).toBe(false); }); diff --git a/spec/frontend/admin/analytics/devops_score/mock_data.js b/spec/frontend/admin/analytics/devops_score/mock_data.js index ae0c01a2661..e8f8b778ffa 100644 --- a/spec/frontend/admin/analytics/devops_score/mock_data.js +++ b/spec/frontend/admin/analytics/devops_score/mock_data.js @@ -44,3 +44,5 @@ export const devopsScoreMetricsData = { export const devopsReportDocsPath = 'docs-path'; export const noDataImagePath = 'image-path'; + +export const devopsScoreIntroImagePath = 'image-path'; |