Bug 1730049 - correct dominant-baseline for vertical-rl r=jfkthame

Differential Revision: https://phabricator.services.mozilla.com/D125371
This commit is contained in:
Robert Longson 2021-09-15 08:52:32 +00:00
parent b228e7547d
commit 2393c1cc61
4 changed files with 91 additions and 19 deletions

View File

@ -490,6 +490,7 @@ fuzzy-if(cocoaWidget&&layersGPUAccelerated,0-1,0-3) random-if(/^Windows\x20NT\x2
random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == text-layout-07.svg text-layout-07-ref.svg # Bug 1392106
random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == text-layout-08.svg text-layout-08-ref.svg # Bug 1392106
random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == text-layout-09.svg pass.svg # Bug 1392106
random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == text-layout-10.svg pass.svg # Bug 1392106
random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == text-scale-01.svg text-scale-01-ref.svg # Bug 1392106
fuzzy-if(skiaContent,0-2,0-1000) random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == text-scale-02.svg text-scale-02-ref.svg # Bug 1392106
random-if(/^Windows\x20NT\x206\.1/.test(http.oscpu)) == text-scale-03.svg text-scale-03-ref.svg # Bug 1392106

View File

@ -20,9 +20,11 @@
}
]]></style>
<script>
function cover(element) {
function cover(id, offset) {
let element = document.getElementById(id);
element.dy.baseVal[0].value = offset;
let rect = document.createElementNS("http://www.w3.org/2000/svg", "rect");
let bbox = element.getBBox();
let bbox = element.getBBox();
rect.x.baseVal.value = bbox.x;
rect.y.baseVal.value = bbox.y;
rect.width.baseVal.value = bbox.width;
@ -37,13 +39,9 @@
let text = 'h';
let textMetrics = ctx.measureText(text);
let hanging = document.getElementById("hanging");
hanging.dy.baseVal[0].value = textMetrics.actualBoundingBoxAscent * 1.1;
cover(hanging);
cover("hanging", textMetrics.actualBoundingBoxAscent * 1.1);
let mathematical = document.getElementById("mathematical");
mathematical.dy.baseVal[0].value = textMetrics.actualBoundingBoxAscent / 2 * 1.4;
cover(mathematical);
cover("mathematical", textMetrics.actualBoundingBoxAscent / 2 * 1.4);
document.documentElement.removeAttribute('class');
}

Before

Width:  |  Height:  |  Size: 1.6 KiB

After

Width:  |  Height:  |  Size: 1.5 KiB

View File

@ -0,0 +1,66 @@
<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" class="reftest-wait">
<foreignObject><canvas xmlns="http://www.w3.org/1999/xhtml" id="canvas"/></foreignObject>
<rect width="100%" height="100%" fill="lime"/>
<g fill="red">
<text dominant-baseline="alphabetic" x="10" y="20">Alphabetic</text>
<text dominant-baseline="auto" x="80" y="20">Auto</text>
<text dominant-baseline="middle" x="150" y="20">Middle</text>
<text dominant-baseline="hanging" x="220" y="20">Hanging</text>
<text dominant-baseline="central" x="290" y="20">Central</text>
<text dominant-baseline="mathematical" x="360" y="20">Mathematical</text>
</g>
<g fill="lime">
<text id="alphabetic" dominant-baseline="text-before-edge" x="10" y="20" dx="0">Alphabetic</text>
<text id="auto" dominant-baseline="text-before-edge" x="80" y="20" dx="0">Auto</text>
<text id="middle" dominant-baseline="text-before-edge" x="150" y="20" dx="0">Middle</text>
<text id="hanging" dominant-baseline="text-before-edge" x="220" y="20" dx="0">Hanging</text>
<text id="central" dominant-baseline="text-before-edge" x="290" y="20" dx="0">Central</text>
<text id="mathematical" dominant-baseline="text-before-edge" x="360" y="20" dx="0">Mathematical</text>
</g>
<style><![CDATA[
text {
font: bold 30px Verdana, Helvetica, Arial, sans-serif;
writing-mode: vertical-rl;
}
]]></style>
<script>
function cover(id, offset) {
let element = document.getElementById(id);
element.dx.baseVal[0].value = offset;
let rect = document.createElementNS("http://www.w3.org/2000/svg", "rect");
let bbox = element.getBBox();
rect.x.baseVal.value = bbox.x;
rect.y.baseVal.value = bbox.y;
rect.width.baseVal.value = bbox.width;
rect.height.baseVal.value = bbox.height;
element.parentElement.appendChild(rect);
}
onload = function() {
const canvas = document.getElementById('canvas');
const ctx = canvas.getContext('2d');
ctx.font = 'bold 30px Verdana, Helvetica, Arial, sans-serif';
let text = 'h';
let textMetrics = ctx.measureText(text);
cover("alphabetic", textMetrics.actualBoundingBoxAscent);
cover("auto", textMetrics.actualBoundingBoxAscent * 0.8);
cover("middle", textMetrics.actualBoundingBoxAscent * 0.6);
cover("hanging", textMetrics.actualBoundingBoxAscent * 0.1);
cover("central", textMetrics.actualBoundingBoxAscent * 0.7);
cover("mathematical", textMetrics.actualBoundingBoxAscent * 0.4);
document.documentElement.removeAttribute('class');
}
</script>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

View File

@ -283,24 +283,31 @@ static nscoord GetBaselinePosition(nsTextFrame* aFrame, gfxTextRun* aTextRun,
gfxTextRun::Metrics metrics =
aTextRun->MeasureText(gfxFont::LOOSE_INK_EXTENTS, nullptr);
auto convertIfVerticalRL = [&](gfxFloat dominantBaseline) {
return writingMode.IsVerticalRL()
? metrics.mAscent + metrics.mDescent - dominantBaseline
: dominantBaseline;
};
switch (aDominantBaseline) {
case StyleDominantBaseline::Hanging:
return metrics.mAscent * 0.2;
return convertIfVerticalRL(metrics.mAscent * 0.2);
case StyleDominantBaseline::TextBeforeEdge:
return writingMode.IsVerticalRL() ? metrics.mAscent + metrics.mDescent
: 0;
return convertIfVerticalRL(0);
case StyleDominantBaseline::Auto:
case StyleDominantBaseline::Alphabetic:
return writingMode.IsVerticalRL()
? metrics.mAscent + metrics.mDescent -
aFrame->GetLogicalBaseline(writingMode)
? metrics.mAscent * 0.5
: aFrame->GetLogicalBaseline(writingMode);
case StyleDominantBaseline::Auto:
return convertIfVerticalRL(aFrame->GetLogicalBaseline(writingMode));
case StyleDominantBaseline::Middle:
return aFrame->GetLogicalBaseline(writingMode) -
SVGContentUtils::GetFontXHeight(aFrame) / 2.0 *
AppUnitsPerCSSPixel() * aFontSizeScaleFactor;
return convertIfVerticalRL(aFrame->GetLogicalBaseline(writingMode) -
SVGContentUtils::GetFontXHeight(aFrame) / 2.0 *
AppUnitsPerCSSPixel() *
aFontSizeScaleFactor);
case StyleDominantBaseline::TextAfterEdge:
case StyleDominantBaseline::Ideographic:
@ -310,11 +317,11 @@ static nscoord GetBaselinePosition(nsTextFrame* aFrame, gfxTextRun* aTextRun,
case StyleDominantBaseline::Central:
return (metrics.mAscent + metrics.mDescent) / 2.0;
case StyleDominantBaseline::Mathematical:
return metrics.mAscent / 2.0;
return convertIfVerticalRL(metrics.mAscent / 2.0);
}
MOZ_ASSERT_UNREACHABLE("unexpected dominant-baseline value");
return aFrame->GetLogicalBaseline(writingMode);
return convertIfVerticalRL(aFrame->GetLogicalBaseline(writingMode));
}
/**