combine-transforms-properties-motion-path.html

<!DOCTYPE html>
<style>
div {
    width: 100px;
    height: 100px;
    position: absolute;
    transform-origin: 0% 0%;
    offset-anchor: 0% 0%;
}

/* Note the order of the scaling operation affects the path coordinates */
#target {
    background-color: red;
    translate: 200px 10px;
    rotate: 90deg;
    scale: 1 2;
    offset: path("m 0 0 v -20 h 20") 100% 0rad;
}
#expected {
    background-color: green;
    transform: translate(240px, 30px) rotate(90deg) scale(1, 2);
}
</style>

<p>There should be no red color boxes</p>
<div id="target"></div>
<div id="expected"></div>

chromium/third_party/blink/web_tests/transforms/combine-transforms-properties-motion-path.html