Can't add sample app to a development store: OAuth Same Site Cookie issue

[jasonkliu]

Issue summary

Can't add sample app to a development store: OAuth Same Site Cookie issue

Expected behavior

App should be added to the store.

Actual behavior

On Chrome 107: The app couldn’t be loaded

This app can’t load due to an issue with browser cookies. Try enabling cookies in your browser, switching to another browser, or contacting the developer to get support.

On Safari 16.0: The application can’t be loaded with the current version of Safari, try clearing your cookies or using another browser.

Steps to reproduce the problem

1. Create a sample app with npm init @shopify/app@latest. It ships with @shopify/shopify-api 5.0.0 but the issue also exists with 5.2.0.
2. Deploy the app to fly.io using https://shopify.dev/apps/deployment/web
3. Try to install and launch the app on a development store

I had a working app on a development store yesterday and it stopped working today. I can reproduce this just with the sample template. I tried creating a new development store which did not solve the issue.

The app seems to be installed in the store but I cannot click into it and it gives an error message. It follows this URL pattern:

https://a.myshopify.com/admin/oauth/authorize?client_id=a&scope=write_products&redirect_uri=https://a.fly.dev//api/auth/callback&state=offline_1&grant_options[]=

https://a.myshopify.com/admin/oauth/request_grant?access_change_uuid=a&client_id=a

https://a.myshopify.com/admin/oauth/post_grant?access_change_uuid=a&client_id=a

https://a.myshopify.com/admin/apps?app_id=a&oauth_error=same_site_cookies

[bhaskarmurthy]

Same issue here

[cquemin]

@bhaskarmurthy You have the same issue as @jasonkliu , but did you create your app more recently. I am wondering if v6, which is now shipped with npm init @shopify/app@latest, fixes the problem? I have just tried with a brand new app and it was successfully added to my test store, however I did locally. This would suggest an issue with the deployment to fly.io

@jasonkliu when you say gives an error message what error are you seeing and where?

[bhaskarmurthy]

Not the same issue - I'm using the JS sdk directly, not using the @shopify/app flow as you mentioned. I'm also not using fly.io - so it could be unrelated.

[jasonkliu]

@cquemin Thank you for taking a look at this!

I created a new app with npm init @shopify/app@latest, and the generated output is here: https://github.com/jasonkliu/shopify-sample-6.1.0

Seems like it is working now. Couple things I learned:

• Node 14 doesn't look like it works with 6.1.0 any more. Switching to v16.14.0 worked for me
• There's an issue with sqlite3 on a M1 Mac with macOS 12.1. Downgrading sqlite3 from 5.1.4 to 5.0.8 makes it work again.

I was able to deploy it to fly.io and access the live app.

[cquemin]

Thanks for the details @jasonkliu. These are both very useful to know. I will close this one then.