In my embedded POS application, I am creating a Cart object (on cart page).
However when I perform any actions on the cart I get no response back.
I did verify that I have permissions to access the cart.
const AppBridge = window['app-bridge'];
const actions = window['app-bridge'].actions;
const createApp = AppBridge.createApp;
const Cart = actions.Cart;
const app = createApp({
apiKey: 'foo',
shopOrigin: 'foobar.myshopify.com'
});
// Verify that you have permissions to the cart
app.getState().then((state) => {
console.info('App State: %o', state)
}).catch(error => {
alert(error);
});
// The above returns this data. Hence I know that I have access to Cart
{
..
Cart: { UPDATE: {Subscribe: true, Dispatch: true}, FETCH: {Subscribe: true, Dispatch: true} .....
}
const cart = Cart.create(app);
cart.subscribe(Cart.Action.FETCH, function (payload) {
// ---> This callback never executes
$("#container2").html(JSON.stringify(payload));
});
cart.subscribe(Cart.Action.UPDATE, function (payload) {
// ---> This callback never executes too
// do something here
});
// ok let's try this
app.featuresAvailable(Group.Cart).then(function (state) {
--> this call back doesn't fire too...
});
cart.dispatch(Cart.Action.FETCH);
I feel like there’s something very basic that I am missing. Can someone pls assist.

