content scriptのコンテキストで new Image() instanceof HTMLImageElement がfalseになる

[yamaji]

お世話になります。yamajiと申します。

最近、自作の拡張機能の一部機能で"Type error"というエラーが出ているのに気付きました。

発生箇所を調べたところ

new Image() で作成したImageオブジェクトをキャンバスに描画するという処理を行なっている箇所でした。

var img = new Image(100, 100),
    ctx = canvas.getContext('2d');
img.src = '/images/xxx.png';
ctx.drawImage(img, 0, 0, 10, 50);

このように書くとdrawImage()の処理でTypeErrorが発生します。

そこで、DevToolのコンソールで

new Image(100,100) instanceof HTMLImageElement

を実行してみると

<page context>では結果が true となりますが

chrome-extension://xxx のコンテキストでは false になりました。

自作の拡張機能に限らず他の拡張機能のコンテキストでも同じくfalseになります。

そのため、drawImage()に渡す第一引数がImageオブジェクトでないということで

TyprErrorになっているのだと思います。

自分の環境は

Windows版のバージョン 27.0.1453.9 dev-m

です。

content scriptではnew Image()を使えないとか制限があるのでしょうか。

(以前は問題なく動いていたと思うのですが。)

何か対応策があれば教えて頂けますでしょうか。

[Toru Yoshikawa]

吉川です。

stableだとtrueが返ってきますね。
canaryだとfalseです。

返ってくるのは、どちらもHTMLImageElementですが、
後者の場合は、ノードではなくオブジェクトとして認識されているようです。
なぜかはわかりませんが。。プロパティの内容は同じようです。

とりあえずの対応として、canaryでも
document.createElement('img')なら、大丈夫だったので
まずはそちらで様子を見ておくと良いかもしれません。

#ちょっと触っただけの返答で申し訳ないです



2013年4月2日 12:14 yamaji <yamayam...@gmail.com>:

> --
> --
> このメールは Google グループのグループ「Chrome API Developers JP」の登録者に送られています。
> このグループに投稿するには、chrome-api-d...@googlegroups.com にメールを送信してください。
> このグループから退会するには、chrome-api-develop...@googlegroups.com
> にメールを送信してください。
> 詳細については、http://groups.google.com/group/chrome-api-developers-jp?hl=ja
> からこのグループにアクセスしてください。
>
> ---
> このメールは Google グループのグループ「Chrome API Developers JP」の登録者に送られています。
> このグループから退会し、メールの受信を停止するには、chrome-api-develop...@googlegroups.com
> にメールを送信します。
> その他のオプションについては、https://groups.google.com/groups/opt_out にアクセスしてください。
>
>



--
Toru Yoshikawa
mail: pikotea[at]gmail.com
twitter: yoshikawa_t
blog: http://d.hatena.ne.jp/pikotea/

[yamaji]

吉川さん

yamajiです。

早速のご回答、ありがとうございます。

document.createElement('img')に書きかえると

正常に動くようになりましたので、これで様子を見てみます。

すぐ動くようになる対応策を教えて頂けてたすかりました！

2013年4月2日火曜日 13時10分30秒 UTC+9 Toru Yoshikawa:

> このグループに投稿するには、chrome-api-develo...@googlegroups.com にメールを送信してください。
> このグループから退会するには、chrome-api-developers-jp+unsubscribe@googlegroups.com

> にメールを送信してください。
> 詳細については、http://groups.google.com/group/chrome-api-developers-jp?hl=ja
> からこのグループにアクセスしてください。
>
> ---
> このメールは Google グループのグループ「Chrome API Developers JP」の登録者に送られています。

> このグループから退会し、メールの受信を停止するには、chrome-api-developers-jp+unsub...@googlegroups.com