`<pwa-auth>` – enable Sign in with Google with a reduced response when strict privacy mode (Block third-party cookies or InPrivate browsing) is used (until we switch to Google Identity Services for Web). #3343

CetinSert · 2022-09-01T12:04:45Z

This is a

temporary fix for
<pwa-auth> – Sign in with Google fails when Block third-party cookies or InPrivate browsing is turned on #3286
requested by @maraah1 in
<pwa-auth> – Sign in with Google fails when Block third-party cookies or InPrivate browsing is turned on #3286 (comment)
until <pwa-auth> switches to the new Google Identity Services for Web
tracked in
<pwa-auth> – Google is replacing its "Sign-in JavaScript Platform Library" with the new "Identity Services for Web" in March 2023 #3309

PR Type

Bugfix

Describe the current behavior?

See #3286.
Sign in with Google does not work when people Block third-party cookies or use InPrivate browsing.

Describe the new behavior?

See #3286 (comment)
Sign in with Google works with a reduced response (only the email adress, no name or image) when people Block third-party cookies or use InPrivate browsing.

PR Checklist

Test: run npm run test and ensure that all tests pass
Target main branch (or an appropriate release branch if appropriate for a bug fix)
Ensure that your contribution follows standard accessibility guidelines. Use tools like https://webhint.io/ to validate your changes.

Test on our next-gen web playground

See this in production on our next-gen web playground: //rt.ht ⬅️
We recommend using the Windows Sandbox for a clean state.

Test on `pwa-auth-list.glitch.me`

See #3343 (comment) ⬇️

