search

Automattic / wp-calypso

The JavaScript and API powered WordPress.com
https://developer.wordpress.com
GNU General Public License v2.0
12.43k stars 1.99k forks source link

Overlay Menu does not display in mobile preview when editing or viewing on iOS devices #87158

Open mgozdis opened 8 months ago

mgozdis commented 8 months ago

Quick summary

Setting the overlay menu to Mobile only in various FSE themes, including Hevor, displays no overlay menu in mobile preview and no overlay menu at all on the frontend on iOS devices. Text links are displayed at all times regardless of the overlay menu setting on iOS devices. Reproducible on Simple and AT sites. Interaction: 7686104-zd-a8c

A workaround is deactivate Gutenberg.

Steps to reproduce

  1. Create a new site
  2. Activate Hevor theme (Not Hever)
  3. Edit the Index template and check that the Navigation block has the overlay menu set to Mobile only
  4. Change preview in Site Editor to Mobile preview and see the overlay menu does not display: e8yGDK.png
  5. View the live site on any iOS device in any browser and see that the overlay menu also does not display

What you expected to happen

The overlay menu should display in mobile preview and on iOS devices when set to display on mobile.

What actually happened

The overlay menu does not display in mobile preview or on iOS devices. It seems to display fine outside of the editor when scaling on desktop or checking on non-iOS mobile devices.

Impact

Some (< 50%)

Available workarounds?

No but the platform is still usable

Platform (Simple and/or Atomic)

Simple, Atomic

Logs or notes

For iOS devices while testing on the frontend, we tested with an ancient iPhone 6 in Safari and Brave as well as an iPhone 13 Pro with Safari 16 and latest version of Chrome.

github-actions[bot] commented 8 months ago

Support References

This comment is automatically generated. Please do not edit it.