From da2976a1f45379abbd061996bc6f0982cbb29f14 Mon Sep 17 00:00:00 2001 From: Ben Date: Tue, 18 Feb 2020 16:25:25 -0500 Subject: [PATCH 1/4] Add UTM params to Plus checkout from all locations --- _locales/en/messages.json | 2 +- app/hub/Views/PlusView/PlusView.jsx | 2 +- app/panel/components/Stats.jsx | 2 +- app/panel/components/Subscribe.jsx | 4 ++-- app/panel/utils/msg.js | 6 ++++-- src/background.js | 9 ++++++++- 6 files changed, 17 insertions(+), 8 deletions(-) diff --git a/_locales/en/messages.json b/_locales/en/messages.json index 269e14231..05077bb58 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -1936,7 +1936,7 @@ "content": "" }, "link_start": { - "content": "
" + "content": "
" } } }, diff --git a/app/hub/Views/PlusView/PlusView.jsx b/app/hub/Views/PlusView/PlusView.jsx index 6457f84fe..dbd761f97 100644 --- a/app/hub/Views/PlusView/PlusView.jsx +++ b/app/hub/Views/PlusView/PlusView.jsx @@ -29,7 +29,7 @@ class PlusView extends Component { */ _renderButton = (additionalClasses) => { const { isPlus, onPlusClick } = this.props; - const buttonHref = `https://checkout.${globals.GHOSTERY_DOMAIN}.com/plus`; + const buttonHref = `https://checkout.${globals.GHOSTERY_DOMAIN}.com/plus/?utm_source=gbe&utm_campaign=intro_hub_plus`; const buttonClassNames = ClassNames('PlusView__button', 'button', additionalClasses, { disabled: isPlus, }); diff --git a/app/panel/components/Stats.jsx b/app/panel/components/Stats.jsx index b4028171b..f19a75385 100644 --- a/app/panel/components/Stats.jsx +++ b/app/panel/components/Stats.jsx @@ -277,7 +277,7 @@ class Stats extends React.Component { */ subscribe = () => { sendMessage('ping', 'hist_plus_cta'); - openCheckoutPage(); + openCheckoutPage('historical_stats'); } /** diff --git a/app/panel/components/Subscribe.jsx b/app/panel/components/Subscribe.jsx index 1bc92505d..b03fedc8f 100644 --- a/app/panel/components/Subscribe.jsx +++ b/app/panel/components/Subscribe.jsx @@ -21,7 +21,7 @@ import { sendMessage, openCheckoutPage } from '../utils/msg'; */ function _handleBecomeClick() { sendMessage('ping', 'plus_cta_extension'); - openCheckoutPage(); + openCheckoutPage('plus_panel'); } /** @@ -36,7 +36,7 @@ const Subscribe = (props) => {
- + {t('subscribe_pitch_learn_more')}
diff --git a/app/panel/utils/msg.js b/app/panel/utils/msg.js index 7081254df..3c45e2815 100644 --- a/app/panel/utils/msg.js +++ b/app/panel/utils/msg.js @@ -124,8 +124,10 @@ export function openSubscriptionPage() { * This should be used for messages that don't require a callback. * @memberOf PanelUtils */ -export function openCheckoutPage() { - sendMessage('account.openCheckoutPage'); +export function openCheckoutPage(from) { + sendMessage('account.openCheckoutPage', { + from + }); window.close(); } diff --git a/src/background.js b/src/background.js index b1063f70d..b158386c3 100644 --- a/src/background.js +++ b/src/background.js @@ -849,7 +849,14 @@ function onMessageHandler(request, sender, callback) { return false; } if (name === 'account.openCheckoutPage') { - utils.openNewTab({ url: `https://checkout.${globals.GHOSTERY_DOMAIN}.com/plus`, become_active: true }); + let url = `https://checkout.${globals.GHOSTERY_DOMAIN}.com/plus`; + const { from } = message; + if (from === 'historical_stats') { + url += '?utm_source=gbe&utm_campaign=in_app_hstats'; + } else if (from === 'plus_panel') { + url += '?utm_source=gbe&utm_campaign=in_app_plus'; + } + utils.openNewTab({ url, become_active: true }); return false; } if (name === 'account.openSupportPage') { From 190c99ab07acb9d44ccf9aa8ccc243f28b822cf7 Mon Sep 17 00:00:00 2001 From: Ben Date: Wed, 19 Feb 2020 11:47:15 -0500 Subject: [PATCH 2/4] Update tests --- .../Views/PlusView/__tests__/PlusView.test.jsx | 2 +- .../__snapshots__/PlusView.test.jsx.snap | 16 ++++++++-------- 2 files changed, 9 insertions(+), 9 deletions(-) diff --git a/app/hub/Views/PlusView/__tests__/PlusView.test.jsx b/app/hub/Views/PlusView/__tests__/PlusView.test.jsx index 3e2c4fa4e..78fc9c4b0 100644 --- a/app/hub/Views/PlusView/__tests__/PlusView.test.jsx +++ b/app/hub/Views/PlusView/__tests__/PlusView.test.jsx @@ -70,7 +70,7 @@ describe('app/hub/Views/PlusView component', () => { component.find('.PlusView__button').first().simulate('click'); expect(initialState.onPlusClick.mock.calls.length).toBe(1); - expect(component.find('.PlusView__button').first().props().href).toBe('https://checkout.ghosterystage.com/plus') + expect(component.find('.PlusView__button').first().props().href).toBe('https://checkout.ghosterystage.com/plus/?utm_source=gbe&utm_campaign=intro_hub_plus') expect(component.find('.PlusView__button').length).toBe(8); expect(component.find('.PlusView__button.disabled').length).toBe(0); diff --git a/app/hub/Views/PlusView/__tests__/__snapshots__/PlusView.test.jsx.snap b/app/hub/Views/PlusView/__tests__/__snapshots__/PlusView.test.jsx.snap index c673637ca..ae9cc720c 100644 --- a/app/hub/Views/PlusView/__tests__/__snapshots__/PlusView.test.jsx.snap +++ b/app/hub/Views/PlusView/__tests__/__snapshots__/PlusView.test.jsx.snap @@ -361,7 +361,7 @@ exports[`app/hub/Views/PlusView component Snapshot tests with react-test-rendere > Date: Wed, 19 Feb 2020 17:27:03 -0500 Subject: [PATCH 3/4] Remove / from links with utm params --- _locales/en/messages.json | 2 +- app/hub/Views/PlusView/PlusView.jsx | 2 +- .../Views/PlusView/__tests__/PlusView.test.jsx | 2 +- .../__snapshots__/PlusView.test.jsx.snap | 16 ++++++++-------- app/panel/components/Subscribe.jsx | 2 +- 5 files changed, 12 insertions(+), 12 deletions(-) diff --git a/_locales/en/messages.json b/_locales/en/messages.json index 05077bb58..0e5300f9b 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -1936,7 +1936,7 @@ "content": "" }, "link_start": { - "content": "
" + "content": "
" } } }, diff --git a/app/hub/Views/PlusView/PlusView.jsx b/app/hub/Views/PlusView/PlusView.jsx index dbd761f97..7a56806a4 100644 --- a/app/hub/Views/PlusView/PlusView.jsx +++ b/app/hub/Views/PlusView/PlusView.jsx @@ -29,7 +29,7 @@ class PlusView extends Component { */ _renderButton = (additionalClasses) => { const { isPlus, onPlusClick } = this.props; - const buttonHref = `https://checkout.${globals.GHOSTERY_DOMAIN}.com/plus/?utm_source=gbe&utm_campaign=intro_hub_plus`; + const buttonHref = `https://checkout.${globals.GHOSTERY_DOMAIN}.com/plus?utm_source=gbe&utm_campaign=intro_hub_plus`; const buttonClassNames = ClassNames('PlusView__button', 'button', additionalClasses, { disabled: isPlus, }); diff --git a/app/hub/Views/PlusView/__tests__/PlusView.test.jsx b/app/hub/Views/PlusView/__tests__/PlusView.test.jsx index 78fc9c4b0..14d2912ca 100644 --- a/app/hub/Views/PlusView/__tests__/PlusView.test.jsx +++ b/app/hub/Views/PlusView/__tests__/PlusView.test.jsx @@ -70,7 +70,7 @@ describe('app/hub/Views/PlusView component', () => { component.find('.PlusView__button').first().simulate('click'); expect(initialState.onPlusClick.mock.calls.length).toBe(1); - expect(component.find('.PlusView__button').first().props().href).toBe('https://checkout.ghosterystage.com/plus/?utm_source=gbe&utm_campaign=intro_hub_plus') + expect(component.find('.PlusView__button').first().props().href).toBe('https://checkout.ghosterystage.com/plus?utm_source=gbe&utm_campaign=intro_hub_plus') expect(component.find('.PlusView__button').length).toBe(8); expect(component.find('.PlusView__button.disabled').length).toBe(0); diff --git a/app/hub/Views/PlusView/__tests__/__snapshots__/PlusView.test.jsx.snap b/app/hub/Views/PlusView/__tests__/__snapshots__/PlusView.test.jsx.snap index ae9cc720c..f4b3356eb 100644 --- a/app/hub/Views/PlusView/__tests__/__snapshots__/PlusView.test.jsx.snap +++ b/app/hub/Views/PlusView/__tests__/__snapshots__/PlusView.test.jsx.snap @@ -361,7 +361,7 @@ exports[`app/hub/Views/PlusView component Snapshot tests with react-test-rendere > {
- + {t('subscribe_pitch_learn_more')}
From 1f5c6c86acd66a4ce86162399419cce27ce0bcde Mon Sep 17 00:00:00 2001 From: Ben Date: Fri, 21 Feb 2020 10:30:06 -0500 Subject: [PATCH 4/4] Refactor messaging passing --- app/panel/components/Stats.jsx | 5 ++++- app/panel/components/Subscribe.jsx | 5 ++++- app/panel/utils/msg.js | 6 ++---- src/background.js | 8 +++----- 4 files changed, 13 insertions(+), 11 deletions(-) diff --git a/app/panel/components/Stats.jsx b/app/panel/components/Stats.jsx index f19a75385..39aa829d2 100644 --- a/app/panel/components/Stats.jsx +++ b/app/panel/components/Stats.jsx @@ -277,7 +277,10 @@ class Stats extends React.Component { */ subscribe = () => { sendMessage('ping', 'hist_plus_cta'); - openCheckoutPage('historical_stats'); + openCheckoutPage({ + utm_source: 'gbe', + utm_campaign: 'in_app_hstats' + }); } /** diff --git a/app/panel/components/Subscribe.jsx b/app/panel/components/Subscribe.jsx index 1a1c1c46c..81222e88a 100644 --- a/app/panel/components/Subscribe.jsx +++ b/app/panel/components/Subscribe.jsx @@ -21,7 +21,10 @@ import { sendMessage, openCheckoutPage } from '../utils/msg'; */ function _handleBecomeClick() { sendMessage('ping', 'plus_cta_extension'); - openCheckoutPage('plus_panel'); + openCheckoutPage({ + utm_source: 'gbe', + utm_campaign: 'in_app_plus' + }); } /** diff --git a/app/panel/utils/msg.js b/app/panel/utils/msg.js index 3c45e2815..78deb224a 100644 --- a/app/panel/utils/msg.js +++ b/app/panel/utils/msg.js @@ -124,10 +124,8 @@ export function openSubscriptionPage() { * This should be used for messages that don't require a callback. * @memberOf PanelUtils */ -export function openCheckoutPage(from) { - sendMessage('account.openCheckoutPage', { - from - }); +export function openCheckoutPage(utm) { + sendMessage('account.openCheckoutPage', { utm }); window.close(); } diff --git a/src/background.js b/src/background.js index b158386c3..107290cfe 100644 --- a/src/background.js +++ b/src/background.js @@ -850,11 +850,9 @@ function onMessageHandler(request, sender, callback) { } if (name === 'account.openCheckoutPage') { let url = `https://checkout.${globals.GHOSTERY_DOMAIN}.com/plus`; - const { from } = message; - if (from === 'historical_stats') { - url += '?utm_source=gbe&utm_campaign=in_app_hstats'; - } else if (from === 'plus_panel') { - url += '?utm_source=gbe&utm_campaign=in_app_plus'; + const { utm } = message || null; + if (utm) { + url += `?utm_source=${utm.utm_source}&utm_campaign=${utm.utm_campaign}`; } utils.openNewTab({ url, become_active: true }); return false;