…th a reduced response when strict privacy mode (Block third-party cookies or InPrivate Browsing) is used (until we switch to Google Identity Services for Web as tracked in pwa-builder#3309).

ghost · 2022-09-01T12:04:51Z

Thanks cetinsert for opening a Pull Request! The reviewers will test the PR and highlight if there is any conflict or changes required. If the PR is approved we will proceed to merge the pull request 🙌

ghost · 2022-09-01T12:04:58Z

All CLA requirements met.

…th a reduced response when strict privacy mode (Block third-party cookies or InPrivate Browsing) is used (until we switch to Google Identity Services for Web as tracked in pwa-builder#3309).

CetinSert · 2022-09-01T13:22:05Z

You can also quickly test this with the following steps:

Go to https://pwa-auth-list.glitch.me/
Edit the HTML in DevTools > Sources to apply this single-line change

Exact match of this commit hosted for your convenience: https://ic.rt.ht/google-provider-e3c8088c.js

- <script type="module" src="https://cdn.jsdelivr.net/npm/@pwabuilder/pwaauth@latest/dist/pwa-auth.min.js"></script>
+ <script type="module" src="https://ic.rt.ht/pwa-auth.min.js"></script> <!-- matches the pull request verbatim -->

A version with additional console.warn() calls for your convenience 👈🏻 (click/tap to expand)

- <script type="module" src="https://cdn.jsdelivr.net/npm/@pwabuilder/pwaauth@latest/dist/pwa-auth.min.js"></script>
+ <script type="module" src="https://ic.efn.kr/pwa-auth.min.js"></script> <!-- has console.warn() calls for convenience -->

Use the edited HTML file with DevTools > Overrides

We strongly recommend using Windows Sandbox for testing hygiene.

The following issues from other repositories are welcome to take this temporary fix into account until they also switch to Google Identity Services for Web as suggested to <pwa-auth> earlier here in this issue: #3309.

…th a reduced response when strict privacy mode (Block third-party cookies or InPrivate Browsing) is used (until we switch to Google Identity Services for Web as tracked in pwa-builder#3309).

CetinSert · 2022-09-02T07:32:34Z

With the last 2 commits, we have tested all cases and exhausted developer resources we will dedicate to this workaround.
The ball is in your court now. (We strongly suggest a clean solution implementing #3309.)

(The convenience links mentioned in #3343 (comment) are kept up-to-date and still available for your testing with the above 2 commits included.)

Tested interactions

Third-party cookies	blocked	allowed
Cancel⁺	✔️	✔️
Sign in	✔️	✔️

⁺ tested multiple times

Click/tap here to see the event.data of the 2 message events we await in code 👈🏻 (click/tap to expand)

https://github.com/pwa-builder/PWABuilder/pull/3343/files#diff-62b229f1b1d42d33a5df6960272abc200a98dd71e79a473abf7b5cfb7abba38cR87

  {
    "method": "fireIdpEvent",
    "params": {
      "type": "authResult",
      "clientId": "57804582347-fjts48vf74aujonq0akjmh16ta0kuuak.apps.googleusercontent.com",
      "id": "auth395061",
      "authResult": {
        "scope": "email profile https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/userinfo.profile openid",
        "id_token": "eyJhbGciOiJSUzI1NiIsImtpZCI6IjE3MjdiNmI0OTQwMmI5Y2Y5NWJlNGU4ZmQzOGFhN2U3YzExNjQ0YjEiLCJ0eXAiOiJKV1QifQ.eyJpc3MiOiJhY2NvdW50cy5nb29nbGUuY29tIiwiYXpwIjoiNTc4MDQ1ODIzNDctZmp0czQ4dmY3NGF1am9ucTBha2ptaDE2dGEwa3V1YWsuYXBwcy5nb29nbGV1c2VyY29udGVudC5jb20iLCJhdWQiOiI1NzgwNDU4MjM0Ny1manRzNDh2Zjc0YXVqb25xMGFram1oMTZ0YTBrdXVhay5hcHBzLmdvb2dsZXVzZXJjb250ZW50LmNvbSIsInN1YiI6IjEwMjYyODQ1NTQ5MDkwMTk0NTI2MiIsImVtYWlsIjoiY2V0aW4uc2VydEBnbWFpbC5jb20iLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaWF0IjoxNjYwODc2MTcxLCJleHAiOjE2NjA4Nzk3NzEsImp0aSI6IjAyOTRlYzhiMTViOGMxNDYyNGM3NDZhMGYzZjNkOTZmODczMTA5ZmUifQ.da6OcBgxGctw4eKXVn6vquTwj3mSRnkUwQFFCPpJVRDC6qeGop07vfSwhz2FceR9_QbWt9nFGdbeELY8X47EDARUbCzfNRH80IUQ2BnZ62X3Y-Zrzb8KK1QXR8sBZuA2HubtF6hJ-Rz4FIBAH8nTVdoK68JPIX_kY_3CH_WfcYeZwgLaUj2z9vLo6ScI2l_opGdc12JiyaqSLWAy_HHfY4ooyogIoeiCn8fxTuOYLx3PFoOXyYilf39zhELR70G28kl_Q3rzXyMB4_1xTRGLNn5p76l8HPEhB-xs0-agNsEpjn79GaCDIOQfI5_qNXtUVd88OL7wyJ4s3JolUh7v2w",
        "login_hint": "AJDLj6JTnD9r5nUgBTjHPh9yEse-ZVOAAuXsa0TMIG26duGuqQvjeAHqDZsUu1-mHw6Et__QhInJSlsBKxsE7MtamnbsupuUog",
        "client_id": "57804582347-fjts48vf74aujonq0akjmh16ta0kuuak.apps.googleusercontent.com"
      }
    }
  },

https://github.com/pwa-builder/PWABuilder/pull/3343/files#diff-62b229f1b1d42d33a5df6960272abc200a98dd71e79a473abf7b5cfb7abba38cR100

  {
    "method": "fireIdpEvent",
    "params": {
      "type": "idpError",
      "error": "Cookies are not enabled in current environment."
    },
    "rpcToken": "1227886743.6877475"
  },

CetinSert · 2022-09-02T07:33:07Z

components/pwa-auth/src/google-provider.ts

+ // (Use only a reduced response when people Block third-party cookies or use InPrivate browsing.)
+ const I = auth.signIn();
+ const Y = async signal => {
+ const z = await event('message', { signal, map: e => JP(e.data), find: d => d?.params?.type == 'authResult' });


e.data

{ "method": "fireIdpEvent", "params": { "type": "authResult", "clientId": "57804582347-fjts48vf74aujonq0akjmh16ta0kuuak.apps.googleusercontent.com", "id": "auth395061", "authResult": { "scope": "email profile https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/userinfo.profile openid", "id_token": "eyJhbGciOiJSUzI1NiIsImtpZCI6IjE3MjdiNmI0OTQwMmI5Y2Y5NWJlNGU4ZmQzOGFhN2U3YzExNjQ0YjEiLCJ0eXAiOiJKV1QifQ.eyJpc3MiOiJhY2NvdW50cy5nb29nbGUuY29tIiwiYXpwIjoiNTc4MDQ1ODIzNDctZmp0czQ4dmY3NGF1am9ucTBha2ptaDE2dGEwa3V1YWsuYXBwcy5nb29nbGV1c2VyY29udGVudC5jb20iLCJhdWQiOiI1NzgwNDU4MjM0Ny1manRzNDh2Zjc0YXVqb25xMGFram1oMTZ0YTBrdXVhay5hcHBzLmdvb2dsZXVzZXJjb250ZW50LmNvbSIsInN1YiI6IjEwMjYyODQ1NTQ5MDkwMTk0NTI2MiIsImVtYWlsIjoiY2V0aW4uc2VydEBnbWFpbC5jb20iLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaWF0IjoxNjYwODc2MTcxLCJleHAiOjE2NjA4Nzk3NzEsImp0aSI6IjAyOTRlYzhiMTViOGMxNDYyNGM3NDZhMGYzZjNkOTZmODczMTA5ZmUifQ.da6OcBgxGctw4eKXVn6vquTwj3mSRnkUwQFFCPpJVRDC6qeGop07vfSwhz2FceR9_QbWt9nFGdbeELY8X47EDARUbCzfNRH80IUQ2BnZ62X3Y-Zrzb8KK1QXR8sBZuA2HubtF6hJ-Rz4FIBAH8nTVdoK68JPIX_kY_3CH_WfcYeZwgLaUj2z9vLo6ScI2l_opGdc12JiyaqSLWAy_HHfY4ooyogIoeiCn8fxTuOYLx3PFoOXyYilf39zhELR70G28kl_Q3rzXyMB4_1xTRGLNn5p76l8HPEhB-xs0-agNsEpjn79GaCDIOQfI5_qNXtUVd88OL7wyJ4s3JolUh7v2w", "login_hint": "AJDLj6JTnD9r5nUgBTjHPh9yEse-ZVOAAuXsa0TMIG26duGuqQvjeAHqDZsUu1-mHw6Et__QhInJSlsBKxsE7MtamnbsupuUog", "client_id": "57804582347-fjts48vf74aujonq0akjmh16ta0kuuak.apps.googleusercontent.com" } } },

CetinSert · 2022-09-02T07:34:15Z

components/pwa-auth/src/google-provider.ts

+ try { return this.getSignInResultFromUser(await I); }
+ catch (q) { return x ; }
+ };
+ const N = async signal => { event('message', { signal, map: e => JP(e.data), find: d => d?.params?.type == 'idpError' }).then(_ => wait.twice = true);


e.data

{ "method": "fireIdpEvent", "params": { "type": "idpError", "error": "Cookies are not enabled in current environment." }, "rpcToken": "1227886743.6877475" },

amrutha95 · 2022-09-27T16:53:14Z

Hey @CetinSert, you say this is a temporary fix. Does that mean that when we move to Google Identity Services for Web this will no longer be needed? In that case, could we prioritize that over this?

CetinSert · 2022-09-27T17:36:20Z

Hey @CetinSert, ... Does that mean that when we move to Google Identity Services for Web this will no longer be needed? In that case, could we prioritize that over this?

@amrutha95 That was my understanding, so I assume: yes, and yes.
I will confirm in 12 hours to ensure we don't misprioritize.

CetinSert · 2022-09-28T03:06:36Z

@amrutha95 –

Hey @CetinSert, you say this is a temporary fix. Does that mean that when we move to Google Identity Services for Web this will no longer be needed? In that case, could we prioritize that over this?

I say this is temporary because,

Platform Library will stop existing in April 2023 and already does not work with new Client IDs.
This quick patch is only usable until April 2023 and only works for existing Client IDs.

@amrutha95 –

Hey @CetinSert, you say this is a temporary fix. Does that mean that when we move to Google Identity Services for Web this will no longer be needed? In that case, could we prioritize that over this?

@amrutha95, @nmetulev – I have just confirmed this for you:

❌ Platform Library (old) explicitly mentions incompatibility with third-party cookie blocking:
https://developers.google.com/identity/sign-in/web/troubleshooting#third-party_cookies_and_data_blocked
✔️ Identity Services (new) suggests using incognito (third-party cookie blocking support):
https://developers.google.com/identity/gsi/web/guides/migration#sign-in_from_any_page_with_one_tap:~:text=can%20switch%20to-,Incognito,-mode%20to%20reset

@amrutha95 –

Hey @CetinSert, you say this is a temporary fix. Does that mean that when we move to Google Identity Services for Web this will no longer be needed? In that case, could we prioritize that over this?

Yes! Please also note the following!!

https://developers.google.com/identity/sign-in/web/reference

We are discontinuing the Google Sign-In JavaScript Platform Library for web. The library will be unavailable for download after the March 31, 2023 deprecation date. Instead, use the new Google Identity Services for Web.
By default, newly created Client IDs are now blocked from using the older Platform Library, existing Client IDs are unaffected. New Client IDs created before July 29th, 2022 can set plugin_name to enable use of the Google Platform Library.

⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️

Google Platform Library already doesn't accept new clients! So,
Google support of <pwa-auth> is utterly broken for new clients.

⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️⚠️

Please prioritize

<pwa-auth> – Google is replacing its "Sign-in JavaScript Platform Library" with the new "Identity Services for Web" in March 2023 #3309

amrutha95 · 2022-09-29T17:23:31Z

@CetinSert is it possible for you to help us with migrating to the new library? And thanks for finding out all this info. We will definitely make sure to get this done before deprecation.

CetinSert · 2022-09-29T17:28:46Z

@amrutha95 – unfortunately, I do not have time to perform the migration for you.

I will be looking forward to your work on it though!
<pwa-auth> is a true gem and I hope to keep using it in the future too.

amrutha95 · 2022-09-29T17:38:37Z

@CetinSert got it. If that changes before we prioritize it please let us know. We are working on adding authentication for PWABuilder using pwa-auth, so we will have to get to this sooner rather than later. You also mentioned you have found your workaround for it for now. I think we can keep this as a known issue rather than fixing something that is going to change anyway. What do you think?

CetinSert · 2022-09-30T13:10:06Z

@CetinSert got it. If that changes before we prioritize it please let us know. We are working on adding authentication for PWABuilder using pwa-auth, so we will have to get to this sooner rather than later. You also mentioned you have found your workaround for it for now. I think we can keep this as a known issue rather than fixing something that is going to change anyway. What do you think?

Yes, please do so. Thank you. I am closing this pull request now.

CetinSert added 2 commits September 1, 2022 20:48

Temporarily address pwa-builder#3286 to enable Sign in with Google wi…

e7f898e

…th a reduced response when strict privacy mode (Block third-party cookies or InPrivate Browsing) is used (until we switch to Google Identity Services for Web as tracked in pwa-builder#3309).

Temporarily address pwa-builder#3286 to enable Sign in with Google wi…

f0bdfe7

…th a reduced response when strict privacy mode (Block third-party cookies or InPrivate Browsing) is used (until we switch to Google Identity Services for Web as tracked in pwa-builder#3309).

CetinSert added 2 commits September 1, 2022 21:05

Temporarily address pwa-builder#3286 to enable Sign in with Google wi…

1e202d3

…th a reduced response when strict privacy mode (Block third-party cookies or InPrivate Browsing) is used (until we switch to Google Identity Services for Web as tracked in pwa-builder#3309).

Temporarily address pwa-builder#3286 to enable Sign in with Google wi…

18cb4ff

…th a reduced response when strict privacy mode (Block third-party cookies or InPrivate Browsing) is used (until we switch to Google Identity Services for Web as tracked in pwa-builder#3309).

CetinSert added 2 commits September 1, 2022 22:43

Temporarily address pwa-builder#3286 to enable Sign in with Google wi…

867e823

…th a reduced response when strict privacy mode (Block third-party cookies or InPrivate Browsing) is used (until we switch to Google Identity Services for Web as tracked in pwa-builder#3309).

Temporarily address pwa-builder#3286 to enable Sign in with Google wi…

218c6f2

…th a reduced response when strict privacy mode (Block third-party cookies or InPrivate Browsing) is used (until we switch to Google Identity Services for Web as tracked in pwa-builder#3309).

Correctly handle cancelling the flow by closing the popup more than once

52b2c0b

nmetulev requested a review from amrutha95 September 1, 2022 16:45

CetinSert added 2 commits September 2, 2022 15:38

refactor internal helper matchingEvent → event

99d67f7

handle cancellations when third-party cancellations are *not* blocked.

2ee9fda

CetinSert commented Sep 2, 2022

View reviewed changes

remove console.warn() calls

59332e6

CetinSert closed this Sep 30, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

`<pwa-auth>` – enable Sign in with Google with a reduced response when strict privacy mode (Block third-party cookies or InPrivate browsing) is used (until we switch to Google Identity Services for Web). #3343

`<pwa-auth>` – enable Sign in with Google with a reduced response when strict privacy mode (Block third-party cookies or InPrivate browsing) is used (until we switch to Google Identity Services for Web). #3343

CetinSert commented Sep 1, 2022 •

edited

Loading

ghost commented Sep 1, 2022

ghost commented Sep 1, 2022 •

edited by ghost

Loading

CetinSert commented Sep 1, 2022 •

edited

Loading

CetinSert commented Sep 2, 2022 •

edited

Loading

CetinSert Sep 2, 2022 •

edited

Loading

CetinSert Sep 2, 2022

amrutha95 commented Sep 27, 2022

CetinSert commented Sep 27, 2022 •

edited

Loading

CetinSert commented Sep 28, 2022 •

edited

Loading

amrutha95 commented Sep 29, 2022

CetinSert commented Sep 29, 2022 •

edited

Loading

amrutha95 commented Sep 29, 2022

CetinSert commented Sep 30, 2022

<pwa-auth> – enable Sign in with Google with a reduced response when strict privacy mode (Block third-party cookies or InPrivate browsing) is used (until we switch to Google Identity Services for Web). #3343

<pwa-auth> – enable Sign in with Google with a reduced response when strict privacy mode (Block third-party cookies or InPrivate browsing) is used (until we switch to Google Identity Services for Web). #3343

Conversation

CetinSert commented Sep 1, 2022 • edited Loading

PR Type

Describe the current behavior?

Describe the new behavior?

PR Checklist

Test on our next-gen web playground

Test on pwa-auth-list.glitch.me

ghost commented Sep 1, 2022

ghost commented Sep 1, 2022 • edited by ghost Loading

CetinSert commented Sep 1, 2022 • edited Loading

CetinSert commented Sep 2, 2022 • edited Loading

Tested interactions

CetinSert Sep 2, 2022 • edited Loading

Choose a reason for hiding this comment

CetinSert Sep 2, 2022

Choose a reason for hiding this comment

amrutha95 commented Sep 27, 2022

CetinSert commented Sep 27, 2022 • edited Loading

CetinSert commented Sep 28, 2022 • edited Loading

Yes! Please also note the following!!

amrutha95 commented Sep 29, 2022

CetinSert commented Sep 29, 2022 • edited Loading

amrutha95 commented Sep 29, 2022

CetinSert commented Sep 30, 2022

`<pwa-auth>` – enable Sign in with Google with a reduced response when strict privacy mode (Block third-party cookies or InPrivate browsing) is used (until we switch to Google Identity Services for Web). #3343

`<pwa-auth>` – enable Sign in with Google with a reduced response when strict privacy mode (Block third-party cookies or InPrivate browsing) is used (until we switch to Google Identity Services for Web). #3343

CetinSert commented Sep 1, 2022 •

edited

Loading

Test on `pwa-auth-list.glitch.me`

ghost commented Sep 1, 2022 •

edited by ghost

Loading

CetinSert commented Sep 1, 2022 •

edited

Loading

CetinSert commented Sep 2, 2022 •

edited

Loading

CetinSert Sep 2, 2022 •

edited

Loading

CetinSert commented Sep 27, 2022 •

edited

Loading

CetinSert commented Sep 28, 2022 •

edited

Loading

CetinSert commented Sep 29, 2022 •

edited

Loading