Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Feature SpecにVisual Regression Testいれてみる
Search
Dueno
September 23, 2016
Technology
0
380
Feature SpecにVisual Regression Testいれてみる
Dueno
September 23, 2016
Tweet
Share
More Decks by Dueno
See All by Dueno
Rails,Feature specにViewの回帰テストを入れる
anochick
0
1.7k
継続的セキュリティテストを導入したい気持ち
anochick
0
1.5k
Other Decks in Technology
See All in Technology
Mambaで物体検出 完全に理解した
shirarei24
2
210
Amazon Q Developerを活用したアーキテクチャのリファクタリング
k1nakayama
2
170
帳票構造化タスクにおけるLLMファインチューニングの性能評価
yosukeyoshida
1
230
Nx × AI によるモノレポ活用 〜コードジェネレーター編〜
puku0x
0
330
Vision Language Modelと自動運転AIの最前線_20250730
yuyamaguchi
3
1.1k
【CEDEC2025】大規模言語モデルを活用したゲーム内会話パートのスクリプト作成支援への取り組み
cygames
PRO
2
760
オブザーバビリティプラットフォーム開発におけるオブザーバビリティとの向き合い / Hatena Engineer Seminar #34 オブザーバビリティの実現と運用編
arthur1
0
340
生成AI導入の効果を最大化する データ活用戦略
ham0215
0
100
マルチモーダル基盤モデルに基づく動画と音の解析技術
lycorptech_jp
PRO
4
490
2時間で300+テーブルをデータ基盤に連携するためのAI活用 / FukuokaDataEngineer
sansan_randd
0
120
【CEDEC2025】現場を理解して実現!ゲーム開発を効率化するWebサービスの開発と、利用促進のための継続的な改善
cygames
PRO
0
720
Rubyの国のPerlMonger
anatofuz
3
720
Featured
See All Featured
Git: the NoSQL Database
bkeepers
PRO
431
65k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.8k
Code Reviewing Like a Champion
maltzj
524
40k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
What's in a price? How to price your products and services
michaelherold
246
12k
The Power of CSS Pseudo Elements
geoffreycrofte
77
5.9k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Into the Great Unknown - MozCon
thekraken
40
2k
[RailsConf 2023] Rails as a piece of cake
palkan
56
5.7k
Stop Working from a Prison Cell
hatefulcrawdad
271
21k
Being A Developer After 40
akosma
90
590k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
33
2.4k
Transcript
Feature specに Visual Regression Test いれてみる 表参道.rb #14 2016/08/04
自己紹介 • Dueno @anoChick • 株式会社 Speee 新卒3年目 中途 •
Webマーケティング事業部 • 主な開発プロダクト↓ Webマーケティング総合支援プラットフォーム サイト内のテキスト・キーワード分析 メトリクス分析
本題
E2Eテスト • エンドトゥエンドテスト、統合テストとも呼ばれる • システム全体が正しく動作するかを確認するテスト • テストシナリオを用意して、ユーザの利用と同じ動作が実 際に行われるかをブラウザの自動操作で検証する 例) ログインのテスト
そこに Regression Testを 差し込む
Regression Test • 回帰テスト、退行テストとも呼ばれる • 機能追加・修正によりコードを書き換えた際、想定しない範 囲にまで影響が及んでないかを確認するテスト • 今回は一般的な自動テストでは対応が難しいUIに関する Regression
Testを扱う(Visual Regression Testing)
作る
できた
つかいかた 1.Feature spec 内 upload_evidence_image(‘identifier’) と書く。 [bucket名]/[branch名]/[ビルド番号]/screenshot/[identifier].png でscreenshotが吐かれる(AWS
S3)
つかいかた 2.前ビルドのscreenshotとの差分をとる Mean error per pixel : ピクセルあたりの平均誤差
Normalized mean erro : 正規平均誤差 Nomalized maximum error : 最大誤差 ↑数値ででる 全部S3に吐かれる
レポート出力 するぞ
レポート出力・描画 静的htmlコンテンツとしてS3に吐く GoogleWebComponents/google-chart が便利だった <link rel="import" href="google-chart.html"> でTemplateをimportして、
と記述するだけで グラフが描画されるの、すごい。
レポート例 いい感じにしたい
そのた • 異常値検出(anomaly detection)とか考えたけど運用でいま いちっぽくなりそう。 • 分散のしかた。分散テスト実行もそうだけど、差分計算と か、AWSLambdaでも出来そう。
ありがとうございました