git clone https://github.com/klaasman/react-pose-ie11-bug
cd react-pose-ie11-bug
yarn install
yarn start
Wait for the initial build to finish and open http://localhost:8000 in Internet Explorer 11.
In /src/App.js there's a nested Posed component. This nested component will not inherit the pose of its parent.
const ContainerPose = posed.div({
off: { x: 0 },
on: { x: 200 },
})
const InnerPose = posed.div({
off: { y: 0 },
on: { y: 200 },
})
// ...
<ContainerPose pose={togglingOnOrOffPose}>
<InnerPose /> {/* <= this `<InnerPose />` will not inherit the pose of the `<ContainerPose />` */}
</ContainerPose>Wrong tween (IE11):
Right tween:
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent