Our Partner & Developer boards on the community are moving to a brand new home: the .dev community forums! While you can still access past discussions here, for all your future app and storefront building questions, head over to the new forums.

Checkout UI Extension preview in editor (design_mode)

Solved

Checkout UI Extension preview in editor (design_mode)

ArchitechproOU
Shopify Partner
104 2 19

Hi,

We have created a checkout UI extension that works well for test checkouts, but the block is not rendered during the preview in checkout editor (Thank you page): 

checkout_extension_preview.png

 

For theme app blocks in similar situations we use the following code:

{% if request.design_mode %}


We checked available documentation but can't find any way to create a conditional logic for editor preview / real execution modes. Any help will be highly appreciated.

Accepted Solution (1)

tattran86
Shopify Partner
2 1 1

This is an accepted solution.

You can use useExtensionEditor() to check the type of editor. This hook will return {type: "checkout"} when you preview in the editor and return undefined on the thank you page.

View solution in original post

Reply 1 (1)

tattran86
Shopify Partner
2 1 1

This is an accepted solution.

You can use useExtensionEditor() to check the type of editor. This hook will return {type: "checkout"} when you preview in the editor and return undefined on the thank you page.