WebExtensions で Firefox Add-ons を公開してみました
あっついですね。。
前の記事からだいぶサボってました。。
ブログ記事にするようなことがなかったわけではないのですが、なぜだか間が空いてしまいました。
資格試験の勉強をしていたのですが、だんだん飽きてきてしまったので、そういえばブログだな〜っていうテンションで書いてます。
公開してから結構経ってしまったのですが、初めて WebExtensions に触れて公開したので、メモ書きします。
今年のはじめ、QAチームのエンジニアさんというポジションに配属したのですが、問い合わせ業務や改善作業や障害対応もいろいろ関連付けて仕事していたら、なんだか何でも屋さんになってしまっていて、結局僕はなんていう名前のポジションなんだろうって考えてまして、あえて言うなら最近流行りの SRE（ Site Reliability Engineering ）や CRE（ Customer Reliability Engineer ）かな〜って思ってたんですが、まぁそんな大それた感じでもないか〜って思ってました。
で、いろいろな作業をやるうちの一つに、内部脆弱性検査を実施するお仕事もありまして、 OWASP ZAP や BurpSuite を触っていたのですが、エンジニアが少ないQAチームメンバーでも効率的に脆弱性を検査できるツールで VAddy を使おうということになりました。
このツール、素晴らしく脆弱性を検査してくれます。アップデートが早いし、どんどん高機能になっているので、僕は今後もお世話になっていくことになるでしょう。
中の方が茅場町に来てくださったので、上役とお邪魔してきました。
ただ、自動テストを想定しているせいか、手動でのテストは割と手間がかかるかなぁという印象です。
自動テストは僕がやりたい領域のトップに入るのですが、残念ながら今、それに注力できる時間が少なく、そもそも、環境からじゃね？ってなっていまして、いろいろ遠回りするしかなくてなかなかテストスクリプトを書く段階まで至らず、でもその間にも脆弱性は検知したいので、どうしても手動によるテストや探索的テストに大きく頼らざるを得ません。
そういう時、以下のマニュアルに沿って手で進めるのですが、大量にクロールデータ（テストシナリオ）を作る作業で時間がかかってしまうなぁと感じました。
まぁ、とはいえ手順が多いとか、複雑とかではなく、やることは至って単純なのです。
上記はクロールデータを作成する手順でして、ブラウザのプロキシを設定して、 begin URL（開始） を叩いて、画面操作して、 commit URL（終了）を叩けば終わりです。
あとは僕が作ってくれたシナリオをスキャンするのに、ボタンポチポチするか、スクリプトでガーッとやるかなんですが、クロールデータを作成するのは、僕ではなかったりしました。テスト担当者や、 CS のメンバーにお願いしていたため、どうしてもどれのあとにこれをやって、でどうなってっていう説明が難しくてですね。
説明が難しくても、厚めにフォローしてたら解決できる範囲だったのでいいのですが、 begin URL を叩いたら、変なエラーがでたとか、うまく操作してるつもりだったんだけど、クロールデータができなかったとかありまして、そのときにでたエラーを1つ1つ解消するのに苦労しました。
なんでだろうな〜、って思っていたのですが、間違って begin URL を2回叩いていたとか、クロールデータ作成中に他のメンバーが begin URL を叩いてしまって、中断されてしまったとかでした。
複数メンバーで一気にクロールデータ作成を行っていたために起きていた問題と、そもそも操作ミスが原因で起きていた問題に切り分けられました。
前者は検証環境を増やすことで解消できたのですが、操作ミスは依然残ってしまっていて、どうしたらスムーズに進行してもらえるかな〜と考えていまして、その結果、 Add-ons を作ることにしました。
要するに、開始 URL と終了 URL を1回ずつ叩けばいいので、ブラウザの右端にアイコン作ってあげて、操作ミスを軽減したらいいのではないかと。
で、開始 URL を叩いたタイミングでテスト対象の URL を開いてあげたら更にいい感じになるのではと思ったので、それぐらいなら速攻できそうだなと思われました。
Easy VAddy Proxy Crawling – Firefox 向けアドオン
はじめ、 Chrome を想定して作っていたのですが、割と出来上がってきたタイミングで、あ、Chromeのプロキシってシステムのプロキシ利用するんだったってことに気づいて、あぁあぁぁぁ。。ってなりました。
確かにマニュアルにも近しいこと書いてるなぁ。なんかそういうのなかったっけって調べたんですが、 sudo で Chrome 叩いて、引数に Proxy を渡したら、どうやらいい感じに動いたんですが、いや、流石にちょっとPCを管理している感じの人に怒られそうだな、じゃぁ、そのままシステムのプロキシ使ってもいいんじゃない？って思ったんですが、あれ？ Slack... ってなったんで、やっぱ Firefox しかねぇって方向転換しました。
最近、 Firefox も WebExtensions になったみたいだし、書いたコードも流用できるでしょうと思ってたのですが、案外 Firefox の WebExtensions の作例が少なかったので、 MDN 読んでたら結構なボリュームだったんで、読むのに時間かけてしまいました。。。 ^^;
作りながら、うーん、このタイミングで Notification を出したいな〜とか、このタイミングのときは Icon を変えたくないなぁとか、 Option ページは bootstrap とか使ってそれなりのデザインにしたいなぁとか欲求がでてきまして、速攻とか言ってましたけど、 Add-ons を作ること自体が楽しくなってきてしまって2、3日かけてしまいました。。
まだ、ちょっと使いづらいし、例外ハンドリングが甘いのですが、僕たちがクロールデータを手動で作成するワークフローに合うように作れたと思います。
チームメンバーに使ってもらって、フィードバックを得たいですが、初めてブラウザのアドオン作ったので、いい勉強になりました！
