Created attachment 455865 [details] A screen capture of the expected results, as captured in the latest Firefox Nightly. Motion Path (`offset-path`) properties appear to be working well until a transform animation (or transition) is applied to the same element. I've tried to break this down to a reduced case in the following demo: https://codepen.io/danwilson/pen/OJOjPjJ?editors=0100 I can set values for an `offset-path` and individual `offset-distance` for various elements (in the demo, it's an unordered list of 6 items) If I do just the offset properties, or even if I add a static `transform` to each item, the offset path and distance are applied as expected. However, if instead I try to do a `transform` animation or transition, the offset properties all effectively unapplied (but they show as active in dev tools). It appears it's any animation that includes a transform, translate, scale, or rotate property. An opacity animation, as seen in the demo, still respects the offset properties applied. I first noticed this in a much larger demo https://codepen.io/danwilson/pen/PQddxe and thought Motion Path wasn't working (even though it had been mentioned in Release Notes for Tech Preview) until I opened others' demos in Safari TP. I'm including that demo here in case my reduced test case and hypotheses are incomplete or inaccurate. I have seen this behavior since Motion Path was first introduced on Tech Preview, including the most recent version 142.
That's expected for now, we have a couple of smaller items left to finish support of "offset" and its longhand properties. Once bug 236709 and bug 236712 are done, this will work.
<rdar://problem/90919492>
I have this working with work-in-progress patches for the two blocking bugs.
Blocking bugs are fixed and the codepens mentioned now work fine.