Commit afbd1b50 authored by Jackie Fraser's avatar Jackie Fraser

Set cookie during Commit Changes click on nudge 3

This is needed for the next step to know that the file was committed.
parent 8da31f63
<script>
import { GlPopover, GlSprintf, GlButton, GlIcon } from '@gitlab/ui';
import Cookies from 'js-cookie';
import { parseBoolean, scrollToElement } from '~/lib/utils/common_utils';
import { parseBoolean, scrollToElement, setCookie, getCookie } from '~/lib/utils/common_utils';
import { s__ } from '~/locale';
import { glEmojiTag } from '~/emoji';
import Tracking from '~/tracking';
......@@ -51,7 +50,7 @@ export default {
},
data() {
return {
popoverDismissed: parseBoolean(Cookies.get(this.dismissKey)),
popoverDismissed: parseBoolean(getCookie(`${this.trackLabel}_${this.dismissKey}`)),
tracking: {
label: this.trackLabel,
property: this.humanAccess,
......@@ -68,17 +67,27 @@ export default {
emoji() {
return popoverStates[this.trackLabel].emoji || '';
},
dismissCookieName() {
return `${this.trackLabel}_${this.dismissKey}`;
},
commitCookieName() {
return `suggest_gitlab_ci_yml_commit_${this.dismissKey}`;
},
},
mounted() {
if (this.trackLabel === 'suggest_commit_first_project_gitlab_ci_yml' && !this.popoverDismissed)
if (
this.trackLabel === 'suggest_commit_first_project_gitlab_ci_yml' &&
!this.popoverDismissed
) {
scrollToElement(document.querySelector(this.target));
}
this.trackOnShow();
},
methods: {
onDismiss() {
this.popoverDismissed = true;
Cookies.set(this.dismissKey, this.popoverDismissed, { expires: 365 });
setCookie(this.dismissCookieName, this.popoverDismissed);
},
trackOnShow() {
if (!this.popoverDismissed) this.track();
......
......@@ -5,6 +5,7 @@ import NewCommitForm from '../new_commit_form';
import EditBlob from './edit_blob';
import BlobFileDropzone from '../blob/blob_file_dropzone';
import initPopover from '~/blob/suggest_gitlab_ci_yml';
import { setCookie } from '~/lib/utils/common_utils';
export default () => {
const editBlobForm = $('.js-edit-blob-form');
......@@ -60,6 +61,16 @@ export default () => {
}
if (suggestEl) {
const commitButton = document.querySelector('#commit-changes');
initPopover(suggestEl);
if (commitButton) {
const commitCookieName = `suggest_gitlab_ci_yml_commit_${suggestEl.dataset.dismissKey}`;
commitButton.addEventListener('click', () => {
setCookie(commitCookieName, true);
});
}
}
};
......@@ -9,6 +9,7 @@ import { getLocationHash } from './url_utility';
import { convertToCamelCase, convertToSnakeCase } from './text_utility';
import { isObject } from './type_utility';
import { isFunction } from 'lodash';
import Cookies from 'js-cookie';
export const getPagePath = (index = 0) => {
const page = $('body').attr('data-page') || '';
......@@ -902,3 +903,10 @@ window.gl.utils = {
spriteIcon,
imagePath,
};
// Methods to set and get Cookie
export const setCookie = (name, value) => Cookies.set(name, value, { expires: 365 });
export const getCookie = name => Cookies.get(name);
export const removeCookie = name => Cookies.remove(name);
......@@ -23,7 +23,7 @@
.js-suggest-gitlab-ci-yml{ data: { toggle: 'popover',
target: '#gitlab-ci-yml-selector',
track_label: 'suggest_gitlab_ci_yml',
dismiss_key: "suggest_gitlab_ci_yml_#{@project.id}",
dismiss_key: @project.id,
human_access: human_access } }
.file-buttons
......
......@@ -17,5 +17,5 @@
.js-suggest-gitlab-ci-yml-commit-changes{ data: { toggle: 'popover',
target: '#commit-changes',
track_label: 'suggest_commit_first_project_gitlab_ci_yml',
dismiss_key: "suggest_commit_first_project_gitlab_ci_yml_#{@project.id}",
dismiss_key: @project.id,
human_access: human_access } }
......@@ -3,6 +3,8 @@
require 'spec_helper'
describe 'User follows pipeline suggest nudge spec when feature is enabled', :js do
include CookieHelper
let(:user) { create(:user, :admin) }
let(:project) { create(:project, :empty_repo) }
......@@ -38,6 +40,12 @@ describe 'User follows pipeline suggest nudge spec when feature is enabled', :js
expect(page).to have_content('1/2: Choose a template')
end
end
it 'sets the commit cookie when the Commit button is clicked' do
click_button 'Commit changes'
expect(get_cookie("suggest_gitlab_ci_yml_commit_#{project.id}")).to be_present
end
end
context 'when the page is visited without the param' do
......
import { shallowMount } from '@vue/test-utils';
import Popover from '~/blob/suggest_gitlab_ci_yml/components/popover.vue';
import Cookies from 'js-cookie';
import { mockTracking, unmockTracking } from 'helpers/tracking_helper';
import * as utils from '~/lib/utils/common_utils';
......@@ -10,9 +9,11 @@ jest.mock('~/lib/utils/common_utils', () => ({
}));
const target = 'gitlab-ci-yml-selector';
const dismissKey = 'suggest_gitlab_ci_yml_99';
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', () => {
......@@ -46,7 +47,8 @@ describe('Suggest gitlab-ci.yml Popover', () => {
describe('when the dismiss cookie is set', () => {
beforeEach(() => {
Cookies.set(dismissKey, true);
utils.setCookie(dismissCookie, true);
createWrapper(defaultTrackLabel);
});
......@@ -55,7 +57,7 @@ describe('Suggest gitlab-ci.yml Popover', () => {
});
afterEach(() => {
Cookies.remove(dismissKey);
utils.removeCookie(dismissCookie);
});
});
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment