Changeset 113511 in webkit


Ignore:
Timestamp:
Apr 6, 2012 3:48:44 PM (12 years ago)
Author:
isherman@chromium.org
Message:

Allow site authors to override autofilled fields' colors.
​https://bugs.webkit.org/show_bug.cgi?id=66032
​http://code.google.com/p/chromium/issues/detail?id=46543

Reviewed by Simon Fraser.

Source/WebCore:

  • css/html.css:

(input:-webkit-autofill): Remove !important declarations.

LayoutTests:

  • fast/forms/input-autofilled-expected.txt:
  • fast/forms/input-autofilled.html:
Location:
trunk
Files:
5 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r113509 r113511  
     12012-04-06  Ilya Sherman  <isherman@chromium.org>
     2
     3        Allow site authors to override autofilled fields' colors.
     4        https://bugs.webkit.org/show_bug.cgi?id=66032
     5        http://code.google.com/p/chromium/issues/detail?id=46543
     6
     7        Reviewed by Simon Fraser.
     8
     9        * fast/forms/input-autofilled-expected.txt:
     10        * fast/forms/input-autofilled.html:
     11
    1122012-04-06  Dirk Pranke  <dpranke@chromium.org>
    213

  • trunk/LayoutTests/fast/forms/input-autofilled-expected.txt

    r81155 r113511  
    11This tests that foreground and background colors properly change for autofilled inputs. It can only be run using DumpRenderTree.
     2   
     3PASS computedStyleUnstyled.color == originalForegroundUnstyled is true
     4PASS computedStyleUnstyled.backgroundColor == originalBackgroundUnstyled is false
     5PASS computedStyleStyled.color == originalForegroundStyled is true
     6PASS computedStyleStyled.backgroundColor == originalBackgroundStyled is true
     7PASS computedStyleStyledWithSelector.color == originalForegroundStyledWithSelector is false
     8PASS computedStyleStyledWithSelector.backgroundColor == originalBackgroundStyledWithSelector is false
     9PASS computedStyleUnstyled.color == originalForegroundUnstyled is true
     10PASS computedStyleUnstyled.backgroundColor == originalBackgroundUnstyled is true
     11PASS computedStyleStyled.color == originalForegroundStyled is true
     12PASS computedStyleStyled.backgroundColor == originalBackgroundStyled is true
     13PASS computedStyleStyledWithSelector.color == originalForegroundStyledWithSelector is true
     14PASS computedStyleStyledWithSelector.backgroundColor == originalBackgroundStyledWithSelector is true
    215
    3 PASS
    4 

  • trunk/LayoutTests/fast/forms/input-autofilled.html

    r81155 r113511  
    88        }
    99
    10         var tf = document.getElementById('tf');
    11         var computedStyle = document.defaultView.getComputedStyle(tf);
    12         var originalForeground = computedStyle.color;
    13         var originalBackground = computedStyle.backgroundColor;
     10        var unstyled = document.getElementById('unstyled');
     11        var styled = document.getElementById('styled');
     12        var styledWithSelector = document.getElementById('styledWithSelector');
     13        computedStyleUnstyled = document.defaultView.getComputedStyle(unstyled);
     14        originalForegroundUnstyled = computedStyleUnstyled.color;
     15        originalBackgroundUnstyled = computedStyleUnstyled.backgroundColor;
     16        computedStyleStyled = document.defaultView.getComputedStyle(styled);
     17        originalForegroundStyled = computedStyleStyled.color;
     18        originalBackgroundStyled = computedStyleStyled.backgroundColor;
     19        computedStyleStyledWithSelector = document.defaultView.getComputedStyle(styledWithSelector);
     20        originalForegroundStyledWithSelector = computedStyleStyledWithSelector.color;
     21        originalBackgroundStyledWithSelector = computedStyleStyledWithSelector.backgroundColor;
    1422
    1523        if (window.layoutTestController) {
    16             layoutTestController.setAutofilled(tf, true);
     24            layoutTestController.setAutofilled(unstyled, true);
     25            layoutTestController.setAutofilled(styled, true);
     26            layoutTestController.setAutofilled(styledWithSelector, true);
    1727        }
    1828
    19         // Both the foreground and background colors should change.
    20         computedStyle = document.defaultView.getComputedStyle(tf);
    21         var autofilledForeground = computedStyle.color;
    22         var autofilledBackground = computedStyle.backgroundColor;
    23         if (autofilledForeground == originalForeground) {
    24             testFailed('Foreground color did not change when autofilled.');
    25             return;
    26         }
    27         if (autofilledBackground == originalBackground) {
    28             testFailed('Background color did not change when autofilled.');
    29             return;
    30         }
     29        // For the unstyled element, the background color should change.  The foreground color should not change,
     30        // as the default foreground color for an autofilled input is the same as for a non-autofilled input.
     31        // For the styled element, the author-specified style should take precedence, so neither color should change.
     32        // For the element styled with the :-webkit-autofill selector, both the foreground and the background colors
     33        // should change.
     34        computedStyleUnstyled = document.defaultView.getComputedStyle(unstyled);
     35        computedStyleStyled = document.defaultView.getComputedStyle(styled);
     36        computedStyleStyledWithSelector = document.defaultView.getComputedStyle(styledWithSelector);
     37        shouldBeTrue("computedStyleUnstyled.color == originalForegroundUnstyled");
     38        shouldBeFalse("computedStyleUnstyled.backgroundColor == originalBackgroundUnstyled");
     39        shouldBeTrue("computedStyleStyled.color == originalForegroundStyled");
     40        shouldBeTrue("computedStyleStyled.backgroundColor == originalBackgroundStyled");
     41        shouldBeFalse("computedStyleStyledWithSelector.color == originalForegroundStyledWithSelector");
     42        shouldBeFalse("computedStyleStyledWithSelector.backgroundColor == originalBackgroundStyledWithSelector");
    3143
    3244        if (window.layoutTestController) {
    33             layoutTestController.setAutofilled(tf, false);
     45            layoutTestController.setAutofilled(unstyled, false);
     46            layoutTestController.setAutofilled(styled, false);
     47            layoutTestController.setAutofilled(styledWithSelector, false);
    3448        }
    3549
    3650        // Colors should be restored.
    37         computedStyle = document.defaultView.getComputedStyle(tf);
    38         if (computedStyle.color != originalForeground) {
    39             testFailed('Foreground color did not revert when un-autofilled.');
    40             return;
    41         }
    42         if (computedStyle.backgroundColor != originalBackground) {
    43             testFailed('Background color did not revert when un-autofilled.');
    44             return;
    45         }
    46 
    47         testPassed('');
     51        computedStyleUnstyled = document.defaultView.getComputedStyle(unstyled);
     52        computedStyleStyled = document.defaultView.getComputedStyle(styled);
     53        shouldBeTrue("computedStyleUnstyled.color == originalForegroundUnstyled");
     54        shouldBeTrue("computedStyleUnstyled.backgroundColor == originalBackgroundUnstyled");
     55        shouldBeTrue("computedStyleStyled.color == originalForegroundStyled");
     56        shouldBeTrue("computedStyleStyled.backgroundColor == originalBackgroundStyled");
     57        shouldBeTrue("computedStyleStyledWithSelector.color == originalForegroundStyledWithSelector");
     58        shouldBeTrue("computedStyleStyledWithSelector.backgroundColor == originalBackgroundStyledWithSelector");
    4859    }
    4960    </script>
    5061
    5162    <style>
    52     #tf {
    53       color: #FFFFFF;
    54       background-color: #FFFFFF;
     63    #styled {
     64      color: #00FF00;
     65      background-color: #00FF00;
     66    }
     67   
     68    #styledWithSelector:-webkit-autofill {
     69      color: #00FF00;
     70      background-color: #00FF00;
    5571    }
    5672    </style>
    … …  
    5975    This tests that foreground and background colors properly change for autofilled inputs.  It can only be run using DumpRenderTree.<br>
    6076    <form name="fm">
    61         <input type="text" id="tf" value="Field value" />
     77        <input type="text" id="unstyled" value="Field value" />
     78        <input type="text" id="styled" value="Field value" />
     79        <input type="text" id="styledWithSelector" value="Field value" />
    6280    </form>
    6381    <div id="console"></div>

  • trunk/Source/WebCore/ChangeLog

    r113510 r113511  
     12012-04-06  Ilya Sherman  <isherman@chromium.org>
     2
     3        Allow site authors to override autofilled fields' colors.
     4        https://bugs.webkit.org/show_bug.cgi?id=66032
     5        http://code.google.com/p/chromium/issues/detail?id=46543
     6
     7        Reviewed by Simon Fraser.
     8
     9        * css/html.css:
     10        (input:-webkit-autofill): Remove !important declarations.
     11
    1122012-04-05  Enrica Casucci  <enrica@apple.com>
    213

  • trunk/Source/WebCore/css/html.css

    r113320 r113511  
    538538
    539539input:-webkit-autofill {
    540     background-color: #FAFFBD !important;
    541     background-image:none !important;
    542     color: #000000 !important;
     540    background-color: #FAFFBD;
     541    background-image: none;
     542    color: #000000;
    543543}
    544544
Note: See TracChangeset for help on using the changeset viewer.