WordPress.org

Make WordPress Core

Opened 2 months ago

Closed 5 weeks ago

#40981 closed defect (bug) (fixed)

Customizer: Menus: it is far too easy to mistakenly delete a menu because the "Delete Menu" link and the "Add Items" button are too close together

Reported by: designsimply Owned by: westonruter
Milestone: 4.8.1 Priority: normal
Severity: major Version: 4.7.4
Component: Customize Keywords: has-patch needs-testing commit fixed-major
Focuses: ui Cc:

Description

This came up in WordPress.com support. /hat tip @Droyal for reporting the issue.

Steps to reproduce:

  1. Go to Customize > Menus.
  2. Click on any menu to view details.
  3. Click on the empty space below the "Add Items" button.

Result: the menu is deleted without warning because the "Delete Menu" link spans the entire column which puts it in very close proximity to the "Add Items" button.

Video: 46s


Seen at http://alittletestblog.com/wp-admin/customize.php?return=%2Fwp-admin%2Fplugins.php&changeset_uuid=6b3d1591-9d2a-419d-a906-603da35edcf8 using Firefox 53.0.3 on Mac OS X 10.12.5 on a site hosted at WP Engine running WordPress 4.9-alpha-40885 via WordPress Beta Tester 1.1.2 and Jetpack 5.1-beta-12056-d2530de-master via Jetpack Beta Tester 2.0.3.

Attachments (3)

Screen Shot 2017-06-09 at Fri Jun 9 10.26.06 AM.png (746.1 KB) - added by designsimply 2 months ago.
40981.0.diff (531 bytes) - added by westonruter 2 months ago.
40981.1.diff (539 bytes) - added by westonruter 2 months ago.

Download all attachments as: .zip

Change History (17)

#1 @lancewillett
2 months ago

  • Keywords needs-patch added

Great find — usability thing that anyone could run into.

#2 @westonruter
2 months ago

  • Keywords good-first-bug added
  • Milestone changed from Awaiting Review to Future Release

#3 @afercia
2 months ago

Seems to me the click event is bound to the <span> element surrounding "Delete Menu" and the span takes all the available width. Looks like this is the reason why the empty space is "clickable".

While the menu isn't really deleted until you save the changes (I've just closed and reopened the Customizer and the deleted menu reappeared), worth considering that any action that is destructive or perceived as such by users should preferably ask for a confirmation.

#4 @melchoyce
2 months ago

Great find. Can we switch the click event to the <button> instead of the <span>?

#5 @afercia
2 months ago

  • Keywords good-first-bug removed
  • Version set to 4.7.4

@melchoyce seems the change of the targeted element from the button to the span was intentional and there are other considerations involved, see [40396]. Other changes followed that but seems they're unrelated. So, I think the best person to ask to is: @westonruter :)

@westonruter
2 months ago

#6 @westonruter
2 months ago

  • Keywords has-patch added; needs-patch removed
  • Milestone changed from Future Release to 4.8.1

There's no good reason for not having a more specific selector for the click handler.

@westonruter
2 months ago

#7 @westonruter
2 months ago

  • Keywords needs-testing added

Found another defect missed in [40396] and that is if the item addition panel is open, if you click the Delete Menu button it is not resulting in it being closed. This is due to the event.stopPropagation() in the click handler, which I believe is superfluous when the feature was first introduced in [32806]. Fixed in 40981.1.diff.

Last edited 2 months ago by westonruter (previous) (diff)

#8 @westonruter
2 months ago

  • Component changed from Menus to Customize

#9 @westonruter
2 months ago

#41040 was marked as a duplicate.

This ticket was mentioned in Slack in #core by jeffpaul. View the logs.


6 weeks ago

#11 @westonruter
6 weeks ago

  • Keywords commit added
  • Owner set to westonruter
  • Status changed from new to accepted

I'll commit this today unless someone tests and finds a problem.

#12 @westonruter
6 weeks ago

  • Resolution set to fixed
  • Status changed from accepted to closed

In 41020:

Customize: Restrict click target of menu deletion, moving to button from its container.

Props westonruter, afercia.
Fixes #40981.

#13 @westonruter
6 weeks ago

  • Keywords fixed-major added
  • Resolution fixed deleted
  • Status changed from closed to reopened

Re-opening for 4.8.1 release.

#14 @westonruter
5 weeks ago

  • Resolution set to fixed
  • Status changed from reopened to closed

In 41057:

Customize: Restrict click target of menu deletion, moving to button from its container.

Merges [41020] onto 4.8 branch.
Props westonruter, afercia.
Fixes #40981 for 4.8.1.

Note: See TracTickets for help on using tickets.