Draft Order extensions positioning incorrect

Extensions
1

Hello,

Had a bit of a eureka moment with a merchant on a call, they described they were looking for our functionality but in a Draft Order. At first I didn’t think it was possible, but sure enough, since 2024-07 Checkout Extensions can render in Draft Order checkout links. Amazing!

Anyway, the problem I want to report is that the placement of Checkout Extensions aren’t correct in Draft Orders specifically.

Steps to reproduce:

  1. Drop a checkout app block to at the very top of the Checkout page.
  2. Publish the change to your theme
  3. Open a normal web checkout, observe that the app block is at the top of the page (:+1: )
  4. Start a draft order, open the share link, but observe that the app block is at the bottom of the page (:-1: )

It’s a minor difference, but the experience should be 1:1 with the online theme editor.

Hope this helps,

2

Hey Dylan,

Thanks for flagging this. It’s possible the behaviour you’ve described could be a result of the feature not being rolled out in its’ entirety, but I’ve reached out to the relevant product team and will update here when I learn more.

3

Hi @Liam-Shopify

No worries, I get it. Actually, I’ve found that this problem is only happening in dev mode (aka shopify app dev), which should be expected since you cannot control positioning in the theme editor in this mode.

In production, I have seen that this works fine. The positioning is correct. I just demo’d to a client using the development mode.

So I’ll mark this one as solved, it’s just a positioning control disparity between dev mode and deployments/theme editor.

1 Like