SVGアニメーション – Web Animations API を使う – アニメーション実行中のreverse()メソッドと、iterationsプロパティのInfinityについて

前回の投稿(https://propansystem.net/blog/9976)で、option定義でiterations属性の値を「Infinity」にしたサンプルを試します。

前回のサンプルのOptions定義「iterations」プロパティに「Infinity」の値を追加し、
アニメーション開始後にreverse()メソッドを有効にする逆再生ボタンを押下するとjavascriptエラーになります。

Uncaught InvalidStateError: Failed to execute 'reverse' on
 'Animation': Cannot play reversed Animation with infinite target effect end.
 at HTMLInputElement.<anonymous> 

「Infinity」プロパティを有効にすると無限再生することになる為、終了状態を持たない為エラーになります。