Bug 250012 – baseline-shift property does not allow inheritance of numerical values

• Status: NEW
• Component: CSS

[Ahmad Saleem]

Hi Team,

While going through Blink's commit, came across another testcase:

Test Case - https://jsfiddle.net/7u9bcd1y/show

^ Chrome Canary 111 only fails first test while Firefox Nightly 110 fail all. Safari 16.2 & STP160 only fail last two test cases.

Web-Spec: https://svgwg.org/svg2-draft/single-page.html#text-BaselineShiftProperty & https://www.w3.org/TR/SVG11/text.html#BaselineShiftProperty

Blink Commit - https://src.chromium.org/viewvc/blink?view=revision&revision=176928

Just wanted to raise so this can be fixed according to SVG2 specs etc.

Thanks!

[Radar WebKit Bug Importer]

<rdar://problem/104048718>

[Ahmad Saleem]

Took updated copy of test and changed it into JSfiddle - https://jsfiddle.net/5oL8uzfs/show

^ Chrome Canary 113 passes all, while WebKit ToT (261835@main) fails two:

>>> Inheritance of the baseline-shift property, baseline.
>>> Inheritance of the baseline-shift property, 100%.

________________________

Just wanted to update. Thanks!

Do we need to push this bit of 'BaselineShiftValue" to above "inherited" flags?

https://searchfox.org/wubkat/source/Source/WebCore/rendering/style/SVGRenderStyle.cpp#171

[Ahmad Saleem]

Plus I think here - https://searchfox.org/wubkat/source/Source/WebCore/rendering/svg/SVGTextLayoutEngineBaseline.cpp#56

baselineshift::Length:

We are returning 'default' of '0' rather than percentage value?

But at the same time, the length type of percentage is dealt here, if I am reading this bit correctly:

https://searchfox.org/wubkat/source/Source/WebCore/rendering/svg/SVGTextLayoutEngineBaseline.cpp#42

Confused...

[Ahmad Saleem]

We kind of already have this:

https://searchfox.org/wubkat/source/Source/WebCore/style/StyleBuilderCustom.h#1141

and did:

auto baselineShift = svgParentStyle.baselineShift();

if (baselineShift == BaselineShift::Length)
        svgStyle.setBaselineShiftValue(forwardInheritedValue(svgParentStyle.baselineShiftValue()));

_____

and it does not progress this testcase but when I look into WPT for 'baseline-shift' coverage, we are doing better than Blink.

https://wpt.fyi/results/?label=master&label=experimental&aligned=&q=baseline-shift

Now back to investigation board. :-)

_____

@Karl & @Tim - any input would be welcome. :-)

[Ahmad Saleem]

We are passing all WPT here: https://wpt.fyi/results/css?label=master&label=experimental&aligned=&q=baseline-shift

[Karl Dubost]

The spec says
https://drafts.csswg.org/css-inline/#propdef-baseline-shift

> Percentages: 	refer to the used value of line-height
> Computed value: the specified keyword or a computed <length-percentage> value 

The test case in the JS fiddle is 


data:text/html,<svg height="0" style="baseline-shift: 100%;"><text></text></svg>

and window.getComputedStyle(document.getElementsByTagName('svg')[0]).baselineShift

returns: 

0px       in Safari 
undefined in Firefox
100%      in Chrome

line-height value in that test case is: `normal`

If I set the height to something different than 0.
data:text/html,<svg height="10" style="baseline-shift: 100%;"><text></text></svg>

212.249863px in Safari 
undefined    in Firefox
100%         in Chrome


To me, WebKit does the right thing as it returns the computed <length-percentage> value, defined in
https://drafts.csswg.org/css-values-4/#typedef-length-percentage

> <length-percentage>
>     Equivalent to [ <length> | <percentage> ], where the <percentage> will resolve to a <length>.

[Karl Dubost]

But Elika will probably know better.

[Ahmad Saleem]

Chrome Canary 121 passes all test: https://jsfiddle.net/tfn035qm/show

and

Safari Technology Preview 182 fails first and last test.

[Ahmad Saleem]

`baseline-shift` is deprecated in SVG2 and Firefox also not support it. I think we should discuss this in SVGWG and coordinate with Chrome to remove it as well.

https://svgwg.org/svg2-draft/text.html#BaselineShiftProperty