Modal Dialogue Boxes Invisible

[wolveix]

Following on from #1226

Unfortunately, I'm at a total loss on my end. Here are my tests so far:

• macOS 12.6 (colleague's laptop):
  • Firefox: works
• macOS 15.2 (my laptop):
  • Chrome: doesn't work
  • Firefox: doesn't work
  • Firefox DE: doesn't work
  • Safari: doesn't work
• macOS 15.3 (colleague's laptop):
  • Firefox: works
• Windows 11 (PC1):
  • Chrome: works
  • Firefox: works
• Windows 11 (PC2):
  • Chrome: doesn't work
  • Firefox: doesn't work

I can't see any common links between any of the test cases. No console errors, no assets being blocked or failing to download. The issue is that the .show CSS class isn't being added to the modal, or the modal backdrop.

[wolveix]

We have an answer! @Eugeny, the modals won't show if the client device has the system's version of "Reduce motion" enabled. As soon as I disabled it my MacBook, everything works as expected :O

Same issue:
https://mdbootstrap.com/docs/standard/extended/fade-animation/

Discussion:
https://mdbootstrap.com/support/jquery/modal-animation-not-working-fade/

I'm not sure if there's anything that can be changed within Warpgate to fix this? Or warn the user (if there's even a browser API to check the "Reduce motion" system setting)

Bootstrap devs say it's working as intended (lol), surely it should just skip the animation but still render the entity?:
twbs/bootstrap#41169

[codyro]

We have an answer! @Eugeny, the modals won't show if the client device has the system's version of "Reduce motion" enabled. As soon as I disabled it my MacBook, everything works as expected

I'll test this shortly, but if this is the issue I was experiencing nice find!

[codyro]

We have an answer! @Eugeny, the modals won't show if the client device has the system's version of "Reduce motion" enabled. As soon as I disabled it my MacBook, everything works as expected :O

Same issue: https://mdbootstrap.com/docs/standard/extended/fade-animation/

Discussion: https://mdbootstrap.com/support/jquery/modal-animation-not-working-fade/

I'm not sure if there's anything that can be changed within Warpgate to fix this? Or warn the user (if there's even a browser API to check the "Reduce motion" system setting)

Bootstrap devs say it's working as intended (lol), surely it should just skip the animation but still render the entity?: twbs/bootstrap#41169

I can confirm this fixed my issue as well. That explains why others and I had difficulty debugging this one. At the very least, it is worth a note in the docs.

As a side note, holy moly, the animations are slow. I have forgotten 😓

Bootstrap devs say it's working as intended (lol), surely it should just skip the animation but still render the entity?:
twbs/bootstrap#41169

lol..