[BUG]: Google Pay button not appearing, 404 error from pay.google.com domain

[ernestasgobionis]

What happened?

I'm having a problem with using the PaymentRequestButtonElement, specifically with Google Pay. Apple Pay does appear and works as expected on both macOS and iOS Safari browser. However for Google Pay, on macOS the button doesn't appear, and it also doesn't appear in the Payment Request Button docs. On iOS Chrome, the button appears as Apple Pay, as I don't have an Android device I asked someone to test this for me with one, and no button appears on Android side.

I see the following errors on both my own webapp, and the Stripe docs, all of which seem to be related to Google one way or another:

[Report Only] Refused to compile or instantiate WebAssembly module because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self' 'nonce-kmjr9FQp3ReULQE+E9cnGw==' https://js.stripe.com https://b.stripecdn.com https://www.google-analytics.com https://ssl.google-analytics.com https://www.googletagmanager.com 'report-sample'".

[Report Only] Refused to compile or instantiate WebAssembly module because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self' https://pay.google.com"

POST https://pay.google.com//InstantbuyFrontendBuyflowPayframeUi/cspreport 404 POST https://pay.google.com//InstantbuyFrontendBuyflowPayframeUi/cspreport/allowlist 404

Environment

Chrome 105.0.5195.125 on macOS 12.5.1

Reproduction

No response

[martinalong-stripe]

Hi! This is actually the intended behavior. The PaymentRequestButton should show at most one button (or none, if none are available on that particular browser + environment). We realize the way the buttons are presented in the docs makes it seem like the Element should render both simultaneously, and are actively working on editing the docs to correct that!

[ernestasgobionis]

Hi, yes I understood the fact that it only displays one button, and it did work as intended on Safari (both macOS and iOS), however I was having issues with GPay button, as it was not appearing on desktop Chrome, but in the end the button started appearing on mobile devices. My guess is that it has something to do with the payment method setup. Thanks for clarifying!

[martinalong-stripe]

Ahh my bad, I misunderstood. So was it setting up a payment method with Google Pay that solved the issue on mobile?

And is Google Pay now appearing on desktop Chrome as well?

[ernestasgobionis]

For mobile, as I don't have an Android device, I used an emulator with the same Google account which has a payment method set up, and it worked in both my app and in the docs page. However my desktop Chrome with the same account on Mac doesn't show it, maybe it's related to macOS. It was the initial reason for me posting this, as I thought it doesn't work overall, but seems to be just Mac Chrome at the moment.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.