[Text autosizing][iPadOS] bing.com is hard to read even with boosted text because...
authorzalan@apple.com <zalan@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 28 Jun 2019 22:27:58 +0000 (22:27 +0000)
committerzalan@apple.com <zalan@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 28 Jun 2019 22:27:58 +0000 (22:27 +0000)
https://bugs.webkit.org/show_bug.cgi?id=199318
<rdar://problem/51826096>

Reviewed by Wenson Hsieh.

Source/WebCore:

Initial implementation of line height boosting on iPadOs. It enlarges line height in certain cases to improve readability when the text content feels too dense.
It kicks in only for relatively small text (12px) where it slightly (1.25x) changes the line height to widen the gap between lines.

* css/StyleResolver.cpp:
(WebCore::StyleResolver::adjustRenderStyleForTextAutosizing):

LayoutTests:

* fast/text-autosizing/ios/idempotentmode/line-height-boosting-expected.txt: Added.
* fast/text-autosizing/ios/idempotentmode/line-height-boosting.html: Added.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@246943 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/ChangeLog
LayoutTests/fast/text-autosizing/ios/idempotentmode/line-height-boosting-expected.txt [new file with mode: 0644]
LayoutTests/fast/text-autosizing/ios/idempotentmode/line-height-boosting.html [new file with mode: 0644]
Source/WebCore/ChangeLog
Source/WebCore/css/StyleResolver.cpp

index 039dd1f..125350d 100644 (file)
@@ -1,3 +1,14 @@
+2019-06-28  Zalan Bujtas  <zalan@apple.com>
+
+        [Text autosizing][iPadOS] bing.com is hard to read even with boosted text because of the line height
+        https://bugs.webkit.org/show_bug.cgi?id=199318
+        <rdar://problem/51826096>
+
+        Reviewed by Wenson Hsieh.
+
+        * fast/text-autosizing/ios/idempotentmode/line-height-boosting-expected.txt: Added.
+        * fast/text-autosizing/ios/idempotentmode/line-height-boosting.html: Added.
+
 2019-06-27  Ryosuke Niwa  <rniwa@webkit.org>
 
         Fix the test added in r246868 on iOS debug simulator.
