Webページを監視して表示崩れが起きていないか検出できるE2Eテストを実装しました | Recruit Tech Blog
お世話になります、フロントエンド担当をしている小原正大です。Webページの表示を監視して差異があった場合、どのページで表示の変化が起きているかを知ることが出来るプログラムを実装したのでそのことについて書こうと思います。 何につかったの？ 僕がフロントエンドを担当しているサービス『料理サプリ』で大規模なフロントエンドコードのリファクタリング行う際に表示テストを自動化するために作成しました。『料理サプリ』はPC・スマホ合わせて大体350-400ページの表示パターンが存在する比較的規模の大きいサイトです。全ページに影響を与えるような作業は大規模な回収となり、今回のリファクタリングでは表示テストの計画などの段取りが必要でした。従来の人手によるQAでは細かいバグを見過ごしたり時間がかかり効率が悪いので、可能な限り自動化しようと考え実装しました。 実装の概要 この監視のシステムは以下の２つ実装を組合わ
Rails開発を補助するGoogle Chrome機能拡張·RailsPanel MOONGIFT
RailsPanelはGoogle ChromeのインスペクタにRails用パネルを追加するソフトウェアです。 Ruby on Railsは開発速度を飛躍的に向上してくれますが、サーバサイドのログとWebブラウザでの表示を交互に確認するのは面倒に感じていました。そこで使ってみたいのがRailsPanelです。 Google Chrome機能拡張をインストールします。別途Rails側でのライブラリインストールも必要です。 サンプルです。インスペクタにRailsPanelが追加されています。 実行されたSQLも確認できます。 レンダリングに使われたファイルも確認できます。MacVimなどであればここからクリックして開けます。 設定です。TextMate、MacVimが対応に上がっています。 RailsPanelを使えば実行されたアクション、使われたテンプレート、実行されたSQLが一目で確認でき
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
