Bug 54643 - CSS color gets adjusted for disabled input elements
Summary: CSS color gets adjusted for disabled input elements
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Forms (show other bugs)
Version: 528+ (Nightly build)
Hardware: All All
: P2 Critical
Assignee: Karl Dubost
URL: http://host0001.webd.pl/bugs/safari/i...
Keywords: InRadar
: 70820 73620 (view as bug list)
Depends on:
Blocks: 74143
  Show dependency treegraph
 
Reported: 2011-02-17 05:57 PST by bugzilla33
Modified: 2023-02-12 23:49 PST (History)
18 users (show)

See Also:


Attachments
testcase (455 bytes, text/html)
2011-02-17 05:58 PST, bugzilla33
no flags Details
Patch 1 (4.75 KB, patch)
2011-12-07 21:10 PST, yosin
no flags Details | Formatted Diff | Diff
Patch 2 (4.89 KB, patch)
2011-12-07 22:13 PST, yosin
no flags Details | Formatted Diff | Diff
STP 153 differs in color from other browsers (761.17 KB, image/png)
2022-09-12 08:39 PDT, Ahmad Saleem
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description bugzilla33 2011-02-17 05:57:26 PST
css color:#000000 but displays #535353
Comment 1 bugzilla33 2011-02-17 05:58:32 PST
Created attachment 82786 [details]
testcase
Comment 2 Alexey Proskuryakov 2011-02-17 10:48:38 PST
I think that this is a duplicate, but can't find any earlier reports now.
Comment 3 Alexey Proskuryakov 2011-02-17 10:49:48 PST
I was probably thinking about bug 47429.
Comment 4 Alexey Proskuryakov 2011-10-26 12:58:53 PDT
*** Bug 70820 has been marked as a duplicate of this bug. ***
Comment 5 yosin 2011-12-04 17:09:07 PST
*** Bug 73620 has been marked as a duplicate of this bug. ***
Comment 6 yosin 2011-12-04 17:13:12 PST
Another sample URI:
  http://jsfiddle.net/WR83J/ 

This issue causes:
  http://crbug.com/91690

I can say this is feature bug or feature specification flaw. WebKit should not ignore CSS entries.
Comment 7 Kent Tamura 2011-12-04 19:28:01 PST
Vineet wrote in https://bugs.webkit.org/show_bug.cgi?id=73620#c2 :
> This old changeset for this bug  http://trac.webkit.org/changeset/13929/trunk/WebCore/rendering/RenderTextField.cpp

Emulating AppKit behavior is not needed for non-Mac platforms at all.
IMO, we should enable this behavior only on Apple Mac port by compile-time flag, or should introduce a runtime setting.
Comment 8 yosin 2011-12-07 21:10:13 PST
Created attachment 118324 [details]
Patch 1
Comment 9 Kent Tamura 2011-12-07 21:37:47 PST
Comment on attachment 118324 [details]
Patch 1

View in context: https://bugs.webkit.org/attachment.cgi?id=118324&action=review

> Source/WebCore/css/themeChromium.css:76
> +    border-color: #000000;
> +    color: #545454;

What's the reason of these colors?
It seems both of Opera and Firefox use color:#909090 and lighter inset border.

> Source/WebCore/rendering/RenderTextControl.cpp:124
>      if (disabled)

Because this if block has multiple physical lines, we need {}.

> LayoutTests/ChangeLog:2
> +2011-12-07  Yosifumi Inoue  <yosin@chromium.org>
> +        CSS color gets adjusted for disabled input elements

