128 lines
3.4 KiB
Plaintext
128 lines
3.4 KiB
Plaintext
import { shallowMount } from '@vue/test-utils';
|
|
import Popover from '~/blob/suggest_gitlab_ci_yml/components/popover.vue';
|
|
import { mockTracking, unmockTracking, triggerEvent } from 'helpers/tracking_helper';
|
|
import * as utils from '~/lib/utils/common_utils';
|
|
import { GlButton } from '@gitlab/ui';
|
|
|
|
jest.mock('~/lib/utils/common_utils', () => ({
|
|
...jest.requireActual('~/lib/utils/common_utils'),
|
|
scrollToElement: jest.fn(),
|
|
}));
|
|
|
|
const target = 'gitlab-ci-yml-selector';
|
|
const dismissKey = '99';
|
|
const defaultTrackLabel = 'suggest_gitlab_ci_yml';
|
|
const commitTrackLabel = 'suggest_commit_first_project_gitlab_ci_yml';
|
|
|
|
const dismissCookie = 'suggest_gitlab_ci_yml_99';
|
|
const humanAccess = 'owner';
|
|
|
|
describe('Suggest gitlab-ci.yml Popover', () => {
|
|
let wrapper;
|
|
|
|
function createWrapper(trackLabel) {
|
|
wrapper = shallowMount(Popover, {
|
|
propsData: {
|
|
target,
|
|
trackLabel,
|
|
dismissKey,
|
|
humanAccess,
|
|
},
|
|
stubs: {
|
|
GlButton,
|
|
GlIcon
|
|
}
|
|
slots: {
|
|
title: '<gl-button><gl-icon /> </gl-button>',
|
|
}
|
|
});
|
|
}
|
|
|
|
afterEach(() => {
|
|
wrapper.destroy();
|
|
wrapper = null;
|
|
});
|
|
|
|
describe('when no dismiss cookie is set', () => {
|
|
beforeEach(() => {
|
|
createWrapper(defaultTrackLabel);
|
|
});
|
|
|
|
it('sets popoverDismissed to false', () => {
|
|
expect(wrapper.vm.popoverDismissed).toEqual(false);
|
|
});
|
|
});
|
|
|
|
describe('when the dismiss cookie is set', () => {
|
|
beforeEach(() => {
|
|
utils.setCookie(dismissCookie, true);
|
|
|
|
createWrapper(defaultTrackLabel);
|
|
});
|
|
|
|
it('sets popoverDismissed to true', () => {
|
|
expect(wrapper.vm.popoverDismissed).toEqual(true);
|
|
});
|
|
|
|
afterEach(() => {
|
|
utils.removeCookie(dismissCookie);
|
|
});
|
|
});
|
|
|
|
describe('tracking', () => {
|
|
let trackingSpy;
|
|
|
|
beforeEach(() => {
|
|
createWrapper(commitTrackLabel);
|
|
trackingSpy = mockTracking('_category_', wrapper.element, jest.spyOn);
|
|
});
|
|
|
|
afterEach(() => {
|
|
unmockTracking();
|
|
});
|
|
|
|
it('sends a tracking event with the expected properties for the popover being viewed', () => {
|
|
const expectedCategory = undefined;
|
|
const expectedAction = undefined;
|
|
const expectedLabel = 'suggest_commit_first_project_gitlab_ci_yml';
|
|
const expectedProperty = 'owner';
|
|
|
|
document.body.dataset.page = 'projects:blob:new';
|
|
|
|
wrapper.vm.trackOnShow();
|
|
|
|
expect(trackingSpy).toHaveBeenCalledWith(expectedCategory, expectedAction, {
|
|
label: expectedLabel,
|
|
property: expectedProperty,
|
|
});
|
|
});
|
|
|
|
it('sends a tracking event when the popover is dismissed', () => {
|
|
const expectedLabel = commitTrackLabel;
|
|
const expectedProperty = 'owner';
|
|
const expectedValue = '10';
|
|
const dismissButton = wrapper.find(GlButton);
|
|
|
|
console.log(wrapper.html());
|
|
|
|
triggerEvent(dismissButton.element);
|
|
|
|
expect(trackingSpy).toHaveBeenCalledWith('_category_', 'click_button', {
|
|
label: expectedLabel,
|
|
property: expectedProperty,
|
|
value: expectedValue,
|
|
});
|
|
});
|
|
});
|
|
|
|
describe('when the popover is mounted with the trackLabel of the Confirm button popover at the bottom of the page', () => {
|
|
it('calls scrollToElement so that the Confirm button and popover will be in sight', () => {
|
|
const scrollToElementSpy = jest.spyOn(utils, 'scrollToElement');
|
|
|
|
createWrapper(commitTrackLabel);
|
|
|
|
expect(scrollToElementSpy).toHaveBeenCalled();
|
|
});
|
|
});
|
|
});
|