Text isnt highlighted when editing a page in latest Chrome Dev and Canary

[killerbeez]

Not sure if this a WordPress bug or Chrome updates, however, when you edit a page and try to select and highlight over paragraph text, there is no background colour indicating where you are.
It only seems to happen in WordPress, and on front end and other sites, you can select the text and a background colour is visible

[daviwalle]

Hi there,

Can you try disabling all browser extensions? They could generate some incompatibility

Also, from what I've heard, the latest versions of Chrome Canary have some bugs with the Dark Modes implementations, do you use any dark mode function?

[killerbeez]

Replying to daviwalle:

Hi there,

Can you try disabling all browser extensions? They could generate some incompatibility

Also, from what I've heard, the latest versions of Chrome Canary have some bugs with the Dark Modes implementations, do you use any dark mode function?

Hi Daviwalle, have also submitted to Chrome, more likely a new issue at their end.

Both browsers were clean on both macOS Sonoma and Windows, both same issues, tried both Normal and Dark mode.

Base WordPress install with 24 theme only.

[daviwalle]

Replying to killerbeez:

Yes, it is probably Chrome. Does it happen in the whole WordPress BackEnd or only when editing?

[killerbeez]

Replying to daviwalle:

Replying to killerbeez:

Yes, it is probably Chrome. Does it happen in the whole WordPress BackEnd or only when editing?

Only in main editor section, if you try to adjust the title block at the very top it highlights and also the sidebar content it highlights fine.

[jorbin]

Thank you for the ticket @killerbeez. You mentioned that you also submitted this to Chrome, can you link to the bug report there?

I can replicate this using Chrome Version 121.0.6154.0 (Official Build) canary (arm64) and WP 6.5-alpha-57081.

Milestoning in order to keep an eye on this and investigate if a change is going to be necessary.

[killerbeez]

Replying to jorbin:

Thank you for the ticket @killerbeez. You mentioned that you also submitted this to Chrome, can you link to the bug report there?

I can replicate this using Chrome Version 121.0.6154.0 (Official Build) canary (arm64) and WP 6.5-alpha-57081.

Milestoning in order to keep an eye on this and investigate if a change is going to be necessary.

Hi @jorbin,
This is trac ​https://bugs.chromium.org/p/chromium/issues/detail?id=1504444#c_ts1700696677
also the WP Git repo ​https://github.com/WordPress/gutenberg/issues/56408

[swissspidy]

#60088 was marked as a duplicate.

[jorbin]

Based on ​this comment from a member of the chrome team, I think this is something we are going to want to look into fixing for 6.4.3

Anyways, it may be we delay this change for a few more releases. But long term there are 2 choices: push it out as is, or re-raise the CSS spec issue in the hope of coming up with a better resolution.

[thesimarchitect]

Same problem. I know it's not a wordpress issue, but related, at the same time I also notice the bug when trying to edit a Tweet (I have access to formattation). Perhaps all formattable text boxes have this bug on Chrome? I am using Chrome Version 121.0.6167.16 (Official Build) beta (64-bit) and I am having this problem for the past couple of weeks, if I am not mistaken.

I didn't mean to change the topic priority or anything. I filled with my information, sorry if that was a mistake. 😬

Quick note: if you're editing the code instead of using visual mode it works normally. So, it seems to be a Chrome problem that affects text boxes with formatting. Editing other elements of a post like the excerpt, for example, doesn't present the issue either and the text is highlighted correctly.

[talldanwp]

@thesimarchitect No worries, I've changed those back.

I've started on a fix in this PR - ​https://github.com/WordPress/gutenberg/pull/57298.

I'm concerned about the impact this will have on WordPress users, even if a fix is released in 6.4.3. Do we know how many users will auto-update?

This is the PR that introduced the code that causes the issue, which was included in WordPress 6.1 - ​https://github.com/WordPress/gutenberg/pull/44148.

[talldanwp]

The problem was fixed in this gutenberg PR - ​https://github.com/WordPress/gutenberg/pull/57300.

The Chrome team indicated they'll delay the feature that resulted in this issue, but I don't know how long for - ​https://github.com/WordPress/gutenberg/issues/56408#issuecomment-1866399889.

[jorbin]

In 57258:

Editor: update npm packages in trunk for 6.4.3.

Package Update includes fixes for:

• Image Block: Enable image block to be selected correctly when clicked.
• Reduce specificity of default Cover text color styles.
• Image Block: Fix deprecation when width/height attribute is number.
• Text selection: show CSS hack to Safari only.
• SlotFill: Allow contextual SlotFillProviders.

See: ​https://github.com/WordPress/wordpress-develop/pull/5696
See: ​https://github.com/WordPress/gutenberg/commit/bd6767b8a4f9461153a6db6374110f723ed0d05c
See: ​https://github.com/WordPress/gutenberg/pull/56043
See: ​https://github.com/WordPress/gutenberg/pull/56411
See: ​https://github.com/WordPress/gutenberg/pull/57063
See: ​https://github.com/WordPress/gutenberg/pull/57300
See: ​https://github.com/WordPress/gutenberg/pull/56779

Props mikachan, wildworks, alexstine, poena, isabel_brison, andrewserong, czapla, andraganescu, joen, ellatrix, youknowriad, ntsekouras.
Fixes #59943, #59943.