Bug 54643 – CSS color gets adjusted for disabled input elements

• Status: RESOLVED
• Resolution: FIXED
• Component: Forms

[bugzilla33]

css color:#000000 but displays #535353

[bugzilla33]

Created attachment 82786 [details]
testcase

[Alexey Proskuryakov]

I think that this is a duplicate, but can't find any earlier reports now.

[Alexey Proskuryakov]

I was probably thinking about bug 47429.

[Alexey Proskuryakov]

*** Bug 70820 has been marked as a duplicate of this bug. ***

*** Bug 73620 has been marked as a duplicate of this bug. ***

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.

[Kent Tamura]

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.

Created attachment 118324 [details]
Patch 1

[Kent Tamura]

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
> [phone]  Yosifumi Inoue  <[e-mail]>
> +        CSS color gets adjusted for disabled input elements

Need a blank line between lines.

[Kent Tamura]

(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.

Created attachment 118331 [details]
Patch 2

[Kent Tamura]

Comment on attachment 118331 [details]
Patch 2

Looks ok.

[WebKit Review Bot]

Comment on attachment 118331 [details]
Patch 2

Clearing flags on attachment: 118331

Committed r102320: <http://trac.webkit.org/changeset/102320>

[WebKit Review Bot]

All reviewed patches have been landed.  Closing bug.

[Kent Tamura]

(In reply to comment #13)
> Committed r102320: <http://trac.webkit.org/changeset/102320>

This fixed only Chromium.  Reopening.

[Darin Adler]

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?

[Kent Tamura]

(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.

[Ahmad Saleem]

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!

[Radar WebKit Bug Importer]

<rdar://problem/99826522>

[Tim Nguyen (:ntim)]

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 */;
}

[Tim Nguyen (:ntim)]

`color-mix(in hsl, canvastext 66%, canvas)` seems to match roughly what was there before.

[Karl Dubost]

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

[Karl Dubost]

WebKit has 
https://searchfox.org/wubkat/rev/8657349b48cece83215d92556db34a0a6ed55040/Source/WebCore/css/html.css#933-935


```
input:disabled, textarea:disabled {
    opacity: 0.4;
}
```

[Karl Dubost]

Pull request: https://github.com/WebKit/WebKit/pull/9866

[EWS]

Committed 260180@main (d9061430480d): <https://commits.webkit.org/260180@main>

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