generated at
ScrapBubbleの開発動機
背景
ScrapScriptsという拡張機能の存在
リンク先や関連ページリストをリンクの直ぐ側にhoverしてくれる
ページをスクロールしなくてもリンク先の情報を得られる
リンクをクリックする必要もない
クリックすると今見ているページが消えてしまう
hoverなら(多少かぶるが)今見ているページとリンク先ページとを同時に見られる
とても便利に使っていたが、不満もあった
表示したリンク先テキストを選択できない
吹き出しをクリックすると消えるという仕様だった
選択しようとクリックしたとたんに消えてしまう
記法のパースが不完全
XSS対策されておらず、コードブロックに書いたHTMLがそのまま読み込まれてしまうなどの致命的なバグがあった
関連ページリストのリンク先ページを表示できない
関連ページに表示されたリンクの中身をみたいということがよくあったのだが、見れないのでいちいちクリックする必要があった
「リンク先の参考文献リストにあるリンクをクリック」などするのに手間がかかった
不満を解消するために、コードを改造することにした

実装
まだ当時は拡張機能もUserScriptもあまり良くわかっていなかった
ScrapScriptsの元コードを特定するところから始めた
どこにminify前のコードがあるのかもわかっていなかった
なんとかコードを見つけた後、JQueryを書き換えるしたりTypeScriptに書き換えたりしてみた
TypeScript化は途中で断念したが
UserScriptに貼り付けたところ、そのまま動かせた
/daiiz/関連ページを吹き出し表示するにUserScript版のscrapbox-card-bubbleがあったので、拡張機能にしなくとも動かせるということは予想していた
この頃からScrapbox上で開発するようになった

それから何やかんやあって(説明が雑)、ScrapBubbleができあがってきた

#2022-01-13 10:08:40