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
Visual Testing: A Communication Problem
Search
Bas Broek
June 15, 2018
Programming
140
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Visual Testing: A Communication Problem
Bas Broek
June 15, 2018
More Decks by Bas Broek
See All by Bas Broek
Roasting Your App's Accessibility
basthomas
0
48
Building an Accessibility Culture, One Step at a Time (Leeds)
basthomas
0
140
Building an Accessibility Culture, One Step at a Time
basthomas
1
120
Building a modern subscription experience on iOS
basthomas
0
220
Not an afterthought: accessibility from start to finish
basthomas
0
170
Accessibility on Apple Platforms: Beyond VoiceOver
basthomas
0
190
No Touch(screen) Required: Voice & Keyboard Accessibility
basthomas
0
190
Dancing with Dinosaurs: Objective-C and Swift Interop
basthomas
0
190
Effective Pull Request Reviews
basthomas
0
450
Other Decks in Programming
See All in Programming
Vite+ Unified Toolchain for the Web
naokihaba
0
690
「AIで開発し、AIを届ける」をEvalでつなぐ 〜AIネイティブに始めるプロダクト開発の実践〜 / Connecting "Develop with AI, deliver AI" with Eval
rkaga
4
5.7k
Dataformのリポジトリを立ち上げるときにまずやること / dataform-day0-2026
snhryt
0
210
AIエージェントで 変わるAndroid開発環境
takahirom
1
450
そのテスト、説明できますか?~LWテスト戦略FW~のご紹介
nakahara
0
200
act1-costs.pdf
sumedhbala
0
170
【やさしく解説 設計編 #0】DDDのコード、読めるのに分からない人へ
panda728
PRO
1
230
過去最大のMCPアップデート! 2026-07-28 RC版の謎に迫る
licux
6
450
ECSアプリログをFireLensでコスト削減しようとしたけど諦めた話 in Fargate×Node.js
akihisaikeda
2
4.2k
「正の参照」と 「負の導出」で組む ハーネスエンジニアリング
cottpan
1
120
Contextとはなにか
chiroruxx
1
390
AIキャラアプリkaiwaの低遅延音声通話基盤をどう作ったか - AWS Gravitonで支える低遅延・低コストAI Agent基盤
mogamit
0
160
Featured
See All Featured
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.2k
KATA
mclloyd
PRO
35
15k
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
2
4.1k
Writing Fast Ruby
sferik
630
63k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.9k
Producing Creativity
orderedlist
PRO
348
40k
How to Build an AI Search Optimization Roadmap - Criteria and Steps to Take #SEOIRL
aleyda
1
2.1k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
katarinadahlin
PRO
1
3.7k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
123
22k
Everyday Curiosity
cassininazir
0
250
Automating Front-end Workflow
addyosmani
1370
210k
Transcript
VISUAL TESTING A COMMUNICATION PROBLEM 1 — @basthomas
COMMUNICATION IS HARD 2 — @basthomas
SNAPSHOT TESTING 3 — @basthomas
func testViewWithSecondaryInteraction() { let viewUnderTest = InteractionBarView() let primaryInteractions: [Interaction]
= [.recommend, .comment, .like] let secondaryInteractions: [Interaction] = [.report] viewUnderTest.setup( withInteractions: primaryInteractions, secondaryInteractions: secondaryInteractions ) validateSnapshots(forView: viewUnderTest) } 4 — @basthomas
func testViewWithSecondaryInteraction() { let viewUnderTest = InteractionBarView() let primaryInteractions: [Interaction]
= [.recommend, .comment, .like] let secondaryInteractions: [Interaction] = [.report] viewUnderTest.setup( withInteractions: primaryInteractions, secondaryInteractions: secondaryInteractions ) validateSnapshots(forView: viewUnderTest) } 5 — @basthomas
func testViewWithSecondaryInteraction() { let viewUnderTest = InteractionBarView() let primaryInteractions: [Interaction]
= [.recommend, .comment, .like] let secondaryInteractions: [Interaction] = [.report] viewUnderTest.setup( withInteractions: primaryInteractions, secondaryInteractions: secondaryInteractions ) validateSnapshots(forView: viewUnderTest) } 6 — @basthomas
func testViewWithSecondaryInteraction() { let viewUnderTest = InteractionBarView() let primaryInteractions: [Interaction]
= [.recommend, .comment, .like] let secondaryInteractions: [Interaction] = [.report] viewUnderTest.setup( withInteractions: primaryInteractions, secondaryInteractions: secondaryInteractions ) validateSnapshots(forView: viewUnderTest) } 7 — @basthomas
func testViewWithSecondaryInteraction() { let viewUnderTest = InteractionBarView() let primaryInteractions: [Interaction]
= [.recommend, .comment, .like] let secondaryInteractions: [Interaction] = [.report] viewUnderTest.setup( withInteractions: primaryInteractions, secondaryInteractions: secondaryInteractions ) validateSnapshots(forView: viewUnderTest) } 8 — @basthomas
func testViewWithSecondaryInteraction() { let viewUnderTest = InteractionBarView() let primaryInteractions: [Interaction]
= [.recommend, .comment, .like] let secondaryInteractions: [Interaction] = [.report] viewUnderTest.setup( withInteractions: primaryInteractions, secondaryInteractions: secondaryInteractions ) validateSnapshots(forView: viewUnderTest) } 9 — @basthomas
10 — @basthomas
WHAT IF THE DESIGN CHANGES? 11 — @basthomas
WHAT IF ONE OF THE PRIMARY INTERACTIONS CHANGES? 12 —
@basthomas
! 13 — @basthomas
IT IS EASY TO MAKE A MISTAKE 14 — @basthomas
NAMING IS HARD 15 — @basthomas
NAMING IS HARD > testCellWithPageControlOnPage2of3 > testCellWithLongNameAndJob > testWithShortContent >
testTwoBirthdaysUnseenElement > testStateLoadMoreFailedInsertedOnTop > testSlideupViewWithNoIconNoButton 16 — @basthomas
DO YOU HAVE ANY IDEA WHAT IT IS WE'RE TESTING
HERE? 17 — @basthomas
... MAYBE? 18 — @basthomas
DO YOU HAVE ANY IDEA WHEN THESE TESTS ARE EXPECTEDLY
FAILING? 19 — @basthomas
ME NEITHER 20 — @basthomas
A FAILING SNAPSHOT TEST 21 — @basthomas
22 — @basthomas
testCellWithPageControlOnPage2of3 SO, IT SHOULDN'T BE 23 — @basthomas
! 24 — @basthomas
REPLACEABLE BY UNIT TESTS 25 — @basthomas
SNAPSHOTS AT SCALE 26 — @basthomas
WE MADE IT HARDER ON OURSELVES FORK, WRAPPER, WRAPPER, WRAPPER
27 — @basthomas
DOCUMENT DECISIONS 28 — @basthomas
MULTIPLE SIMULATORS 29 — @basthomas
SPACE 30 — @basthomas
IDE UPDATES 31 — @basthomas
! 32 — @basthomas
!"!"!"!"! !"!"!"!"! !"!"!"!"! !"!"!"!"! !"!"!"!"! 33 — @basthomas
SNAPSHOTS ARE SUBJECTIVE 34 — @basthomas
IT IS NOT ALL BAD 35 — @basthomas
QUESTION THINGS > "but I just copied it" > "but
others are doing it" > "but I can't write a unit test here" > "but ..." 36 — @basthomas
HOW TO PREVENT THIS 37 — @basthomas
DOCUMENT 38 — @basthomas
DOCUMENT COMMUNICATE 39 — @basthomas
DOCUMENT COMMUNICATE QUESTION THINGS 40 — @basthomas
DOCUMENT COMMUNICATE QUESTION THINGS ITERATE 41 — @basthomas
THANKS! 42 — @basthomas