Make WordPress Core

Opened 2 years ago

Closed 23 months ago

Last modified 20 months ago

#54837 closed defect (bug) (fixed)

Mobile admin menu: Clicking on menu items hides the menu

Reported by: dhusakovic's profile dhusakovic Owned by:
Milestone: 5.9 Priority: normal
Severity: normal Version: 5.9
Component: Administration Keywords:
Focuses: ui Cc:

Description

Using WP 5.9 RC 2

Steps to reproduce:

  1. Use a mobile device (tested with iPhone)
  2. Login to admin via browser (tested with Safari and Chrome)
  3. Expand the admin menu
  4. Click on one of the main items (Posts, Users, etc)
  5. Admin menu is hidden
  6. Open menu again
  7. Item clicked has been expanded showing subitems.

Change History (17)

#1 @SergeyBiryukov
2 years ago

  • Component changed from Menus to Administration
  • Focuses ui added
  • Milestone changed from Awaiting Review to 5.9

Thanks for the report!

Per Slack message, this may have been introduced in 5.9 RC, moving to the milestone for investigation.

Also moving to the Administration component, as Menus is specifically for the Menus screen and nav menu functions.

#2 @costdev
2 years ago

  • Keywords reporter-feedback added

Test Report

Env

  • WordPress 5.9 Beta 3, 5.9 RC1, 5.9 RC2
  • (IRL) - Android - Chrome 97.0.4692.87
  • (Browserstack - Real device) - iPhone 12 v14.1 - Chrome 92.0.4515.90
  • (Browserstack - Real device) - iPhone 12 v14.1 - Safari 14
  • Theme: Twenty Twenty One
  • Gutenberg Editor
  • Plugin: None activated

Steps to test

  1. Login to admin via browser
  2. Expand the admin menu
  3. Click on Posts.
  4. Admin menu is hidden ❌ - Admin menu is still shown.
  5. Open menu again ❌- Admin menu is already open.
  6. Item clicked has been expanded showing subitems. ✅ - Expected behaviour.

Results

  • Cannot reproduce on:
    • Android Chrome (5.9 Beta 3, 5.9 RC1 or 5.9 RC2).
    • iPhone 12 v14.1 Chrome (5.9 Beta 3, 5.9 RC1 or 5.9 RC2).
    • iPhone 12 v14.1 Safari (5.9 Beta 3, 5.9 RC1 or 5.9 RC2).

Notes

  • It would be beneficial to know what version of iOS, Safari and Chrome were used when the issue was originally detected. Adding reporter-feedback to get more information.
  • It would be beneficial for a tester with a physical iPhone in front of them to test this issue.
  • If the issue is reproduced on an iPhone and only appeared in 5.9, then it's likely related to 51946.
Last edited 2 years ago by costdev (previous) (diff)

#3 @costdev
2 years ago

  • Keywords needs-testing has-testing-info added; reporter-feedback removed

Removing reporter-feedback. The issue was originally produced on iPhone 11 and iPhone 12.

I was unable to reproduce the issue in Browserstack - Real device - iPhone 11 in Safari or Chrome.

A test report from another tester using an iPhone 11 or 12 would be much appreciated.

Adding needs-testing, has-testing-info and requesting manual testing to reproduce the issue from the folks in the #core-test Slack channel to get this attention ahead of RC3 tomorrow.

Last edited 2 years ago by costdev (previous) (diff)

This ticket was mentioned in Slack in #core-test by costdev. View the logs.


2 years ago

#5 @thelovekesh
2 years ago

I am able to reproduce the same bug on the mobile devices using the chrome device toolbar.

#6 @costdev
2 years ago

Thanks @thelovekesh!

If you're comfortable editing code, please do the following:

  1. Add the following to wp-config.php:
    define( 'SCRIPT_DEBUG', true );
    
  1. Open wp-admin/js/common.js.
  2. Search for Close sidebar. This should bring you to the following block of code:
    // Close sidebar when focus moves outside of toggle and sidebar.
    $( '#wp-admin-bar-menu-toggle, #adminmenumain' ).on( 'focusout', function() {
        var focusIsInToggle, focusIsInSidebar;
    
        if ( ! $wpwrap.hasClass( 'wp-responsive-open' ) ) {
            return;
        }
    
        // A brief delay is required to allow focus to switch to another element.
        setTimeout( function() {
            focusIsInToggle  = $.contains( $( '#wp-admin-bar-menu-toggle' )[0], $( ':focus' )[0] );
            focusIsInSidebar = $.contains( $( '#adminmenumain' )[0], $( ':focus' )[0] );
    
            if ( ! focusIsInToggle && ! focusIsInSidebar ) {
                $( '#wp-admin-bar-menu-toggle' ).trigger( 'click.wp-responsive' );
            }
        }, 10 );
    } );
    
  1. Delete this block of code and save the file.
  2. Perform a hard refresh (Cmd+R or Ctrl + F5 depending on your device).
  3. Let us know if you are still able to reproduce the issue.

#7 @dhusakovic
2 years ago

@costdev, confirming that removing that block of code does fix the issue.

#8 @costdev
2 years ago

  • Keywords needs-testing has-testing-info removed

Thanks @dhusakovic!

@SergeyBiryukov, looks like we need to consider [51946] as a revert candidate. If it's reverted, we should reopen #53587 and milestone it for 6.0.

Last edited 2 years ago by costdev (previous) (diff)

#9 @audrasjb
2 years ago

  • Owner set to audrasjb
  • Status changed from new to accepted

Reverting and moving to 6.0 may be the safer option given the last release candidate is tomorrow.

Also pinging @joedolson who worked on [51946], for information.

This ticket was mentioned in Slack in #core-media by hellofromtonya. View the logs.


2 years ago

#11 @hellofromTonya
2 years ago

  • Milestone changed from 5.9 to 6.0

Spoke with @joedolson on slack who confirmed okay to revert [51946] and move resolution to 6.0. Revert will happen on its original ticket, i.e. #53587 with a reference to this new ticket.

#12 @hellofromTonya
2 years ago

In 52591:

Administration: Revert [51946].

Reverting changeset due to reported issue of menu being hidden after clicking on certain mobile devices.

Props dhusakovic, audrasjb, SergeyBiryukov, costdev, joedolson.
See #54837, #53587.

#13 @hellofromTonya
2 years ago

In 52592:

Administration: Revert [51946].

Reverting changeset due to reported issue of menu being hidden after clicking on certain mobile devices.

Props dhusakovic, audrasjb, SergeyBiryukov, costdev, joedolson.
Reverts [51946] on the 5.9 branch.
See #54837, #53587.

#14 @hellofromTonya
2 years ago

@dhusakovic the change has been reverted. To keep the conversation and resolution in one place, I'd suggest moving the conversation to the original ticket #53587.

#15 @audrasjb
2 years ago

  • Owner audrasjb deleted
  • Status changed from accepted to assigned

#16 @sabernhardt
23 months ago

  • Milestone changed from 6.0 to 5.9
  • Resolution set to fixed
  • Status changed from assigned to closed

Closing this ticket to keep discussion about any future changes on #53587

This ticket was mentioned in Slack in #accessibility by ryokuhi. View the logs.


20 months ago

Note: See TracTickets for help on using tickets.