Skip to content

Edit Widgets: Settings toggle shows wrong icon when 'Show button text labels' is on #57646

@afercia

Description

@afercia

Description

In the Edit Widgets page, the Settings panel toggle button shows a wrong icon when 'Show button text labels' is on.

It appears the Edit Widgets page is a bit behind and maybe a little overlooked.
To start with, it should fullly support 'Show button text labels', like the two other editors.
Anyways, when 'Show button text labels' is enabled in the post editor, the widgets editor shows a wrong icon instead of text.

See:

https://github.com/WordPress/gutenberg/blame/302c1487c0298a75b4a0094e77ec87256f15ccdf/packages/interface/src/components/complementary-area/index.js#L190

icon={ showIconLabels ? check : icon }

I'm not sure why the Complementary area toggle is supposed to show the 'check' icon when showIconLabels is true. There's no apparent reason for that, unless I'm missing something. Cc @tellthemachines
It seems to be there since #24304

I'm not even shure the other editors use the ComplementaryArea and ComplementaryAreaToggle this way.

Step-by-step reproduction instructions

  • Set Twenty Twenty-One as active theme.
  • Go to Appearance > Widgets
  • Observe the button to toggle the Settings panel shows the correct icon drawerRight.
  • Hover or focus the button and observe it shows a tooltip with text 'Settings'.
  • Screenshot:

Screenshot 2024-01-08 at 15 29 19

  • Go to the post editor, and enable Options > Preferences > Accessibility > Show button text labels.
  • Go to Appearance > Widgets
  • Observe the button to toggle the Settings panel now shows a wrong 'check' icon.
  • Hover or focus the button and observe there is no tooltip.
  • Screenshot:

Screenshot 2024-01-08 at 15 25 30

Screenshots, screen recording, code snippet

No response

Environment info

No response

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes

Metadata

Metadata

Assignees

Labels

[Package] Edit Widgets/packages/edit-widgets[Status] In ProgressTracking issues with work in progress[Type] BugAn existing feature does not function as intended

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions