Shopify / js-buy-sdk

The JS Buy SDK is a lightweight library that allows you to build ecommerce into any website. It is based on Shopify's API and provides the ability to retrieve products and collections from your shop, add products to a cart, and checkout.

Home Page:https://shopify.github.io/js-buy-sdk

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

completedAt: null, order: null on checkout object after a successful checkout flow

mud1 opened this issue · comments

Hi all!

Bug details

Describe the bug
I create a checkout object with the Shopify Buy SDK client, that has a checkoutId.
The checkoutId is saved to localStorage so it can be accessed later.
When the user finishes the checkout flow (via client.webUrl), my custom script written in the Shopify Admin (Settings -> Checkout -> Additional scripts) redirects back the customer to my site's "successful checkout" page.
This page gets the checkout object again, with the updated data, completedAt with the date, order: object with order details.
It stopped working.
Now, the Shopify Buy SDK client returns back an outdated checkout object for the same checkoutId!
It worked before perfectly fine.

To Reproduce
Steps to reproduce the behaviour:

  1. checkout = await state.client.checkout.fetch(checkoutId);
  2. Complete the checkout via Shopify's checkout flow
  3. Fetch the checkout with the same checkoutId
  4. completedAt: null, order: null

Network details
x-request-id: c38e0d5f-c0a6-4a57-bab5-d441b74f63b9
x-shopify-api-version: 2022-07
x-sdk-version: 2.16.1

Expected behavior
The checkout object that is returned is updated with the completedAt property and order (and possibly other) property.
Should work as before.

Environment (please complete the following information):

  • OS: All OS
  • Browser: All browsers
  • SDK Version: ^2.16.1 (current version my app depdends on)
  • Shopify Plan: Shopify Lite

shopify-checkout-completedat-null

It's still not working. Could you please check the request id?
Do you need more information?
Anyone else experiencing this issue?

A client's e-commerce site went down completely due to a very similar issue. No updates to the code. orderStatusUrl was no longer populating.

@NikoD-93 Did you solve the issue?
I did a workaround to get some property via query string, but it's not ideal.
Had to implement some additional checks in the checkout flow after the successful order.
I still think it's a bug in the Shopify Buy SDK and/or the Storefront API / other Shopify API.
They updated their codebase and now it's not working anymore.

You aren't alone my friend!

Store was working as intended and now for some reason this value isn't getting updated after a customer completes the checkout process.

I opened a ticket and after some back and forth they told me they identified and fixed the problem but still seems to not work.

Will report back here if I find out more!

I'm also having this issue. completedAt is null even after completing checkout. This breaks sites for any customer who wants to make a 2nd purchase.

Do you guys have any ideas for a workaround? This seems like this taking a long time to be fixed!

What was the alternative solution that you decided to go with?

I'm afraid we may have to find another solution as well for the time being

If you don't mind sharing! @NikoD-93 :)

I am having the same problem here. I would really appreciate it if anyone can share the solution.

+1
completedAt is null even after completing checkout. This breaks sites for any customer who wants to make a 2nd purchase.

+1
completedAt and order are null after checkout. I reverted back to 2.11.0 which worked for me before but it's still broken. It's possible the issue is at the source and not this client. This is the second time this month I've had issues with Shopify that were on Shopify's side.

On the order status page we should be able to use the additional scripts field to add an order completed cookie and then read this cookie in the app to determine when to clear out the old checkout.

It's not an ideal fix but it should help until this gets properly fixed.

+1 completedAt and order are null after checkout. I reverted back to 2.11.0 which worked for me before but it's still broken. It's possible the issue is at the source and not this client. This is the second time this month I've had issues with Shopify that were on Shopify's side.

Yes, it seems that this is affecting old API versions. People's shops are breaking with zero code changes. Not good!

It's most likely an issue with the Storefront API not the client SDK. However, I opened the ticket here for them to notice. After all, the problem affects the client SDK, so in turn it affects the custom apps as well.

In the meantime what I did if anyone is interested:
Shopify Admin page -> Settings -> Checkout -> Additional scripts (here you can inject custom scripts):

<script>
	if (window.location.pathname.indexOf('checkouts') !== -1) {
	    window.location = `{my-domain}/checkout-success?order={{checkout.order.order_number}}&customer={{checkout.customer.first_name}}`;
	}
</script>

This way I could grab the data I needed for my custom checkout page from the query params.
In my React app's context:

// WORKAROUND: Shopify Buy SDK has a bug right now (2022-10-12) and does not set completedAt.
if (window.location.pathname.includes('checkout-success')) {
checkout = await state.client.checkout.create();
}

Hope this helps someone.

Thank you so much @mud1 , it worked and helped me a lot!
I have also contacted Shopify Partner Support and hoping the developers to solve the issue.

This is a big issue for me as well. I'm using this library https://github.com/Shopify/buy-button-js (as linked into remote issue via GitHub). I don't have a custom checkout page so I'm not sure if I could use this workaround.

Could this be permission issue + failed documentation? I have unauthenticated_write for checkouts but maybe I need to add read, even though I understood it to be implicitly allowed with write ?

The storefront API started returning the correct values again for me sometime between Wednesday and now.