Commit f9128da7 authored by Jose Ivan Vargas's avatar Jose Ivan Vargas

Merge branch '355479-metrics-page-load-vul-details' into 'master'

Add page load to tracking metrics

See merge request gitlab-org/gitlab!82658
parents b8506107 2fde44f9
......@@ -8,7 +8,10 @@ import { TYPE_VULNERABILITY } from '~/graphql_shared/constants';
import { convertToGraphQLId } from '~/graphql_shared/utils';
import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
import Tracking from '~/tracking';
import { TRACK_CLICK_TRAINING_LINK_ACTION } from '~/security_configuration/constants';
import {
TRACK_CLICK_TRAINING_LINK_ACTION,
TRACK_TRAINING_LOADED_ACTION,
} from '~/security_configuration/constants';
import { TEMP_PROVIDER_LOGOS } from '~/security_configuration/components/constants';
import { SUPPORTED_IDENTIFIER_TYPES, SECURITY_TRAINING_URL_STATUS_COMPLETED } from '../constants';
......@@ -101,7 +104,13 @@ export default {
);
},
hasSecurityTrainingUrls() {
return this.vulnerability?.securityTrainingUrls?.length > 0;
const hasSecurityTrainingUrls = this.vulnerability?.securityTrainingUrls?.length > 0;
if (hasSecurityTrainingUrls) {
this.track(TRACK_TRAINING_LOADED_ACTION, {
property: this.projectFullPath,
});
}
return hasSecurityTrainingUrls;
},
securityTrainingUrls() {
return this.vulnerability?.securityTrainingUrls;
......@@ -116,13 +125,10 @@ export default {
},
},
methods: {
clickTrainingLink(name, url) {
this.triggerMetric(TRACK_CLICK_TRAINING_LINK_ACTION, name, url);
},
triggerMetric(action, name, url) {
this.track(action, {
property: url,
clickTrainingLink(name) {
this.track(TRACK_CLICK_TRAINING_LINK_ACTION, {
label: `vendor_${name}`,
property: this.projectFullPath,
});
},
},
......@@ -149,7 +155,7 @@ export default {
</span>
<span class="gl-font-weight-bold gl-font-base">{{ name }}</span>
</div>
<gl-link :href="url" target="_blank" @click="clickTrainingLink(name, url)">
<gl-link :href="url" target="_blank" @click="clickTrainingLink(name)">
{{ $options.i18n.viewTraining }}
<gl-icon class="gl-ml-2" name="external-link" :size="12" />
</gl-link>
......
......@@ -13,7 +13,10 @@ import {
SUPPORTED_IDENTIFIER_TYPES,
SECURITY_TRAINING_URL_STATUS_PENDING,
} from 'ee/vulnerabilities/constants';
import { TRACK_CLICK_TRAINING_LINK_ACTION } from '~/security_configuration/constants';
import {
TRACK_CLICK_TRAINING_LINK_ACTION,
TRACK_TRAINING_LOADED_ACTION,
} from '~/security_configuration/constants';
import createMockApollo from 'helpers/mock_apollo_helper';
import waitForPromises from 'helpers/wait_for_promises';
import {
......@@ -40,6 +43,8 @@ const createTrainingData = (first = {}, second = {}, urls) =>
},
});
const projectFullPath = 'namespace/project';
const TEST_TRAINING_PROVIDERS_ALL_DISABLED = getSecurityTrainingProvidersData();
const TEST_TRAINING_PROVIDERS_FIRST_ENABLED = getSecurityTrainingProvidersData({
providerOverrides: { first: { isEnabled: true } },
......@@ -76,7 +81,7 @@ describe('VulnerabilityTraining component', () => {
slots,
apolloProvider,
provide: {
projectFullPath: 'namespace/project',
projectFullPath,
glFeatures: {
secureVulnerabilityTraining,
},
......@@ -297,11 +302,8 @@ describe('VulnerabilityTraining component', () => {
describe('metrics', () => {
let trackingSpy;
beforeEach(async () => {
beforeEach(() => {
trackingSpy = mockTracking(undefined, wrapper.element, jest.spyOn);
createApolloProvider();
createComponent();
await waitForQueryToBeLoaded();
});
afterEach(() => {
......@@ -309,11 +311,30 @@ describe('VulnerabilityTraining component', () => {
});
const expectedTrackingOptions = (index) => ({
property: testTrainingUrls[index],
label: `vendor_${testProviderName[index]}`,
property: projectFullPath,
});
it('tracks when the training link is loading', async () => {
createApolloProvider({
vulnerabilityQueryHandler: jest.fn().mockResolvedValue(
createTrainingData({
status: SECURITY_TRAINING_URL_STATUS_PENDING,
}).response,
),
});
createComponent();
await waitForQueryToBeLoaded();
expect(trackingSpy).toHaveBeenCalledWith(undefined, TRACK_TRAINING_LOADED_ACTION, {
property: projectFullPath,
});
});
it.each([0, 1])('tracks when training link %s gets clicked', async (index) => {
createApolloProvider();
createComponent();
await waitForQueryToBeLoaded();
await findTrainingItemLinks().at(index).vm.$emit('click');
expect(trackingSpy).toHaveBeenCalledWith(
......
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