Commit c42229d8 authored by Manuel Rego Casasnovas's avatar Manuel Rego Casasnovas Committed by Commit Bot

Fix double zooming in StyleBuilderConverter::ConvertBorderWidth()

StyleBuilderConverter::ConvertBorderWidth() is computing the zoom twice,
the value we set in |result| variable is already zoomed. But then we
have some extra lines that zoom it again and check if the final value is
between 0px and 1px, to return 1px.

This is wrong, as |result| was already zoomed, we can avoid that second
operation and use that value to do the check directly.

This was causing issues in the past but in very corner cases (so not
very easy to reproduce). However due to the change on how subpixel
border widths are managed (now they're floored, see r770064) this issue
is causing that some borders are invisible.

Added one WPT test that would fail with scaling factor 1.5.
Also added a internal test using "zoom" property.

BUG=1126396
TEST=external/wpt/css/css-backgrounds/border-width-small-values-001-*.html
TEST=wpt_internal/css/css-backgrounds/border-width-zoom-001.html

Change-Id: I27baac92036f7761e1616d55e90e4ed80cbb8914
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2401030Reviewed-by: default avatarRune Lillesveen <futhark@chromium.org>
Commit-Queue: Manuel Rego <rego@igalia.com>
Cr-Commit-Position: refs/heads/master@{#805717}
parent 6b47791a
...@@ -1110,8 +1110,7 @@ float StyleBuilderConverter::ConvertBorderWidth(StyleResolverState& state, ...@@ -1110,8 +1110,7 @@ float StyleBuilderConverter::ConvertBorderWidth(StyleResolverState& state,
result = result =
primitive_value.ComputeLength<float>(state.CssToLengthConversionData()); primitive_value.ComputeLength<float>(state.CssToLengthConversionData());
} }
double zoomed_result = state.StyleRef().EffectiveZoom() * result; if (result > 0.0 && result < 1.0)
if (zoomed_result > 0.0 && zoomed_result < 1.0)
return 1.0; return 1.0;
return clampTo<float>(result, defaultMinimumForClamp<float>(), return clampTo<float>(result, defaultMinimumForClamp<float>(),
defaultMaximumForClamp<float>()); defaultMaximumForClamp<float>());
......
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Backgrounds and Borders Test: border-width small values</title>
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-width">
<link rel="mismatch" href="reference/border-width-small-values-001-ref.html">
<meta name="assert" content="Tese tests check that small values for border-width (greater than 0px and lower than 1px) are visible.">
<div style="border: 0.1px solid black;">The test passes if this text has a border</div>
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Backgrounds and Borders Test: border-width small values</title>
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-width">
<link rel="mismatch" href="reference/border-width-small-values-001-ref.html">
<meta name="assert" content="Tese tests check that small values for border-width (greater than 0px and lower than 1px) are visible.">
<div style="border: 0.25px solid black;">The test passes if this text has a border</div>
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Backgrounds and Borders Test: border-width small values</title>
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-width">
<link rel="mismatch" href="reference/border-width-small-values-001-ref.html">
<meta name="assert" content="Tese tests check that small values for border-width (greater than 0px and lower than 1px) are visible.">
<div style="border: 0.5px solid black;">The test passes if this text has a border</div>
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Backgrounds and Borders Test: border-width small values</title>
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-width">
<link rel="mismatch" href="reference/border-width-small-values-001-ref.html">
<meta name="assert" content="Tese tests check that small values for border-width (greater than 0px and lower than 1px) are visible.">
<div style="border: 0.7px solid black;">The test passes if this text has a border</div>
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Backgrounds and Borders Test: border-width small values</title>
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-width">
<link rel="mismatch" href="reference/border-width-small-values-001-ref.html">
<meta name="assert" content="Tese tests check that small values for border-width (greater than 0px and lower than 1px) are visible.">
<div style="border: 0.9px solid black;">The test passes if this text has a border</div>
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Backgrounds and Borders Reference Test: border-width small values</title>
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<div>The test passes if this text has a border</div>
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Backgrounds and Borders Reference Test: border-width zoom</title>
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<style>
div { width: 75px; height: 75px; }
</style>
<p>The test passses if you see 4 boxes with green border, the last 2 ones with a thicker border.</p>
<div style="border: solid 0.75px green;"></div>
<br>
<div style="border: solid 0.75px green; border-radius: 15px;"></div>
</br>
<div style="border: solid 5px green;"></div>
<br>
<div style="border: solid 5px green; border-radius: 10px;"></div>
<!DOCTYPE html>
<!-- This test has to be internal because "zoom" property is not standard and is not supported by all browsers. -->
<meta charset="utf-8">
<title>CSS Backgrounds and Borders Test: border-width zoom</title>
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
<link rel="help" href="https://drafts.csswg.org/css-backgrounds/#border-width">
<link rel="match" href="border-width-zoom-001-ref.html">
<meta name="assert" content="Tese tests check that border-width with different zoom values are properly rendered and always visible.">
<p>The test passses if you see 4 boxes with green border, the last 2 ones with a thicker border.</p>
<div style="zoom: 1.5; border: solid 0.5px green; width: 50px; height: 50px;"></div>
<br>
<div style="zoom: 1.5; border: solid 0.5px green; width: 50px; height: 50px; border-radius: 10px;"></div>
</br>
<div style="zoom: 0.1; border: solid 50px green; width: 750px; height: 750px;"></div>
<br>
<div style="zoom: 0.1; border: solid 50px green; width: 750px; height: 750px; border-radius: 100px;"></div>
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment