Social Auth: Introduce calypso_social_auth_attempt event

[zaguiini]

Proposed Changes

The new event calypso_social_auth_attempt will differentiate actual errors in the authentication workflow from attempts. It handles both login:

• unknown_user when the user tries to social login with an account not yet registered;
• user_exists when the user tries to social login with an account that was registered using an e-mail and password;

and sign up:

• user_exists when the user tries to social sign up with an account that was registered using an e-mail and password;

Testing Instructions

See "Testing Instructions" in #64957 to set up a working wpcalypso.wordpress.com environment on your local machine.

Open the DevTools and write localStorage.setItem('debug', 'calypso:analytics'); so you can see the events being dispatched in the console.

Open https://wpcalypso.wordpress.com/log-in and try to social login with an account not yet registered with WPCOM:

• calypso_social_auth_attempt should've been dispatched with
  • social_account_type: 'google'
  • starting_point: 'login'
  • error_code: 'unknown_user'

Open https://wpcalypso.wordpress.com/log-in and try to social login with an account that was registered using an e-mail and password:

• calypso_social_auth_attempt should've been dispatched with
  • social_account_type: 'google'
  • starting_point: 'login'
  • error_code: 'user_exists'

Open https://wpcalypso.wordpress.com/start/user and try to social sign-up with an account that was registered using an e-mail and password:

• calypso_social_auth_attempt should've been dispatched with
  • social_account_type: 'google'
  • starting_point: 'signup'
  • error_code: 'user_exists'

Related to #65896.

[github-actions]

Calypso Live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-38538

Jetpack Cloud live (direct link)

https://calypso.live?image=registry.a8c.com/calypso/app:build-38538&env=jetpack

[matticbot]

Here is how your PR affects size of JS and CSS bundles shipped to the user's browser:

App Entrypoints (~110 bytes added 📈 [gzipped])

name         parsed_size           gzip_size
entry-login       +248 B  (+0.0%)     +110 B  (+0.0%)

Common code that is always downloaded and parsed every time the app is loaded, no matter which route is used.

Sections (~115 bytes added 📈 [gzipped])

name             parsed_size           gzip_size
jetpack-connect       +257 B  (+0.0%)     +115 B  (+0.0%)
accept-invite         +180 B  (+0.0%)      +51 B  (+0.1%)

Sections contain code specific for a given set of routes. Is downloaded and parsed only when a particular route is navigated to.

Async-loaded Components (~117 bytes added 📈 [gzipped])

name                          parsed_size           gzip_size
async-load-design-blocks           +248 B  (+0.0%)     +114 B  (+0.0%)
async-load-signup-steps-user       +180 B  (+0.1%)      +51 B  (+0.1%)

React components that are loaded lazily, when a certain part of UI is displayed for the first time.

Legend

What is parsed and gzip size?

Parsed Size: Uncompressed size of the JS and CSS files. This much code needs to be parsed and stored in memory.
Gzip Size: Compressed size of the JS and CSS files. This much data needs to be downloaded over network.

Generated by performance advisor bot at iscalypsofastyet.com.