event.target と型の話

知っている人からすれば「だから何」という話ですが、ちょっと面白かったので小ネタを。

この記事のサンプルコードは React TSX で書いていますが、今回の話題では React は関係ないです

React + TypeScript を書いていたとき、下記のコードで型エラーが出ました。

// Property 'src' does not exist on type 'EventTarget'.ts(2339)
<img src="foo.png" onClick={(event) => console.log(event.target.src)} />

これを、こう書き換えたら型エラーは消えました。

// エラーなし
<img src="foo.png" onClick={(event) => console.log(event.currentTarget.src)} />

一瞬「どちらも event.target には HTMLImageElement が入るはずなのに何故変わる？」と思ったのですが、少し考えれば「それはそう」となりました。

この振る舞いの違い、説明できるでしょうか？

この記事は書きかけなので解説はあとで書きます (もしくは誰かがコメントしてくれる)
→ コメントに書きました