Currently we have Checkout UI Extension targets inside the “Pickup” tab for:
- purchase.checkout.pickup-location-list.render-after
- purchase.checkout.pickup-location-list.render-before
- purchase.checkout.pickup-location-option-item.render-after
As per docs none of these will render when no pickup locations are available for these items.
To add to this - if there are items in the cart that are not available at all pickup locations, there is no way to detect whether a customer is currently on the “Ship” tab or “Pickup” tab if they haven’t entered a delivery address. The deliveryGroups array will be empty in both cases.
When customers are viewing the “Pickup” tab I’m wanting to display a message when they have an item (or items) that aren’t available for pickup, along with the ability for them to remove the relevant (unavailable) items from their cart and continue checking out.
Currently, my only option is to use a checkout block target, but this is visible both for “Ship” and “Pickup” tabs, with no way to detect the current view when deliveryGroups array is empty.
Here are some proposed solutions:
- Add a UI Extension target for the “Pickup” tab that is outside of the locations
- Add an additional field in the api somewhere which tells us whether a customer is viewing “Ship” vs “Pickup”
- Populate the deliveryGroups array even when the data is not complete - i.e. before a customer fills in delivery address
Any help/feedback would be appreciated.
Cheers,
Dean
Bump. Would anyone from Shopify like to chime in?
Hi @meandillar, sorry we missed this.
At the moment, this is the current behavior:
-
When pickup is the only available path, checkout automatically selects Pickup. In that case, deliveryGroups is populated.
-
If the cart has one or more pickup-only items and one or more ship-only items, checkout automatically selects Pickup, deliveryGroups is not populated, and a message is shown for the items that can’t be picked up:
- If the cart has items that are pickup-eligible, but no single pickup location can fulfill the full cart, checkout keeps Pickup selected,
deliveryGroups is not populated, and this message is shown:
- For ship-only carts, the Pickup tab disappears and
deliveryGroups is not populated.
It sounds like you’re trying to find a workaround for #3 scenarios. Since Pickup is selected in those scenarios by default, and a customer interested in pickup would be viewing that tab, I’d recommend trying purchase.checkout.pickup-location-list.render-before for custom messaging in the Pickup tab.
@Paige-Shopify Thanks for getting back to me.
As per my description of the problem above, purchase.checkout.pickup-location-list.render-before will not render at all when no pickup locations are available for the items, because deliveryGroups field is not populated. This is the case for all pickup-location-list targets.
Further to this, the only way I’ve managed to get that target to render when no locations are available is if a customer first fills in their shipping details, which populates the deliveryGroups field. This is not a solution as we cannot expect a customer to fill in shipping details if they are arriving at checkout and selecting “pickup”.
I believe this behaviour is not a “bug” per se, but more of a hole in the functionality, and with a simple update to the API this would not be a problem. My proposed solution from the original post would be a simple fix - populate the deliveryGroups array when the customer first arrives at checkout, rather than waiting for them to fill out their delivery address.
Thanks for clarifying.
I was able to reproduce what you’re seeing. In the scenario where Pickup is visible and selected but no pickup location can fulfill the cart, the pickup-location-list targets don’t render.
I’ll raise this internally, including the gap you called out around deliveryGroups not being populated early enough for apps to use.
