Twenty Nineteen: Latest Comments block text color differs in editor when adding a background color preset and a text color

[pitamdey]

In the Twenty Nineteen theme, the text color of the Latest Comments block differs between the editor and the frontend when a background color is applied.

Here is the recording :
​https://drive.google.com/file/d/1cjTF1M4sHBZYIn5HLIiPTtOlcMoesdEw/view?usp=sharing

[pitamdey]

Patch for this issue

[sukhendu2002]

Reproduction Report

Description

This report validates whether the issue can be reproduced.

Environment

• WordPress: 6.8-alpha-59274-src
• PHP: 8.2.26
• Server: nginx/1.27.3
• Database: mysqli (Server: 8.0.40 / Client: mysqlnd 8.2.26)
• Browser: Chrome 131.0.0.0
• OS: macOS
• Theme: Twenty Nineteen 3.0
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.2.0

Actual Results

1. ✅ Error condition occurs (reproduced).

Supplemental Artifacts

[sukhendu2002]

Test Report

Description

This report validates whether the indicated patch works as expected.

Patch tested: https://core.trac.wordpress.org/attachment/ticket/62635/62635.patch

Environment

• WordPress: 6.8-alpha-59274-src
• PHP: 8.2.26
• Server: nginx/1.27.3
• Database: mysqli (Server: 8.0.40 / Client: mysqlnd 8.2.26)
• Browser: Chrome 131.0.0.0
• OS: macOS
• Theme: Twenty Nineteen 3.0
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.2.0

Actual Results

1. ✅ Issue resolved with patch.

Supplemental Artifacts

[parthvataliya]

Test Report

Description

This report validates whether the indicated patch works as expected.

Patch tested: https://core.trac.wordpress.org/attachment/ticket/62635/62635.patch

Environment

• WordPress: 6.8-alpha-59274-src
• PHP: 8.2.26
• Server: nginx/1.27.3
• Database: mysqli (Server: 8.0.40 / Client: mysqlnd 8.2.26)
• Browser: Chrome 131.0.0.0
• OS: Linux
• Theme: Twenty Nineteen 3.0
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.2.0

Actual Results

1. ✅ Issue resolved with patch.

Supplemental Artifacts

Before patch: https://core.trac.wordpress.org/attachment/ticket/62635/before-patch.mp4
After patch: https://core.trac.wordpress.org/attachment/ticket/62635/after-patch.mp4

[rinkalpagdar]

Test Report

Description

This report validates whether the indicated patch works as expected.

Patch tested: https://core.trac.wordpress.org/attachment/ticket/62635/62635.patch

Environment

• WordPress: 6.8-alpha-59274-src
• PHP: 8.2.25
• Server: nginx/1.27.2
• Database: mysqli (Server: 8.0.40 / Client: mysqlnd 8.2.25)
• Browser: Chrome 131.0.0.0
• OS: macOS
• Theme: Twenty Nineteen 3.0
• MU Plugins: None activated
• Plugins:
  • Test Reports 1.2.0

Actual Results

1. ✅ Issue resolved with patch.

[poena]

I would like to encourage everyone to take the time to research and understand what is causing the problems, and to consider what impact the suggested changes may have. It is sometimes better to ask a few questions more.

Twenty Nineteen has a feature that changes the text color depending on the background color.
If the white color was removed from this CSS; then the text would no longer be accessible.
The color contrast ratio between the background and text would be too low to pass the accessibility requirements.
This change would also affect all paragraphs inside HTML elements with this class, not only the Latest Comments block.

.has-dark-gray-background-color p {
  color: #fff;
}

The text color would also change on live websites, and it would be an unexpected change for the users.

Twenty Nineteen uses SASS. The CSS files are generated from the SCSS files.
If you change the CSS files directly, the changes will be overwritten when the SCSS files are built.
You can find the commands to build the files in the package.json file.

I recommend only submitting the changes to the SCSS files, because otherwise there may be merge conflicts that make it more difficult to test the patches.
Then, the tester can download the patch and re-build the CSS files locally.

[sabernhardt]

#49931 does not mention the Latest Comments block (yet), but all similar blocks should need the same patch.