Changeset 292531 in webkit


Ignore:
Timestamp:
Apr 7, 2022 5:57:58 AM (3 months ago)
Author:
ntim@apple.com
Message:

[:has() pseudo-class] Support invalidation for :autofill pseudo class
https://bugs.webkit.org/show_bug.cgi?id=238899

Reviewed by Antti Koivisto.

Source/WebCore:

Tests: LayoutTests/fast/forms/input-autofilled-*.html

I've only added tests for the :autofill case, since the other pseudo-classes are supposed to be internal-only.

  • html/HTMLInputElement.cpp:

(WebCore::HTMLInputElement::setAutoFilled):
(WebCore::HTMLInputElement::setAutoFilledAndViewable):
(WebCore::HTMLInputElement::setAutoFilledAndObscured):

LayoutTests:

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

Legend:

Unmodified
Added
Removed
  • trunk/LayoutTests/ChangeLog

    r292522 r292531  
     12022-04-07  Tim Nguyen  <ntim@apple.com>
     2
     3        [:has() pseudo-class] Support invalidation for :autofill pseudo class
     4        https://bugs.webkit.org/show_bug.cgi?id=238899
     5
     6        Reviewed by Antti Koivisto.
     7
     8        * fast/forms/input-autofilled-expected.txt:
     9        * fast/forms/input-autofilled.html:
     10
    1112022-04-06  Myles C. Maxfield  <mmaxfield@apple.com>
    212
  • trunk/LayoutTests/fast/forms/input-autofilled-expected.txt

    r267644 r292531  
    1 This tests that foreground and background colors properly change for autofilled inputs. It can only be run using DumpRenderTree.
     1This tests that foreground and background colors properly change for autofilled inputs.
    22
    3 PASS
    43
     4PASS Testing input style changing with UA stylesheet
     5PASS Testing form style changing with :has() selector
     6
  • trunk/LayoutTests/fast/forms/input-autofilled.html

    r155268 r292531  
     1<!DOCTYPE html>
    12<html>
    23<head>
    3     <script src="../../resources/js-test-pre.js"></script>
    4     <script>
    5     function test() {
    6         if (window.testRunner) {
    7             testRunner.dumpAsText();
    8         }
    9 
    10         var tf = document.getElementById('tf');
    11         var computedStyle = document.defaultView.getComputedStyle(tf);
    12         var originalForeground = computedStyle.color;
    13         var originalBackground = computedStyle.backgroundColor;
    14 
    15         if (window.internals) {
    16             window.internals.setAutofilled(tf, true);
    17         }
    18 
    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         }
    31 
    32         if (window.internals) {
    33             window.internals.setAutofilled(tf, false);
    34         }
    35 
    36         // 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('');
    48     }
    49     </script>
    50 
    514    <style>
    52     #tf {
     5    input {
    536      color: #FFFFFF;
    547      background-color: #FFFFFF;
    558    }
     9    form:has(input:autofill) {
     10        background-color: green;
     11        color: white;
     12    }
    5613    </style>
    5714</head>
    58 <body onload="test()">
    59     This tests that foreground and background colors properly change for autofilled inputs.  It can only be run using DumpRenderTree.<br>
    60     <form name="fm">
    61         <input type="text" id="tf" value="Field value" />
     15<body>
     16    This tests that foreground and background colors properly change for autofilled inputs.<br>
     17    <form name="form" id="form">
     18        <input type="text" id="input" value="Field value" />
    6219    </form>
    63     <div id="console"></div>
     20    <script src="../../resources/testharness.js"></script>
     21    <script src="../../resources/testharnessreport.js"></script>
     22    <script>
     23    test(() => {
     24        testElement(input);
     25    }, "Testing input style changing with UA stylesheet");
     26    test(() => {
     27        testElement(form);
     28    }, "Testing form style changing with :has() selector");
     29
     30    function testElement(element) {
     31        let computedStyle = getComputedStyle(element);
     32        let originalForeground = computedStyle.color;
     33        let originalBackground = computedStyle.backgroundColor;
     34
     35        if (window.internals)
     36            window.internals.setAutofilled(input, true);
     37
     38        // Both the foreground and background colors should change when autofilled.
     39        computedStyle = getComputedStyle(element);
     40        assert_not_equals(computedStyle.color, originalForeground, "Text color should change when autofilled.");
     41        assert_not_equals(computedStyle.backgroundColor, originalBackground, "Background color should change when autofilled.")
     42
     43        if (window.internals)
     44            window.internals.setAutofilled(input, false);
     45
     46        // Colors should be restored.
     47        computedStyle = getComputedStyle(element);
     48        assert_equals(computedStyle.color, originalForeground, "Text color should be restored");
     49        assert_equals(computedStyle.backgroundColor, originalBackground, "Background color should be restored")
     50    }
     51    </script>
    6452</body>
    6553</html>
  • trunk/Source/WebCore/ChangeLog

    r292530 r292531  
     12022-04-07  Tim Nguyen  <ntim@apple.com>
     2
     3        [:has() pseudo-class] Support invalidation for :autofill pseudo class
     4        https://bugs.webkit.org/show_bug.cgi?id=238899
     5
     6        Reviewed by Antti Koivisto.
     7
     8        Tests: LayoutTests/fast/forms/input-autofilled-*.html
     9
     10        I've only added tests for the :autofill case, since the other pseudo-classes are supposed to be internal-only.
     11
     12        * html/HTMLInputElement.cpp:
     13        (WebCore::HTMLInputElement::setAutoFilled):
     14        (WebCore::HTMLInputElement::setAutoFilledAndViewable):
     15        (WebCore::HTMLInputElement::setAutoFilledAndObscured):
     16
    1172022-04-07  Carlos Garcia Campos  <cgarcia@igalia.com>
    218
  • trunk/Source/WebCore/html/HTMLInputElement.cpp

    r292466 r292531  
    14071407        return;
    14081408
     1409    Style::PseudoClassChangeInvalidation styleInvalidation(*this, CSSSelector::PseudoClassAutofill, autoFilled);
    14091410    m_isAutoFilled = autoFilled;
    1410     invalidateStyleForSubtree();
    14111411}
    14121412
     
    14161416        return;
    14171417
     1418    Style::PseudoClassChangeInvalidation styleInvalidation(*this, CSSSelector::PseudoClassAutofillStrongPasswordViewable, autoFilledAndViewable);
    14181419    m_isAutoFilledAndViewable = autoFilledAndViewable;
    1419     invalidateStyleForSubtree();
    14201420}
    14211421
     
    14251425        return;
    14261426
     1427    Style::PseudoClassChangeInvalidation styleInvalidation(*this, CSSSelector::PseudoClassAutofillAndObscured, autoFilledAndObscured);
    14271428    m_isAutoFilledAndObscured = autoFilledAndObscured;
    1428     invalidateStyleForSubtree();
    14291429}
    14301430
Note: See TracChangeset for help on using the changeset viewer.