Shopify Mobile does not provide working alternative for Contextual Save Bar, cannot perform actions in Shopify Mobile on such page

[excitexcite]

Describe the bug

Unable to perform save/cancel actions in Shopify Mobile andoird app. For these actions for browser version I use Contextual Save Bar. The tick and the cross are shown instead of contextual save bar in Shopify Mobile, but they do nothing.

To Reproduce

Steps to reproduce the behaviour:

1. Launch Shopify Mobile for android
2. Open your embeded app
3. Open the page, where you use Contextual Save Bar for performing actions (to save an entity for example).
4. Click tick/cross
5. Nothing happens, no action perfromed.

Expected behaviour

Shopify guidelines encourage us to use shopify app bridge components, so I expect to have something like contextual save bar in shopify android app, or at least have the tick and the cross icons working.

Contextual information

Packages and versions

Using latest version of shopify-app-bridge via CDN.

Platform

• OS: [Android]
• OS Version: 9 PKQ1.190319.001
• App: Shopify Mobile

[darrynten]

I can confirm that I'm experiencing this same behaviour, the new contextual save bar is working on desktop but the tick and cross icons do not do anything at all and the user gets stuck on the page when I test in the Shopify Mobile app

[darrynten]

To add more context:

Using a Stimulus connected, self-managed ui-save-bar component (i.e. not <form data-save-bar> I'm able to trigger the discard confirmation, but the discard action itself does not happen, and the submit button does nothing at all when open in Shopify Mobile

<ui-save-bar id="my-save-bar" data-app-target="saveBar" discardConfirmation>
  <button variant="primary" id="my-save-button" data-app-target="save" data-action="app#save"></button>
  <button id="my-discard-button" data-app-target="discard" data-action="app#discard"></button>
</ui-save-bar>

Works well on Desktop

[darrynten]

This is still a serious problem, the save and discard buttons in Shopify Mobile do nothing.

I tried inspecting the webview with adb but the save-bar buttons are outside of the webview and do not display in the preview.

[darrynten]

@henrytao-me Besides adding via Stimulus I also tried:

• Adding via document.getElementById('save-button').addEventListener('click', saveFunction) like in the docs
• Adding via onclick inline function on element

None of them bind any functionality to the save button on Shopify Mobile, and the user ends up stuck with Unsaved changes.

No matter what I try I can't seem to get any code at all to run on the buttons inside the ui-save-bar when loaded up on the Shopify Mobile app.

v3 Contextual SaveBar works.

Update

Turning off "Mobile optimization" makes the save bar work again, but it's a much worse experience overall.

[autoserve]

We are using React Component SaveBar and having the same issue. The SaveBar works as expected on Desktop (web), but on Mobile (within Shopify app) clicking on the button does not work at all.

We are on the latest shopify remix 2.5.0 at the moment of this comment.

Could someone from the Shopify team please prioritize this and look into this bug? As this should be a major/core feature for many apps when using app-bridge.

[darrynten]

@autoserve this will probably take a long time to get fixed.

We've decided to block access to any functionality that uses the save bar on shopify mobile with a message directing users to the desktop or mobile web version until it is resolved.

[henrytao-me]

Hi all, I am looking into this issue this week. So sorry about the delay and thanks so much for your patience.

[darrynten]

@henrytao-me is there any progress on this?

[darrynten]

@henrytao-me any progress on this?

All of the App Bridge 4.x versions of our apps are currently stuck in QA since none of them can save anything on Shopify Mobile.

It's been like this for over 2 months now, should our team be looking at implementing something like auto-saving every time the user changes the value and doing away with the save bar altogether, or is this issue really being addressed internally with a realistic deadline?

[henrytao-me]

The team is looking into this. I will give you an update by end of day.

[henrytao-me]

@darrynten A pull request is up. It should be shipped by end of today. No changes required on your end nor merchants.

[henrytao-me]

It's fixed on production.

[darrynten]

I can confirm it's working again, thank you from all of us!

[autoserve]

Thank you!