google-chrome - Chrome で SVG クリップパスのアニメーション化が正しく機能しない

Question

SVGclipPathを使用して画像をクリップしています。( JSFiddle )

Chrome では、アニメーションが壊れています。クリップされた画像は、他の何かが変更された場合にのみ再レンダリングされます (たとえば、JSFiddle のボックス間の仕切りをドラッグする場合)。

SVGが変更されたときにChromeに画像を再レンダリングするように「強制」する方法はありclipPathますか?

HTML:

<figure><img src="http://placehold.it/400x400" alt="" /></figure>
<svg width="0" height="0">
    <clipPath id="slideActiveClipPath" clipPathUnits="objectBoundingBox">
        <polygon points="0 0, 1 0, 1 1, 0 1"></polygon>
    </clipPath>
</svg>

CSS:

@keyframes slide {
    from {
        transform: scale(0);
    }
    to {
        transform: scale(1);
    }
}

#slideActiveClipPath polygon {
    animation: slide 1s ease-in-out infinite;
}

figure {
    -webkit-clip-path: url(#slideActiveClipPath);
    margin: 0;
    padding: 0;
}