Ignore font-feature-settings in autofill preview state

Fixed: 1378719 Change-Id: If569345ad861dd5c0f9aaabae34a72121648391b Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4012999 Reviewed-by: Mason Freed <masonf@chromium.org> Auto-Submit: Dominic Battré <battre@chromium.org> Commit-Queue: Dominic Battré <battre@chromium.org> Cr-Commit-Position: refs/heads/main@{#1069096}
chromium · Nov 9, 2022 · c27ecc5 · c27ecc5
1 parent a5e4856
commit c27ecc5
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 3 deletions.
diff --git a/third_party/blink/renderer/core/html/resources/html.css b/third_party/blink/renderer/core/html/resources/html.css
@@ -541,11 +541,14 @@ input::-internal-input-suggested {
     text-overflow: inherit;
     white-space: nowrap;
     overflow: hidden;
-}
+  }
 
-input::-internal-input-suggested,
-textarea::-internal-input-suggested {
+  input::-internal-input-suggested,
+  textarea::-internal-input-suggested {
     font: -webkit-small-control !important;
+    /* -webkit-small-control does not pin the font-feature-settings and we want
+       previews to look consistent. */
+    font-feature-settings: normal !important;
     /* Prevent that overflow affects the scrollable area. Without this,
        LayoutBox::*Scroll{Height,Width}() may determine the scroll width/height
        from the scrollable area instead of from the overrides in

diff --git a/...ts/fast/forms/text/input-appearance-autofill-ignoring-font-feature-settings-expected.html b/...ts/fast/forms/text/input-appearance-autofill-ignoring-font-feature-settings-expected.html
@@ -0,0 +1,6 @@
+<!DOCTYPE html>
+<input id="input" style="width: 99px;" >
+<script>
+internals.setSuggestedValue(input, 'Hello');
+internals.setAutofilled(input, true);
+</script>
diff --git a/...k/web_tests/fast/forms/text/input-appearance-autofill-ignoring-font-feature-settings.html b/...k/web_tests/fast/forms/text/input-appearance-autofill-ignoring-font-feature-settings.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<style>
+  /* These should be ignored when in autofilled state. */
+  input {
+     font-feature-settings: "case", "ss01", "ss02", "ss03";
+  }
+</style>
+<input id="input" style="width: 99px;" >
+<script>
+internals.setSuggestedValue(input, 'Hello');
+internals.setAutofilled(input, true);
+</script>