From 2964e5480001f0fcfa30e903a7efdba5c826823c Mon Sep 17 00:00:00 2001 From: Shane Osbourne Date: Tue, 18 Jun 2024 13:54:18 +0100 Subject: [PATCH] send telemetry when 'skip' is clicked in alternative flow --- build/app/public/js/base.js | 19 ++++++++++++++++--- integration-tests/AltBreakageFlows.js | 6 ++++++ integration-tests/Mocks.js | 17 ++++++++--------- schema/__generated__/schema.parsers.mjs | 6 +++++- schema/__generated__/schema.types.ts | 5 ++++- schema/telemetry-span.json | 10 ++++++++++ v2/screens/choice-problem.jsx | 10 +++++++++- 7 files changed, 58 insertions(+), 15 deletions(-) diff --git a/build/app/public/js/base.js b/build/app/public/js/base.js index 11b6e335..9c123064 100644 --- a/build/app/public/js/base.js +++ b/build/app/public/js/base.js @@ -4577,7 +4577,7 @@ }); // schema/__generated__/schema.parsers.mjs - var protectionsDisabledReasonSchema, ownedByFirstPartyReasonSchema, ruleExceptionReasonSchema, adClickAttributionReasonSchema, otherThirdPartyRequestReasonSchema, screenKindSchema, wvVersionTitleSchema, requestsTitleSchema, featuresTitleSchema, appVersionTitleSchema, atbTitleSchema, errorDescriptionsTitleSchema, extensionVersionTitleSchema, httpErrorCodesTitleSchema, lastSentDayTitleSchema, deviceTitleSchema, osTitleSchema, listVersionsTitleSchema, reportFlowTitleSchema, siteUrlTitleSchema, didOpenReportInfoTitleSchema, toggleReportCounterTitleSchema, openerContextTitleSchema, userRefreshCountTitleSchema, jsPerformanceTitleSchema, stateBlockedSchema, stateAllowedSchema, extensionMessageGetPrivacyDashboardDataSchema, emailProtectionUserDataSchema, protectionsStatusSchema, localeSettingsSchema, parentEntitySchema, fireButtonSchema, searchSchema, breakageReportRequestSchema, setListOptionsSchema, windowsIncomingVisibilitySchema, cookiePromptManagementStatusSchema, refreshAliasResponseSchema, extensionMessageSetListOptionsSchema, fireOptionSchema, primaryScreenSchema, eventOriginSchema, siteUrlAdditionalDataSchema, closeMessageParamsSchema, categoryTypeSelectedSchema, categorySelectedSchema, dataItemIdSchema, detectedRequestSchema, tabSchema, breakageReportSchema, fireButtonDataSchema, remoteFeatureSettingsSchema, setProtectionParamsSchema, toggleReportScreenDataItemSchema, telemetrySpanSchema, requestDataSchema, getPrivacyDashboardDataSchema, windowsViewModelSchema, toggleReportScreenSchema, windowsIncomingViewModelSchema, windowsIncomingMessageSchema, apiSchema; + var protectionsDisabledReasonSchema, ownedByFirstPartyReasonSchema, ruleExceptionReasonSchema, adClickAttributionReasonSchema, otherThirdPartyRequestReasonSchema, screenKindSchema, wvVersionTitleSchema, requestsTitleSchema, featuresTitleSchema, appVersionTitleSchema, atbTitleSchema, errorDescriptionsTitleSchema, extensionVersionTitleSchema, httpErrorCodesTitleSchema, lastSentDayTitleSchema, deviceTitleSchema, osTitleSchema, listVersionsTitleSchema, reportFlowTitleSchema, siteUrlTitleSchema, didOpenReportInfoTitleSchema, toggleReportCounterTitleSchema, openerContextTitleSchema, userRefreshCountTitleSchema, jsPerformanceTitleSchema, stateBlockedSchema, stateAllowedSchema, extensionMessageGetPrivacyDashboardDataSchema, emailProtectionUserDataSchema, protectionsStatusSchema, localeSettingsSchema, parentEntitySchema, fireButtonSchema, searchSchema, breakageReportRequestSchema, setListOptionsSchema, windowsIncomingVisibilitySchema, cookiePromptManagementStatusSchema, refreshAliasResponseSchema, extensionMessageSetListOptionsSchema, fireOptionSchema, primaryScreenSchema, eventOriginSchema, siteUrlAdditionalDataSchema, closeMessageParamsSchema, categoryTypeSelectedSchema, categorySelectedSchema, toggleSkippedSchema, dataItemIdSchema, detectedRequestSchema, tabSchema, breakageReportSchema, fireButtonDataSchema, remoteFeatureSettingsSchema, setProtectionParamsSchema, toggleReportScreenDataItemSchema, telemetrySpanSchema, requestDataSchema, getPrivacyDashboardDataSchema, windowsViewModelSchema, toggleReportScreenSchema, windowsIncomingViewModelSchema, windowsIncomingMessageSchema, apiSchema; var init_schema_parsers = __esm({ "schema/__generated__/schema.parsers.mjs"() { "use strict"; @@ -4712,6 +4712,9 @@ name: z3.literal("categorySelected"), value: z3.union([z3.literal("blocked"), z3.literal("layout"), z3.literal("empty-spaces"), z3.literal("paywall"), z3.literal("videos"), z3.literal("comments"), z3.literal("login"), z3.literal("shopping"), z3.literal("other")]) }); + toggleSkippedSchema = z3.object({ + name: z3.literal("toggleSkipped") + }); dataItemIdSchema = z3.union([wvVersionTitleSchema, requestsTitleSchema, featuresTitleSchema, appVersionTitleSchema, atbTitleSchema, errorDescriptionsTitleSchema, extensionVersionTitleSchema, httpErrorCodesTitleSchema, lastSentDayTitleSchema, deviceTitleSchema, osTitleSchema, listVersionsTitleSchema, reportFlowTitleSchema, siteUrlTitleSchema, didOpenReportInfoTitleSchema, toggleReportCounterTitleSchema, openerContextTitleSchema, userRefreshCountTitleSchema, jsPerformanceTitleSchema]); detectedRequestSchema = z3.object({ url: z3.string(), @@ -4751,7 +4754,7 @@ additional: siteUrlAdditionalDataSchema.optional() }); telemetrySpanSchema = z3.object({ - attributes: z3.union([categoryTypeSelectedSchema, categorySelectedSchema]), + attributes: z3.union([categoryTypeSelectedSchema, categorySelectedSchema, toggleSkippedSchema]), eventOrigin: eventOriginSchema }); requestDataSchema = z3.object({ @@ -17130,7 +17133,17 @@ const data = useData(); const text = data.tab.domain; const onToggle = useToggle(); - return /* @__PURE__ */ y("div", { className: "site-info page-inner card", "data-page": "choice-category" }, /* @__PURE__ */ y(NavWrapper, null), /* @__PURE__ */ y("div", { className: "padding-x-double" }, /* @__PURE__ */ y(KeyInsightsMain, { title: text, icon: "switch-shield" }, description)), /* @__PURE__ */ y("div", { className: "padding-x" }, /* @__PURE__ */ y("div", { class: "card-list--bordered" }, /* @__PURE__ */ y("div", { className: "protection-toggle" }, /* @__PURE__ */ y("div", { className: "protection-toggle__row" }, /* @__PURE__ */ y(ProtectionToggle, { model: data, toggle: onToggle })))), /* @__PURE__ */ y("div", { class: "text--center" }, /* @__PURE__ */ y(TextLink, { onClick: () => push("choiceBreakageForm") }, ns.report("skipThisStep.title"))))); + const send = useTelemetry(); + return /* @__PURE__ */ y("div", { className: "site-info page-inner card", "data-page": "choice-category" }, /* @__PURE__ */ y(NavWrapper, null), /* @__PURE__ */ y("div", { className: "padding-x-double" }, /* @__PURE__ */ y(KeyInsightsMain, { title: text, icon: "switch-shield" }, description)), /* @__PURE__ */ y("div", { className: "padding-x" }, /* @__PURE__ */ y("div", { class: "card-list--bordered" }, /* @__PURE__ */ y("div", { className: "protection-toggle" }, /* @__PURE__ */ y("div", { className: "protection-toggle__row" }, /* @__PURE__ */ y(ProtectionToggle, { model: data, toggle: onToggle })))), /* @__PURE__ */ y("div", { class: "text--center" }, /* @__PURE__ */ y( + TextLink, + { + onClick: () => { + push("choiceBreakageForm"); + send({ name: "toggleSkipped" }); + } + }, + ns.report("skipThisStep.title") + )))); } var validCategories = () => { return { diff --git a/integration-tests/AltBreakageFlows.js b/integration-tests/AltBreakageFlows.js index 85106f8c..175640bc 100644 --- a/integration-tests/AltBreakageFlows.js +++ b/integration-tests/AltBreakageFlows.js @@ -49,6 +49,12 @@ export class AltBreakageFlows { await page.getByLabel('Site layout broken').click() await this.dash.screenshot('category-inline-toggle.png') await page.getByRole('link', { name: 'Skip this step' }).click() + await this.dash.mocks.didSendTelemetry({ + screen: 'choiceToggle', + attributes: { + name: 'toggleSkipped', + }, + }) await page.getByRole('button', { name: 'Send Report' }).click() await this.dash.mocks.calledForSubmitBreakageForm({ category: 'layout' }) } diff --git a/integration-tests/Mocks.js b/integration-tests/Mocks.js index 8c8692a7..d64e8ade 100644 --- a/integration-tests/Mocks.js +++ b/integration-tests/Mocks.js @@ -113,16 +113,15 @@ export class Mocks { const calls = await this.outgoing({ names: ['privacyDashboardTelemetrySpan'], }) - expect(calls).toMatchObject([ - [ - 'privacyDashboardTelemetrySpan', - { - eventOrigin: { - screen, - }, - attributes, + const filtered = calls.find(([_name, payload]) => payload.attributes?.name === attributes.name) + expect(filtered).toMatchObject([ + 'privacyDashboardTelemetrySpan', + { + eventOrigin: { + screen, }, - ], + attributes, + }, ]) } diff --git a/schema/__generated__/schema.parsers.mjs b/schema/__generated__/schema.parsers.mjs index bde949e4..5cabe2c5 100644 --- a/schema/__generated__/schema.parsers.mjs +++ b/schema/__generated__/schema.parsers.mjs @@ -178,6 +178,10 @@ export const categorySelectedSchema = z.object({ value: z.union([z.literal("blocked"), z.literal("layout"), z.literal("empty-spaces"), z.literal("paywall"), z.literal("videos"), z.literal("comments"), z.literal("login"), z.literal("shopping"), z.literal("other")]) }); +export const toggleSkippedSchema = z.object({ + name: z.literal("toggleSkipped") +}); + export const dataItemIdSchema = z.union([wvVersionTitleSchema, requestsTitleSchema, featuresTitleSchema, appVersionTitleSchema, atbTitleSchema, errorDescriptionsTitleSchema, extensionVersionTitleSchema, httpErrorCodesTitleSchema, lastSentDayTitleSchema, deviceTitleSchema, osTitleSchema, listVersionsTitleSchema, reportFlowTitleSchema, siteUrlTitleSchema, didOpenReportInfoTitleSchema, toggleReportCounterTitleSchema, openerContextTitleSchema, userRefreshCountTitleSchema, jsPerformanceTitleSchema]); export const detectedRequestSchema = z.object({ @@ -225,7 +229,7 @@ export const toggleReportScreenDataItemSchema = z.object({ }); export const telemetrySpanSchema = z.object({ - attributes: z.union([categoryTypeSelectedSchema, categorySelectedSchema]), + attributes: z.union([categoryTypeSelectedSchema, categorySelectedSchema, toggleSkippedSchema]), eventOrigin: eventOriginSchema }); diff --git a/schema/__generated__/schema.types.ts b/schema/__generated__/schema.types.ts index d4fa9376..b6178985 100644 --- a/schema/__generated__/schema.types.ts +++ b/schema/__generated__/schema.types.ts @@ -532,7 +532,7 @@ export interface CloseMessageParams { eventOrigin: EventOrigin; } export interface TelemetrySpan { - attributes: CategoryTypeSelected | CategorySelected; + attributes: CategoryTypeSelected | CategorySelected | ToggleSkipped; eventOrigin: EventOrigin; } export interface CategoryTypeSelected { @@ -543,4 +543,7 @@ export interface CategorySelected { name: "categorySelected"; value: "blocked" | "layout" | "empty-spaces" | "paywall" | "videos" | "comments" | "login" | "shopping" | "other"; } +export interface ToggleSkipped { + name: "toggleSkipped"; +} diff --git a/schema/telemetry-span.json b/schema/telemetry-span.json index 34872f80..e5561dbb 100644 --- a/schema/telemetry-span.json +++ b/schema/telemetry-span.json @@ -33,6 +33,16 @@ "enum": ["blocked", "layout", "empty-spaces", "paywall", "videos", "comments", "login", "shopping", "other"] } } + }, + { + "type": "object", + "title": "ToggleSkipped", + "required": ["name"], + "properties": { + "name": { + "const": "toggleSkipped" + } + } } ] }, diff --git a/v2/screens/choice-problem.jsx b/v2/screens/choice-problem.jsx index 7fbe5feb..11153b8e 100644 --- a/v2/screens/choice-problem.jsx +++ b/v2/screens/choice-problem.jsx @@ -108,6 +108,7 @@ export function ChoiceToggleScreen() { const data = useData() const text = data.tab.domain const onToggle = useToggle() + const send = useTelemetry() return (
@@ -126,7 +127,14 @@ export function ChoiceToggleScreen() {
- push('choiceBreakageForm')}>{ns.report('skipThisStep.title')} + { + push('choiceBreakageForm') + send({ name: 'toggleSkipped' }) + }} + > + {ns.report('skipThisStep.title')} +