S-modal broken overlay

[nunof]

Hi,

We received reports from several users that they were unable to perform certain key actions in our app.

After some testing, we found out that s-modal is intermittently displaying an overlay on open that prevents any interaction with it

I’ve tested on a clean app using this code and can replicate the problem:

  <s-button commandFor="modal">Open</s-button>

  <s-modal id="modal" heading="Details">
    <s-paragraph>Displaying more details here.</s-paragraph>

    <s-button slot="secondary-actions" commandFor="modal" command="--hide">
      Close
    </s-button>
    <s-button
      slot="primary-action"
      variant="primary"
      commandFor="modal"
      command="--hide"
    >
      Save
    </s-button>
  </s-modal>
</>

Here’s the problem:

It doesn’t happen consistently and not to all users, but I can replicate it quite frequently in Chrome 145.0.7632.160 (Official Build) (arm64).

This is preventing users from taking key actions in our app. Can someone have a look at it, please?

Thanks!

[Liam-Shopify]

Hi @nunof

It does look like this is a bug on our side - we are working on fix for this currently.

[nunof]

Thanks @Liam-Shopify! If you could let me know once it’s sorted, I would appreciate it.