In d55ae32 @mehdi-kazemi upstreamed (and @kevers-google reviewed) a fair few tests about the effect of inherit and font-size on keyframes. A few of those tests name "… clamped to 0px" are surprising to me, for instance in web-animations/responsive/perspective.html:
test(function() {
element.style.fontSize = '10px';
var player = element.animate([{perspective: '40px'}, {perspective: 'calc(40px - 2em)'}], 10);
player.pause();
player.currentTime = 5;
element.style.fontSize = '40px';
assert_equals(getComputedStyle(element).perspective, '0px');
player.currentTime = 7.5;
assert_equals(getComputedStyle(element).perspective, '0px');
}, 'perspective clamped to 0px');
This test expects that after setting font-size to 40px the calc(40px - 2em) keyframe value resolves to 40px - 2 * 40px, or -40px and that blending at the mid-way point resolves to 0. Safari and Firefox both fail this test, and in the case of Safari that is because we clip the resolved keyframe value to 0 since the CSS Transforms Level 2 spec for perspective says that negative values are not allowed. As such we animate between 40px and 0 and not 40px and -40px.
I believe this test was written by @ericwilligers on the Chromium side. Eric, could you explain how this test is believed to be correct?
Cc @birtles, @flackr and @BorisChiou on the animations side, but also @dbaron for the transforms aspect of this.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4