Going live with checkout UI extension

[Nicolas_TheOz]

Hi,

I'm working on a checkout UI Extension that is supposed to render a component in a static zone : Checkout::ShippingMethods::RenderAfter and another one in a dynamic zone. Checkout::Dynamic::Render

Everything is going fine in development as soon as I work in a development store were UI extension preview is activated: the two extensions are running and displaying properly.

Then, I deploy the app with the CLI, create a version and activate it in the partner portal and try use it for real... And I'm stuck here !

The extension doesn't render in the static zone and the theme builder do not show the app in the checkout app so I cannot put it in a dynamic zone...

I've tested to install the app in a developement store with UI extension preview activated, in a shopify plus development store and even in the shopify plus store of the customer (the app is a single time install)

What am I doing wrong ?

Thank you for your help in advance

[AGolchenko]

Hey Nicolas. Faced the same problem. It is not clear how to make the extension work on the live store. Let me know if you made it.

[stevewalkr]

We've faced the same problem, filed a report with Shopify Support last week and not heard anything despite chasing them every day this week 😞

We have an app ready to go - the checkout extension works fine in our dev environment but when we deploy to fly.io and update the app urls and test, the admin area of our app works perfectly but we cannot get our checkout extension to display.

If I hear back from their support with any help I'll post it here, really frustating...

[AGolchenko]

we have a situation exactly as you described - an application on fly.io, it works, but the extension is not displayed in the checkout.
I also wrote to support, but no answer (((

I see that lately there are almost no answers from Shopify experts.😥

Did you have a problem with the initial extension code in react?
When I launched the preview, I had an error in the console, as it turned out, react is not supported in the extension, and in order for it to work, you need to install a third-party library https://github.com/Shopify/ui-extensions/tree/main/packages/checkout-ui -extensions-react
I spent a lot of time figuring this out

[stevewalkr]

Did you manage to resolve the issue?

[stevewalkr]

FYI - I am getting suspicious that Shopify have released this at a Developer level, but have not sent it live on their production level - if so, it means they have people like us investing our time and money into coding things which dont actually yet work, and not letting us know when it will be live.

I hope this is not the case, but the lack of any updates from them - now a full week - is pretty suspect.

[stevewalkr]

Replies from support suggest that it is live and this should be working. 

[stevewalkr]

Update from their support:

"Our development team reviewed all the details you provided regarding the issue you were experiencing with testing your app, however they have determined that the nature of the issue being an issue with deploying a checkout UI extension and not an API issue, it is out of scope of support for the team to support. They did have a few suggestions they were able to provide, such as checking whether the checkout extension is deploying properly on fly.io. Unfortunately, we are not able to access your third party deployment settings, so this would need to be done on your own."

[AGolchenko]

I haven't solved this problem yet, I've been working on other tasks. But I was hoping to get a clear answer from Shopify support 😞
I also received an email from the developers, they asked for more details of my problem. But I think the answer will be similar to what they wrote to you (((
I don't understand how the problem can be related to the deployment to the hosting if the app itself works.
But just in case, I'll try to upload the app to Heroku. I'll let you know the result.

[AGolchenko]

I uploaded the app to Heroku, the result is the same 😞

[Nicolas_TheOz · Accepted solution]

Hello,

It seems that at the moment the build process is causing a problem.

When I created the extensions, I split the code, into several files and made imports to use the separate parts of the code.

In the development environment, everything works fine, but as soon as the code is compiled, it seems that the bundles are not packaged properly and the code cannot be executed.

I had to put everything in one file to get the extension to work for production.

One last important thing, the checkout extensibility is gradually being rolled out to some Plus Merchants, and has not been rolled out to all stores. You may be required to ask Shopify to enable it in order to deploy it to your store.

[stevewalkr]

Thank you - we are checking and will update you.

[stevewalkr]

OK - so, we are not Certified Plus Developers 😞 Which I believe means we cannot even develop on a Plus sandbox, let alone publish it. 

Seems amazing Shopify partner support didn't look at our account and say "Check extension is for Plus partners only"...?

[AGolchenko]

In my case, a Shopify+ store with an unlocked checkout.liquid
I generated and published the default extension code (banner) but it is not displayed.

[stevewalkr]

Appreciate the feedback. We have realised we are not able to use checkout extension as we are not Plus Developers, so we are looking for different ways to provide our discount logic - possibly Functions can do what we want.

[AGolchenko]

Good luck and happy holidays 🙂