зеркало из https://github.com/mozilla/fxa.git
refactor(sync): Remove 'Looking for Firefox Sync?' link from home page
Because: * Sync Desktop is moving to the OAuth flow. We could rely on a webchannel message to receive the OAuth params, but checked with Product to see if we want to keep this link, who gave the OK for removal as it is confusing in its current state since users reach the Sync flow through the browser This commit: * Removes this link and info banner closes FXA-8907
This commit is contained in:
Lauren Zugai
Родитель
3da48c2293
Коммит
0f3adea88c
|
|
@ -53,9 +53,7 @@ test.describe('severity-1 #smoke', () => {
|
|||
pages: { settings, signupReact },
|
||||
}) => {
|
||||
await signupReact.goto();
|
||||
|
||||
// Make sure the looking for sync message is displayed.
|
||||
await expect(page.getByText('Looking for Firefox sync?')).toBeVisible();
|
||||
await expect(page.getByText('Enter your email')).toBeVisible();
|
||||
|
||||
await signupReact.fillOutEmailFirst(email);
|
||||
await page.waitForSelector('#root');
|
||||
|
|
|
|||
|
|
@ -63,7 +63,7 @@ class AccountsEventsServerEvent {
|
|||
* @param {string} session_entrypoint - entrypoint to the service.
|
||||
* @param {string} session_flow_id - an ID generated by FxA for its flow metrics.
|
||||
* @param {string} utm_campaign - A marketing campaign. For example, if a user signs into FxA from selecting a Mozilla VPN plan on Mozilla VPN's product site, then value of this metric could be 'vpn-product-page'. The value has a max length of 128 characters with the alphanumeric characters, _ (underscore), forward slash (/), . (period), % (percentage sign), and - (hyphen) in the allowed set of characters. The special value of 'page+referral+-+not+part+of+a+campaign' is also allowed..
|
||||
* @param {string} utm_content - The content on which the user acted. For example, if the user clicked on the "Get started here" link in "Looking for Firefox Sync? Get started here", then the value for this metric would be 'fx-sync-get-started'. The value has a max length of 128 characters with the alphanumeric characters, _ (underscore), forward slash (/), . (period), % (percentage sign), and - (hyphen) in the allowed set of characters..
|
||||
* @param {string} utm_content - The content on which the user acted. For example, if the user clicked on the (previously available) "Get started here" link in "Looking for Firefox Sync? Get started here", then the value for this metric would be 'fx-sync-get-started'. The value has a max length of 128 characters with the alphanumeric characters, _ (underscore), forward slash (/), . (period), % (percentage sign), and - (hyphen) in the allowed set of characters..
|
||||
* @param {string} utm_medium - The "medium" on which the user acted. For example, if the user clicked on a link in an email, then the value of this metric would be 'email'. The value has a max length of 128 characters with the alphanumeric characters, _ (underscore), forward slash (/), . (period), % (percentage sign), and - (hyphen) in the allowed set of characters..
|
||||
* @param {string} utm_source - The source from where the user started. For example, if the user clicked on a link on the Mozilla accounts web site, this value could be 'fx-website'. The value has a max length of 128 characters with the alphanumeric characters, _ (underscore), forward slash (/), . (period), % (percentage sign), and - (hyphen) in the allowed set of characters..
|
||||
* @param {string} utm_term - This metric is similar to the `utm.source`; it is used in the Firefox browser. For example, if the user started from about:welcome, then the value could be 'aboutwelcome-default-screen'. The value has a max length of 128 characters with the alphanumeric characters, _ (underscore), forward slash (/), . (period), % (percentage sign), and - (hyphen) in the allowed set of characters..
|
||||
|
|
|
|||
|
|
@ -26,11 +26,11 @@ export const campaign = new StringMetricType({
|
|||
|
||||
/**
|
||||
* The content on which the user acted. For example, if the user clicked on the
|
||||
* "Get started here" link in "Looking for Firefox Sync? Get started here", then
|
||||
* the value for this metric would be 'fx-sync-get-started'. The value has a max
|
||||
* length of 128 characters with the alphanumeric characters, _ (underscore),
|
||||
* forward slash (/), . (period), % (percentage sign), and - (hyphen) in the
|
||||
* allowed set of characters.
|
||||
* (previously available) "Get started here" link in "Looking for Firefox Sync? Get
|
||||
* started here", then the value for this metric would be 'fx-sync-get-started'.
|
||||
* The value has a max length of 128 characters with the alphanumeric characters,
|
||||
* _ (underscore), forward slash (/), . (period), % (percentage sign), and - (hyphen)
|
||||
* in the allowed set of characters.
|
||||
*
|
||||
* Generated from `utm.content`.
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -1,11 +0,0 @@
|
|||
{{#showSyncSuggestion}}
|
||||
<div class="info" id="suggest-sync">
|
||||
<p class="info-text">
|
||||
{{#unsafeTranslate}}Looking for Firefox Sync? <a %(escapedSyncSuggestionAttrs)s>Get started here</a>{{/unsafeTranslate}}
|
||||
</p>
|
||||
<button class="dismiss bg-close-black" type="button" aria-label="{{#t}}Close{{/t}}">
|
||||
{{! When this component is converted to React, use the shared close.svg
|
||||
from fxa-react for both black and white versions. We currently use a bg-image now. }}
|
||||
</button>
|
||||
</div>
|
||||
{{/showSyncSuggestion}}
|
||||
|
|
@ -21,7 +21,6 @@ import GleanMetrics from '../lib/glean';
|
|||
import ServiceMixin from './mixins/service-mixin';
|
||||
import SignedInNotificationMixin from './mixins/signed-in-notification-mixin';
|
||||
import ThirdPartyAuthMixin from './mixins/third-party-auth-mixin';
|
||||
import SyncSuggestionMixin from './mixins/sync-suggestion-mixin';
|
||||
import Template from 'templates/index.mustache';
|
||||
import checkEmailDomain from '../lib/email-domain-validator';
|
||||
import PocketMigrationMixin from './mixins/pocket-migration-mixin';
|
||||
|
|
@ -321,10 +320,6 @@ Cocktail.mixin(
|
|||
ThirdPartyAuthMixin,
|
||||
SignedInNotificationMixin,
|
||||
BrandMessagingMixin,
|
||||
SyncSuggestionMixin({
|
||||
entrypoint: 'fxa:enter_email',
|
||||
flowEvent: 'link.signin',
|
||||
}),
|
||||
PocketMigrationMixin,
|
||||
MonitorClientMixin
|
||||
);
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
|
||||
/**
|
||||
* Mix into views that show the "Why do I need this account? Find out here"
|
||||
* helper tooltip for Pocket accounts. This is based on the sync-suggestion-mixin.js.
|
||||
* helper tooltip for Pocket accounts. This was based on the sync-suggestion-mixin.js.
|
||||
*
|
||||
* Sets the context field `accountSuggestionHTML`
|
||||
* which contains the HTML to display.
|
||||
|
|
|
|||
|
|
@ -1,88 +0,0 @@
|
|||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
/**
|
||||
* Mix into views that show the "Looking for Firefox Sync? Get started here"
|
||||
* helper tooltip.
|
||||
*
|
||||
* Sets the context field `syncSuggestionHTML`
|
||||
* which contains the HTML to display.
|
||||
*/
|
||||
|
||||
import Constants from '../../lib/constants';
|
||||
import FlowEventsMixin from './flow-events-mixin';
|
||||
import required from '../../lib/required';
|
||||
import SyncAuthMixin from './sync-auth-mixin';
|
||||
import SyncSuggestionTemplate from 'templates/partial/sync-suggestion.mustache';
|
||||
|
||||
/**
|
||||
* Create the mixin
|
||||
*
|
||||
* @param {Object} config
|
||||
* @param {String} config.entrypoint
|
||||
* @param {String} config.flowEvent
|
||||
* @returns {Function}
|
||||
*/
|
||||
export default function (config) {
|
||||
required(config.entrypoint, 'entrypoint');
|
||||
required(config.flowEvent, 'flowEvent');
|
||||
|
||||
return {
|
||||
dependsOn: [FlowEventsMixin, SyncAuthMixin],
|
||||
|
||||
events: {
|
||||
'click #suggest-sync .dismiss': 'onSuggestSyncDismiss',
|
||||
},
|
||||
|
||||
afterVisible() {
|
||||
if (this.isSyncSuggestionEnabled()) {
|
||||
this.logViewEvent('sync-suggest.visible');
|
||||
}
|
||||
},
|
||||
|
||||
setInitialContext(context) {
|
||||
let escapedSyncSuggestionUrl;
|
||||
if (this.isSyncAuthSupported()) {
|
||||
escapedSyncSuggestionUrl = this.getEscapedSyncUrl(
|
||||
'',
|
||||
config.entrypoint,
|
||||
{ action: 'email' }
|
||||
);
|
||||
} else {
|
||||
escapedSyncSuggestionUrl = encodeURI(
|
||||
Constants.MOZ_ORG_SYNC_GET_STARTED_LINK
|
||||
);
|
||||
}
|
||||
|
||||
const escapedSyncSuggestionAttrs = `data-flow-event="${config.flowEvent}" href="${escapedSyncSuggestionUrl}"`;
|
||||
|
||||
const syncSuggestionHTML = this.renderTemplate(SyncSuggestionTemplate, {
|
||||
escapedSyncSuggestionAttrs,
|
||||
showSyncSuggestion: this.isSyncSuggestionEnabled(),
|
||||
});
|
||||
|
||||
context.set({
|
||||
syncSuggestionHTML,
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* Is the Sync suggestion enabled for this integration?
|
||||
*
|
||||
* @returns {Boolean}
|
||||
*/
|
||||
isSyncSuggestionEnabled() {
|
||||
return (
|
||||
!this.relier.get('service') &&
|
||||
this.relier.get('context') === 'web' &&
|
||||
// issue #6121 - skip sync suggestion if headed to subscription product page
|
||||
!this.relier.get('subscriptionProductId')
|
||||
);
|
||||
},
|
||||
|
||||
onSuggestSyncDismiss() {
|
||||
this.$('#suggest-sync').hide();
|
||||
},
|
||||
};
|
||||
}
|
||||
|
|
@ -1,146 +0,0 @@
|
|||
/* This Source Code Form is subject to the terms of the Mozilla Public
|
||||
* License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
|
||||
|
||||
import $ from 'jquery';
|
||||
import { assert } from 'chai';
|
||||
import BaseView from 'views/base';
|
||||
import Cocktail from 'cocktail';
|
||||
import Constants from 'lib/constants';
|
||||
import Notifier from 'lib/channels/notifier';
|
||||
import Relier from 'models/reliers/browser';
|
||||
import sinon from 'sinon';
|
||||
import SyncSuggestionMixin from 'views/mixins/sync-suggestion-mixin';
|
||||
|
||||
const SyncView = BaseView.extend({
|
||||
template: (context) => context.syncSuggestionHTML,
|
||||
});
|
||||
|
||||
Cocktail.mixin(
|
||||
SyncView,
|
||||
SyncSuggestionMixin({
|
||||
entrypoint: 'fxa:signup',
|
||||
flowEvent: 'link.signin',
|
||||
})
|
||||
);
|
||||
|
||||
describe('views/mixins/sync-suggestion-mixin', () => {
|
||||
let notifier;
|
||||
let relier;
|
||||
let view;
|
||||
|
||||
beforeEach(() => {
|
||||
notifier = new Notifier();
|
||||
relier = new Relier();
|
||||
|
||||
view = new SyncView({
|
||||
notifier,
|
||||
relier,
|
||||
});
|
||||
|
||||
sinon.stub(view, 'logViewEvent').callsFake(() => {});
|
||||
});
|
||||
|
||||
describe('sync suggestion', () => {
|
||||
it('displays sync suggestion message if no service', () => {
|
||||
relier.set('service', null);
|
||||
relier.set('context', 'web');
|
||||
|
||||
return view
|
||||
.render()
|
||||
.then(() => {
|
||||
return view.afterVisible();
|
||||
})
|
||||
.then(() => {
|
||||
assert.lengthOf(view.$('#suggest-sync'), 1);
|
||||
|
||||
const $suggestSyncEl = view.$('#suggest-sync');
|
||||
assert.include($suggestSyncEl.text(), 'Looking for Firefox Sync?');
|
||||
assert.include($suggestSyncEl.text(), 'Get started here');
|
||||
|
||||
const $getStartedEl = $suggestSyncEl.find('a');
|
||||
assert.equal($getStartedEl.attr('rel'), 'noopener noreferrer');
|
||||
|
||||
assert.isTrue(view.logViewEvent.calledWith('sync-suggest.visible'));
|
||||
});
|
||||
});
|
||||
|
||||
it('does not have sync auth supported', () => {
|
||||
relier.set('service', null);
|
||||
relier.set('context', 'web');
|
||||
|
||||
sinon.stub(view, 'isSyncAuthSupported').callsFake(() => false);
|
||||
return view.render().then(() => {
|
||||
const $getStartedEl = view.$('#suggest-sync').find('a');
|
||||
assert.equal(
|
||||
$getStartedEl.attr('href'),
|
||||
Constants.MOZ_ORG_SYNC_GET_STARTED_LINK
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
it('has sync auth supported on Firefox for Desktop', () => {
|
||||
relier.set('service', null);
|
||||
relier.set('context', 'web');
|
||||
|
||||
sinon.stub(view, 'isSyncAuthSupported').callsFake(() => true);
|
||||
sinon.stub(view, 'getUserAgent').callsFake(() => {
|
||||
return {
|
||||
isFirefoxAndroid: () => false,
|
||||
isFirefoxDesktop: () => true,
|
||||
};
|
||||
});
|
||||
return view.render().then(() => {
|
||||
const $getStartedEl = view.$('#suggest-sync').find('a');
|
||||
assert.equal(
|
||||
$getStartedEl.attr('href'),
|
||||
view.window.location.origin +
|
||||
'/?context=fx_desktop_v3&entrypoint=fxa%3Asignup&service=sync&action=email'
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
it('can be dismissed', () => {
|
||||
relier.set('service', null);
|
||||
relier.set('context', 'web');
|
||||
|
||||
return view.render().then(() => {
|
||||
$('#container').html(view.el);
|
||||
assert.isTrue(view.$('#suggest-sync').is(':visible'), 'visible');
|
||||
view.$('#suggest-sync .dismiss').click();
|
||||
assert.isFalse(view.$('#suggest-sync').is(':visible'), 'hidden');
|
||||
});
|
||||
});
|
||||
|
||||
it('does not display sync suggestion message if there is a relier service', () => {
|
||||
relier.set('service', 'sync');
|
||||
relier.set('context', 'web');
|
||||
|
||||
return view.render().then(() => {
|
||||
assert.lengthOf(view.$('#suggest-sync'), 0);
|
||||
});
|
||||
});
|
||||
|
||||
it('does not display sync suggestion message if there is a subscription product ID set', () => {
|
||||
relier.set('service', null);
|
||||
relier.set('context', 'web');
|
||||
relier.set('subscriptionProductId', 'prod_8675309');
|
||||
|
||||
return view.render().then(() => {
|
||||
assert.lengthOf(view.$('#suggest-sync'), 0);
|
||||
});
|
||||
});
|
||||
|
||||
it('logs the link.signin event', () => {
|
||||
sinon.stub(view, 'isSyncSuggestionEnabled').callsFake(() => true);
|
||||
sinon.stub(view, 'logFlowEvent').callsFake(() => {});
|
||||
|
||||
return view.render().then(() => {
|
||||
assert.isFalse(view.logFlowEvent.calledWith('link.signin'));
|
||||
assert.lengthOf(view.$('a[data-flow-event="link.signin"]'), 1);
|
||||
view.$('a[data-flow-event="link.signin"]').click();
|
||||
assert.isTrue(view.logFlowEvent.calledWith('link.signin'));
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
@ -199,7 +199,6 @@ require('./spec/views/mixins/signin-mixin');
|
|||
require('./spec/views/mixins/signup-mixin');
|
||||
require('./spec/views/mixins/sync-auth-mixin');
|
||||
require('./spec/views/mixins/sync-optional-mixin');
|
||||
require('./spec/views/mixins/sync-suggestion-mixin');
|
||||
require('./spec/views/mixins/timer-mixin');
|
||||
require('./spec/views/mixins/user-card-mixin');
|
||||
require('./spec/views/mixins/verification-reason-mixin');
|
||||
|
|
|
|||
|
|
@ -178,11 +178,11 @@ utm:
|
|||
content:
|
||||
description: |
|
||||
The content on which the user acted. For example, if the user clicked on the
|
||||
"Get started here" link in "Looking for Firefox Sync? Get started here", then
|
||||
the value for this metric would be 'fx-sync-get-started'. The value has a max
|
||||
length of 128 characters with the alphanumeric characters, _ (underscore),
|
||||
forward slash (/), . (period), % (percentage sign), and - (hyphen) in the
|
||||
allowed set of characters.
|
||||
(previously available) "Get started here" link in "Looking for Firefox Sync? Get
|
||||
started here", then the value for this metric would be 'fx-sync-get-started'.
|
||||
The value has a max length of 128 characters with the alphanumeric characters,
|
||||
_ (underscore), forward slash (/), . (period), % (percentage sign), and - (hyphen)
|
||||
in the allowed set of characters.
|
||||
type: string
|
||||
lifetime: ping
|
||||
send_in_pings:
|
||||
|
|
|
|||
|
|
@ -178,11 +178,11 @@ utm:
|
|||
content:
|
||||
description: |
|
||||
The content on which the user acted. For example, if the user clicked on the
|
||||
"Get started here" link in "Looking for Firefox Sync? Get started here", then
|
||||
the value for this metric would be 'fx-sync-get-started'. The value has a max
|
||||
length of 128 characters with the alphanumeric characters, _ (underscore),
|
||||
forward slash (/), . (period), % (percentage sign), and - (hyphen) in the
|
||||
allowed set of characters.
|
||||
(previously available) "Get started here" link in "Looking for Firefox Sync? Get
|
||||
started here", then the value for this metric would be 'fx-sync-get-started'.
|
||||
The value has a max length of 128 characters with the alphanumeric characters,
|
||||
_ (underscore), forward slash (/), . (period), % (percentage sign), and - (hyphen)
|
||||
in the allowed set of characters.
|
||||
type: string
|
||||
lifetime: ping
|
||||
send_in_pings:
|
||||
|
|
|
|||
|
|
@ -26,11 +26,11 @@ export const campaign = new StringMetricType({
|
|||
|
||||
/**
|
||||
* The content on which the user acted. For example, if the user clicked on the
|
||||
* "Get started here" link in "Looking for Firefox Sync? Get started here", then
|
||||
* the value for this metric would be 'fx-sync-get-started'. The value has a max
|
||||
* length of 128 characters with the alphanumeric characters, _ (underscore),
|
||||
* forward slash (/), . (period), % (percentage sign), and - (hyphen) in the
|
||||
* allowed set of characters.
|
||||
* "Get started here" link in the (previously available) "Looking for Firefox Sync? Get
|
||||
* started here", then the value for this metric would be 'fx-sync-get-started'.
|
||||
* The value has a max length of 128 characters with the alphanumeric characters,
|
||||
* _ (underscore), forward slash (/), . (period), % (percentage sign), and - (hyphen)
|
||||
* in the allowed set of characters.
|
||||
*
|
||||
* Generated from `utm.content`.
|
||||
*/
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче