Automattic / wp-calypso

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

Text highlight color picker link in Customizer tries to open a new tab #58888

Open sarahcada opened 2 years ago

sarahcada commented 2 years ago

Quick summary

In Customizer, clicking on the color picker in text highlights brings up the warning about opening a new tab and navigating away from the page. This doesn't happen in the page/post editor.

Steps to reproduce

  1. Start at /wp-admin/customize.php
  2. Go to any widget area and add any block that let you add text (Paragraph is easiest)
  3. Select the text and click the downward arrow in the block toolbar, then click on Highlight. Click on the custom color.

What you expected to happen

For a color picker to appear without disruption.

What actually happened

The color picker did, appear, but first, a warning about navigating away from the page. User can click on Stay on Page and carry on as planned.

Screen Capture on 2021-12-07 at 14-10-30

Context

Encountered while testing Gutenberg v12-1-0-rc-1, but this also happens for v.12.0.2.

Simple, Atomic or both?

Simple, Atomic

Theme-specific issue?

No response

Browser, operating system and other notes

No response

Reproducibility

No response

Severity

No response

Available workarounds?

No response

Workaround details

No response

Robertght commented 2 years ago

Thank you for reporting this!

I can't seem to replicate it at the moment.

@sarahcada can you let us know if this occurs in Chrome?

sarahcada commented 2 years ago

@Robertght Yes, it occurs for Chrome (Version 96.0.4664.93)

Screen Capture on 2021-12-09 at 14-14-04

Greatdane commented 2 years ago

@Robertght - Continuing our conversation, I can replicate on Chrome;

https://user-images.githubusercontent.com/5075840/145512157-853ad70e-a96f-4f94-bb41-0aafe1515ae6.mp4

Robertght commented 2 years ago

Noting that even if I save the widget first and try to apply the color after a refresh, the customizer page refreshes so it cannot be applied.

The only possible workaround is to do it through wp-admin/widgets.php

edwinho89 commented 2 years ago

35386109-hc

The issue remains reproducible on simple and Atomic sites. If there aren't any changes on customizer and if users visit the color picker right away, it will display site refused to connect. message.

Refused to display 'site_url_here' in a frame because it set 'X-Frame-Options' to 'sameorigin'.

https://user-images.githubusercontent.com/34882260/166979777-10c39c59-5b7e-4185-96fc-3d374944a1c1.mp4