2011年3月31日木曜日

jQuery.popeye 2.0.4 のバグ

昨日の記事でも触れた、jQuery.popeyeのバグについて書いておく。

いつ、どういう不具合が起こるのか先に述べよう。jQuery.popeyeはWebページ中でインラインで画像をオーバレイ表示できるJavascriptライブラリで、jQueryをベースにしている。動作はデモページを見てもらうと一目瞭然だと思う。不具合は、画像を拡大表示したとき、あるいは画像を拡大表示した状態でスライドショーを前後に移動させたときに、存在しないURLへのHTTP GETが2回発生する、というものである。

バグはpreloadNeighbours()関数にあった。以下にパッチを示す。

--- jquery.popeye-2.0.4.js.orig	2010-06-14 22:39:42.000000000 +0900
+++ jquery.popeye-2.0.4.js 2011-03-31 15:35:26.000000000 +0900
@@ -384,7 +384,7 @@
} else {
neighbour = 0;
}
- preloaderNext.src = a[i].href[neighbour];
+ preloaderNext.src = a[neighbour].href;

// previous image
neighbour = i;
@@ -393,7 +393,7 @@
} else {
neighbour--;
}
- preloaderPrev.src = a[i].href[neighbour];
+ preloaderPrev.src = a[neighbour].href;
}


配列aには、拡大したときに表示される画像へのリンク(a要素)が順次格納されている、と考えてもらって良い。a[i]が現在拡大表示されている画像(を表すa要素)である。jQuery.popeyeでは、現在拡大表示されている画像の前後の画像についてあらかじめHTTP GETを行って、ブラウザのキャッシュを利用して画像の表示を高速化するという処理を行っているように見える。

で、このバグである。a[i].hrefって、現在表示されている画像のURLであるので、a[i].href[neighbour]とは、URL(文字列)中の一文字を指してしまう。当然、配列aの添字を変更してあげないといけない。

まあ、404 Not FoundなHTTP GETリクエストが発生するだけだから、サーバのログでも見てないと気がつかないかもしれない、とも思うのだが、もし学生のプログラムだったら「もっとプログラムを勉強しなはれ!」と一蹴するレベルのバグだよなあ、これ。

ちなみに、jQuery.popeyeには難読化されたソースコードも含まれているので、パッチをあてる際には注意。ええ、両方読み込むようなHTMLを書いていたので、はまりました^^;