検証用コードにバグがあったため、本記事は削除し・・ようと思いましたが、
同じパターンではまる人がいるかもしれないので、残しておきます。
(メソッドを外に出す時などに'()'を消し忘れると、こうなります)
コード例(with-bug.js)
バグありなので流用しないように!
with-bug.js
function fn() {
}
new Howl(...)
.on('end', fn()) // `()`が付いていた
発生する現象(旧):
(設定は、loop: false
)
・onendイベントで呼ばれるはずのメソッド(コード例のfn()
)が、再生中に呼ばれる
※この時点で、playing()
はfalse
・コード例のfn()内で、
しばらくplaying()
を観察し続けると、途中からtrueになる
※変化するのは、約50ミリ秒後
・実際に曲の再生が終了した時点でのplaying()
はtrueになっている
・この場合に、onendイベントの後、再度play()を呼ぶと、音が重なる
蛇足
ロード中にアンロードするとおかしくなるバグはあるらしい。(ブラウザ依存?)
Sounds keep overlapping #686