Solved

Checkout UI Extension, can't change points

Max_V
Shopify Partner
4 0 1

I made new extension (checkout UI) and I tried to add my custom form in some place in checkout. I use this documentation, but I can add just in (Checkout::Dynamic::Render) point. And when I tried to change this point for example to (Checkout::Dynamic::Render [Payment2]) and it doesn't work for me.

I tried change to other's place (points) but it's not helped me.

1 – Why can't I render my component somewhere else?

 

 

render('Checkout::Dynamic::Render [Payment1]', () => <AppFormOne />); // doesn't work
render('Checkout::Dynamic::Render', () => <AppFormTwo />); //works

 

 

2 – Is there a way to trigger the create order functionality (simulate clicking on the “place order” button) from within my component? Or is it completely isolated?


Accepted Solution (1)

Liam
Shopify Staff
2731 302 778

This is an accepted solution.

Hi Max_V,

 

It looks like the Checkout::Dynamic::Render extension point you're using is not valid when extended to a custom payment option - I'd refer back to these docs to see the correct format for using dynamic extension points. 

 

As for the second question, it does look like there's no way to programmatically simulate clicking the "Place Order" button from a Shopify Checkout Extension. The extensions are indeed isolated for security and user experience reasons, so they don't have the ability to interact with core checkout functions like this. Checkout Extensions are primarily designed for adding custom UI components, not for altering the core checkout behavior. Instead you could trigger an order with the Admin API and create an order without processing a payment - this doc will show you how this is possible. 

 

Hope this helps!

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

View solution in original post

Reply 1 (1)

Liam
Shopify Staff
2731 302 778

This is an accepted solution.

Hi Max_V,

 

It looks like the Checkout::Dynamic::Render extension point you're using is not valid when extended to a custom payment option - I'd refer back to these docs to see the correct format for using dynamic extension points. 

 

As for the second question, it does look like there's no way to programmatically simulate clicking the "Place Order" button from a Shopify Checkout Extension. The extensions are indeed isolated for security and user experience reasons, so they don't have the ability to interact with core checkout functions like this. Checkout Extensions are primarily designed for adding custom UI components, not for altering the core checkout behavior. Instead you could trigger an order with the Admin API and create an order without processing a payment - this doc will show you how this is possible. 

 

Hope this helps!

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog