Suggestions for Shopify App Bridge POS documentation

DanAtBonify
Shopify Partner
23 1 12

When trying to setup a POS integration with one of my apps I ran into a couple issues with the Shopify App Bridge documentation that I think warrant some attention. I apologize if some of my notes and/or recommendations are incorrect.

 

1. Outdated App Bridge file referenced:
Where: https://shopify.dev/tools/app-bridge/getting-started
There is a reference to the file: https://unpkg.com/@shopify/app-bridge@1.6.6/umd/index.js.

 

Unfortunately this file is long-outdated and I found that POS functionality was not even included in it (a bit confusing since it's not clear if the preferred JS is to use a specific file version or the magical "@1" link).

 

Using the "https://unpkg.com/@shopify/app-bridge@1" file worked correctly which currently points to version: https://unpkg.com/@shopify/app-bridge@1.17.0/umd/index.js

 

I would recommend the documentation at least referencing a version that includes POS integration.

 

2. Possible TypeScript inclusion (not sure if that's on purpose):
Where: https://shopify.dev/tools/app-bridge/actions/cart
I believe all of the code examples should be vanilla JS and not include TypeScript?
There are a couple places where code examples are written as such:

cart.subscribe(Cart.Action.UPDATE, function (payload: Cart.Payload) {...}

The "payload: Cart.Payload" function parameter causes a fatal error in vanilla JS.


Maybe that info is just in there for reference but I found it confusing when copy/pasting.

 

3. Cart "Set customer" example should use Cart.Action.SET_CUSTOMER
Where: https://shopify.dev/tools/app-bridge/actions/cart#set-customer

 

The current example calls:

cart.dispatch(Cart.Action.FETCH, {
  data: cutomerPayload
});

I believe a better example would be using:

cart.dispatch(Cart.Action.SET_CUSTOMER, {
  data: cutomerPayload
});

4. Confused (and still not sure) what the difference is between Object.Action.ACTION vs. Object.ActionType.ACTION.
It seems like most events are dispatched using the "Object.Action.ACTION" syntax.

 

However, POS for example uses "pos.dispatch(Pos.ActionType.CLOSE);".

 

I am unsure why "ActionType" is used here and not sure if the difference between "Action" and "ActionType" is

documented.

 

 

 

At the end of the day, though, I got the POS integration working. :)

0 Likes
hassain
Shopify Staff (Retired)
Shopify Staff (Retired)
624 103 134

Hey @DanAtBonify ,

 

Thanks for your suggestions. It looks like the App Bridge team has taken these suggestions and made the appropriate fixes to the documentation.

 

Hassain | Developer Support Specialist @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Click Accept as Solution 

0 Likes
policenauts1
Trailblazer
173 13 32

I think it was actually correct the way it was written, I just wasted a ton of time because of this.

 

 pos.dispatch(Pos.Action.CLOSE);
doesn't work.

 

 pos.dispatch(Pos.ActionType.CLOSE);

as it was originally written, apparently, does work.

 

0 Likes