Merge pull request #15443 from mozilla/FXA-7655

fix(third-party-auth): Don't show Google/Apple login buttons in the Sync flow
mozilla · Jun 14, 2023 · 4b3a68d · 4b3a68d
2 parents 6025bf0 + 6387b99
commit 4b3a68d
Showing 3 changed files with 50 additions and 3 deletions.
diff --git a/packages/fxa-content-server/app/scripts/templates/index.mustache b/packages/fxa-content-server/app/scripts/templates/index.mustache
@@ -43,7 +43,14 @@
     </form>
 
     {{#isInThirdPartyAuthExperiment}}
-      {{{ unsafeThirdPartyAuthHTML }}}
+      {{^isSync}}
+        {{{ unsafeThirdPartyAuthHTML }}}
+      {{/isSync}}
+      {{#isSync}}
+        <p class="text-xs text-grey-500 mb-0 mt-5" id="firefox-family-services">
+          {{#t}}A Firefox account also unlocks access to more privacy-protecting products from Mozilla.{{/t}}
+        </p>
+      {{/isSync}}
     {{/isInThirdPartyAuthExperiment}}
 
     {{^isInThirdPartyAuthExperiment}}

diff --git a/packages/fxa-content-server/app/tests/spec/views/index.js b/packages/fxa-content-server/app/tests/spec/views/index.js
@@ -6,7 +6,10 @@ import $ from 'jquery';
 import { assert } from 'chai';
 import AuthBroker from 'models/auth_brokers/base';
 import AuthErrors from 'lib/auth-errors';
-import { ENTER_EMAIL } from '../../../../tests/functional/lib/selectors';
+import {
+  ENTER_EMAIL,
+  THIRD_PARTY_AUTH,
+} from '../../../../tests/functional/lib/selectors';
 import FormPrefill from 'models/form-prefill';
 import IndexView from 'views/index';
 import { Model } from 'backbone';
@@ -16,7 +19,10 @@ import sinon from 'sinon';
 import User from 'models/user';
 import WindowMock from '../../mocks/window';
 
-const Selectors = ENTER_EMAIL;
+const Selectors = {
+  ...ENTER_EMAIL,
+  THIRD_PARTY_AUTH,
+};
 
 const EMAIL = '[email protected]';
 
@@ -216,6 +222,36 @@ describe('views/index', () => {
             );
           });
         });
+
+        describe('user is in thirdPartyAuth experiment', () => {
+          beforeEach(() => {
+            sinon
+              .stub(view, 'isInThirdPartyAuthExperiment')
+              .callsFake(() => true);
+          });
+
+          it('renders as expected when not sync', () => {
+            return view.render().then(() => {
+              assert.lengthOf(view.$(Selectors.FIREFOX_FAMILY_SERVICES), 0);
+              assert.lengthOf(view.$(Selectors.THIRD_PARTY_AUTH.GOOGLE), 1);
+              assert.lengthOf(view.$(Selectors.THIRD_PARTY_AUTH.APPLE), 1);
+            });
+          });
+          it('renders as expected when sync', () => {
+            relier.set({
+              action: 'email',
+              service: 'sync',
+              serviceName: 'Firefox Sync',
+            });
+            sinon.stub(relier, 'isSync').callsFake(() => true);
+
+            return view.render().then(() => {
+              assert.lengthOf(view.$(Selectors.FIREFOX_FAMILY_SERVICES), 1);
+              assert.lengthOf(view.$(Selectors.THIRD_PARTY_AUTH.GOOGLE), 0);
+              assert.lengthOf(view.$(Selectors.THIRD_PARTY_AUTH.APPLE), 0);
+            });
+          });
+        });
       });
 
       describe('fallback behavior', () => {

diff --git a/packages/fxa-content-server/tests/functional/lib/selectors.js b/packages/fxa-content-server/tests/functional/lib/selectors.js
@@ -784,6 +784,10 @@ module.exports = {
     VPASSWORD: '#vpassword',
     ...CWTS_ENGINES,
   },
+  THIRD_PARTY_AUTH: {
+    GOOGLE: '#google-login-button',
+    APPLE: '#apple-login-button',
+  },
   TOS: {
     HEADER: '#fxa-tos-header',
     LINK_BACK: '#fxa-tos-back',