Need a blank line between lines.
Comment 10 Kent Tamura 2011-12-07 21:41:49 PST
(In reply to comment #9)
> What's the reason of these colors?
> It seems both of Opera and Firefox use color:#909090 and lighter inset border.

Is's on Mac. They seem to use different appearance on Windows.
Comment 11 yosin 2011-12-07 22:13:03 PST
Created attachment 118331 [details]
Patch 2
Comment 12 Kent Tamura 2011-12-07 22:17:13 PST
Comment on attachment 118331 [details]
Patch 2

Looks ok.
Comment 13 WebKit Review Bot 2011-12-07 23:53:18 PST
Comment on attachment 118331 [details]
Patch 2

Clearing flags on attachment: 118331

Committed r102320: <http://trac.webkit.org/changeset/102320>
Comment 14 WebKit Review Bot 2011-12-07 23:53:23 PST
All reviewed patches have been landed.  Closing bug.
Comment 15 Kent Tamura 2011-12-07 23:57:30 PST
(In reply to comment #13)
> Committed r102320: <http://trac.webkit.org/changeset/102320>

This fixed only Chromium.  Reopening.
Comment 16 Darin Adler 2011-12-08 10:37:31 PST
This seems like a bad design, having a specific PLATFORM(CHROMIUM) here in platform-indepenent code. Can we express this special Chromium theme requirement in a cleaner way?
Comment 17 Kent Tamura 2011-12-08 17:06:16 PST
(In reply to comment #16)
> This seems like a bad design, having a specific PLATFORM(CHROMIUM) here in platform-indepenent code. Can we express this special Chromium theme requirement in a cleaner way?

Indeed.  I have filed Bug 74143.
Comment 18 Ahmad Saleem 2022-09-12 08:39:52 PDT
Created attachment 462290 [details]
STP 153 differs in color from other browsers

I am able to reproduce this bug using attached test case in Safari Technology Preview 153 and as can be seen from the screenshot, Safari show "greyish" text color while other browsers have "black".

I think matching with other browsers would be great. Just wanted to share updated results. Thanks!
Comment 19 Radar WebKit Bug Importer 2022-09-12 09:58:02 PDT
<rdar://problem/99826522>
Comment 20 Tim Nguyen (:ntim) 2023-02-09 01:00:04 PST
I think we should just remove RenderTheme::disabledTextColor() and related code, and add an html.css rule:

input:disabled, textarea:disabled {
  color: /* pick color that looks the most similar to what we have now */;
}
Comment 21 Tim Nguyen (:ntim) 2023-02-09 01:09:59 PST
`color-mix(in hsl, canvastext 66%, canvas)` seems to match roughly what was there before.
Comment 22 Karl Dubost 2023-02-09 04:17:54 PST
The local inline CSS

```
input:disabled {
  color: #000000;
}
```


Firefox Nightly UA stylesheet is 

```
input:disabled,
textarea:disabled,
option:disabled,
optgroup:disabled,
select:disabled {
  color: GrayText;
  background-color: -moz-DisabledField;
  cursor: unset;
}
```

Chrome Canary UA StyleSheet is

```
input:disabled {
    cursor: default;
    background-color: -internal-light-dark(rgba(239, 239, 239, 0.3), rgba(59, 59, 59, 0.3));
    color: -internal-light-dark(rgb(84, 84, 84), rgb(170, 170, 170));
    border-color: rgba(118, 118, 118, 0.3);
}
```

Safari TP 163 has a style for input, but none for disabled.

```
input {
    appearance: auto;
    color: canvastext;
    background-color: canvas;
    border-top-width: 2px;
    border-right-width: 2px;
    border-bottom-width: 2px;
    border-left-width: 2px;
    border-top-style: inset;
    border-right-style: inset;
    border-bottom-style: inset;
    border-left-style: inset;
    border-top-color: currentcolor;
    border-right-color: currentcolor;
    border-bottom-color: currentcolor;
    border-left-color: currentcolor;
    border-image-source: none;
    border-image-slice: 100%;
    border-image-width: 1;
    border-image-outset: 0;
    border-image-repeat: stretch;
    padding-top: 1px;
    padding-right: 1px;
    padding-bottom: 1px;
    padding-left: 1px;
    -webkit-rtl-ordering: logical;
    -webkit-user-select: text;
    cursor: auto;
}
```


https://searchfox.org/wubkat/rev/8657349b48cece83215d92556db34a0a6ed55040/Source/WebCore/rendering/RenderTheme.cpp#1975-1992

Used in https://searchfox.org/wubkat/search?q=symbol:_ZNK7WebCore11RenderTheme17disabledTextColorERKNS_5ColorES3_&redirect=false
Comment 23 Karl Dubost 2023-02-09 04:23:53 PST
WebKit has 
https://searchfox.org/wubkat/rev/8657349b48cece83215d92556db34a0a6ed55040/Source/WebCore/css/html.css#933-935


```
input:disabled, textarea:disabled {
    opacity: 0.4;
}
```
Comment 24 Karl Dubost 2023-02-09 04:39:35 PST
Pull request: https://github.com/WebKit/WebKit/pull/9866
Comment 25 EWS 2023-02-12 23:49:45 PST
Committed 260180@main (d9061430480d): <https://commits.webkit.org/260180@main>

Reviewed commits have been landed. Closing PR #9866 and removing active labels.