diff --git a/LayoutTests/fast/text-autosizing/ios/idempotentmode/line-height-boosting-expected.txt b/LayoutTests/fast/text-autosizing/ios/idempotentmode/line-height-boosting-expected.txt
new file mode 100644 (file)
index 0000000..2ac7935
--- /dev/null
@@ -0,0 +1,13 @@
+PASS result is >= 18
+PASS result is >= 13
+PASS result is >= 11
+PASS result is >= 12
+PASS result is >= 18
+PASS successfullyParsed is true
+
+TEST COMPLETE
+yes line-height boost
+yes line-height boost
+yes line-height boost
+no line-height boost
+no line-height boost
diff --git a/LayoutTests/fast/text-autosizing/ios/idempotentmode/line-height-boosting.html b/LayoutTests/fast/text-autosizing/ios/idempotentmode/line-height-boosting.html
new file mode 100644 (file)
index 0000000..bdc3fd1
--- /dev/null
@@ -0,0 +1,38 @@
+<!DOCTYPE html><!-- webkit-test-runner [ useFlexibleViewport=true ] -->
+<html>
+<head>
+<meta name="viewport" content="initial-scale=0.6666">
+<script>
+if (window.internals) {
+    window.internals.settings.setTextAutosizingEnabled(true);
+    window.internals.settings.setTextAutosizingUsesIdempotentMode(true);
+}
+</script>
+<script src="../../../../resources/js-test-pre.js"></script>
+</head>
+<body>
+<div><span id=target1 style="font-size: 12px; line-height: 10px">yes line-height boost</span></div>
+<div><span id=target2 style="font-size: 8px; line-height: 2px">yes line-height boost</span></div>
+<div><span id=target3 style="font-size: 6px; line-height: 10px">yes line-height boost</span></div>
+<div><span id=target4 style="font-size: 6px; line-height: 12px">no line-height boost</span></div>
+<div><span id=target5 style="font-size: 18px;">no line-height boost</span></div>
+<script>
+document.body.offsetHeight;
+let result = Number.parseInt(window.getComputedStyle(target1).getPropertyValue("line-height"));
+shouldBeGreaterThanOrEqual("result", "18");
+
+result = Number.parseInt(window.getComputedStyle(target2).getPropertyValue("line-height"));
+shouldBeGreaterThanOrEqual("result", "13");
+
+result = Number.parseInt(window.getComputedStyle(target3).getPropertyValue("line-height"));
+shouldBeGreaterThanOrEqual("result", "11");
+
+result = Number.parseInt(window.getComputedStyle(target4).getPropertyValue("line-height"));
+shouldBeGreaterThanOrEqual("result", "12");
+
+result = Number.parseInt(window.getComputedStyle(target5).getPropertyValue("line-height"));
+shouldBeGreaterThanOrEqual("result", "18");
+</script>
+<script src="../../../../resources/js-test-post.js"></script>
+</body>
+</html>
index 22d2e8c..5e5bacd 100644 (file)
@@ -1,3 +1,17 @@
+2019-06-28  Zalan Bujtas  <zalan@apple.com>
+
+        [Text autosizing][iPadOS] bing.com is hard to read even with boosted text because of the line height
+        https://bugs.webkit.org/show_bug.cgi?id=199318
+        <rdar://problem/51826096>
+
+        Reviewed by Wenson Hsieh.
+
+        Initial implementation of line height boosting on iPadOs. It enlarges line height in certain cases to improve readability when the text content feels too dense.
+        It kicks in only for relatively small text (12px) where it slightly (1.25x) changes the line height to widen the gap between lines.
+
+        * css/StyleResolver.cpp:
+        (WebCore::StyleResolver::adjustRenderStyleForTextAutosizing):
+
 2019-06-28  Alex Christensen  <achristensen@webkit.org>
 
         Make getHostnamesWithCookies more robust
index ad9d3bb..15bfbe8 100644 (file)
@@ -892,14 +892,32 @@ void StyleResolver::adjustRenderStyleForTextAutosizing(RenderStyle& style, const
     if (style.textSizeAdjust().isNone())
         return;
 
+    float initialScale = document().page() ? document().page()->initialScale() : 1;
+    auto adjustLineHeightIfNeeded = [&](auto computedFontSize) {
+        auto lineHeight = style.specifiedLineHeight();
+        constexpr static unsigned eligibleFontSize = 12;
+        if (computedFontSize * initialScale >= eligibleFontSize)
+            return;
+
+        constexpr static float boostFactor = 1.25;
+        auto minimumLineHeight = boostFactor * computedFontSize;
+        if (!lineHeight.isFixed() || lineHeight.value() >= minimumLineHeight)
+            return;
+
+        style.setLineHeight({ minimumLineHeight, Fixed });
+    };
+
     if (!style.isIdempotentTextAutosizingCandidate())
-        return;
+        return adjustLineHeightIfNeeded(style.computedFontSize());
 
-    float initialScale = document().page() ? document().page()->initialScale() : 1;
     auto fontDescription = style.fontDescription();
-    fontDescription.setComputedSize(AutosizeStatus::idempotentTextSize(fontDescription.specifiedSize(), initialScale));
+    auto initialComputedFontSize = fontDescription.computedSize(); 
+    auto adjustedFontSize = AutosizeStatus::idempotentTextSize(fontDescription.specifiedSize(), initialScale);
+    fontDescription.setComputedSize(adjustedFontSize);
     style.setFontDescription(WTFMove(fontDescription));
     style.fontCascade().update(&document().fontSelector());
+    if (initialComputedFontSize != adjustedFontSize)
+        adjustLineHeightIfNeeded(adjustedFontSize);
 }
 #endif