Skip to content

GitLab

T
tangled
Commit 8c798c26 authored by Alex Keng's avatar Alex Keng Committed by Commit Bot
Browse files
Options

Fix blackness for color-viewer/selection-ring 

This change fixes a bug for <color> where the color-viewer (The big circle to
the left of the 'hue slider', color-selection-rings (the small circles on
'color well' and the hue slider), and the colored rectangle of the in-page
color control are black due to the auto adjustment from the forced color mode.
The fix is to turn off the auto adjustment for these particular UI elements
when high contrast mode is enabled.

The test controls-new-ui-high-contrast/color-picker.html is also updated (based
on controls-new-ui/color/color-picker-appearance-color-well-click.html) to
verify that selected colors are correctly shown in the high contrast mode.

Bug: 994219
Change-Id: I51c73b3ba2b30010bf1388fc67a07d0033090e54
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1832608
Commit-Queue: Alex Keng <shihken@microsoft.com>
Reviewed-by: default avatarKent Tamura <tkent@chromium.org>
Cr-Commit-Position: refs/heads/master@{#701623}
parent 8a92ed8f
Hide whitespace changes
Inline Side-by-side
Showing with 29 additions and 4 deletions
third_party/blink/renderer/core/html/forms/resources/color_picker.css
View file @ 8c798c26
......@@ -180,4 +180,14 @@ submission-button {
submission-button:hover {
background-color: #F3F3F3;
border-radius: 2px;
}
@media (forced-colors: active) {
color-viewer {
forced-color-adjust: none;
border-color: WindowText;
}
color-selection-ring {
forced-color-adjust: none;
}
}
\ No newline at end of file
third_party/blink/renderer/core/html/resources/forced_colors.css
View file @ 8c798c26
......@@ -91,6 +91,10 @@
border-color: GrayText;
}
input[type="color"] {
forced-color-adjust: none;
}
button,
input[type="button"],
input[type="submit"],
......
third_party/blink/web_tests/fast/forms/controls-new-ui-high-contrast/color-picker.html
View file @ 8c798c26
......@@ -7,9 +7,20 @@ testRunner.waitUntilDone();
<script src='../../forms/resources/picker-common.js'></script>
</head>
<body>
<input type='color' id='color'>
<script>
openPicker(document.getElementById('color'), () => testRunner.notifyDone(), () => testRunner.notifyDone());
</script>
<input type='color' id='color' value='#80D9FF'>
<script>
openPicker(document.getElementById('color'), openPickerSuccessfulCallback, () => testRunner.notifyDone());
function openPickerSuccessfulCallback() {
popupWindow.focus();
const popupDocument = popupWindow.document;
const colorWell = popupDocument.querySelector('color-well');
const colorWellRect = colorWell.getBoundingClientRect();
eventSender.mouseMoveTo(colorWellRect.left + (colorWellRect.width * 4 / 10), colorWellRect.top + (colorWellRect.height * 6 / 10));
eventSender.mouseDown();
eventSender.mouseUp();
testRunner.notifyDone();
}
</script>
</body>
</html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment