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
UI Test with Compose
Search
DavidKwon7
December 10, 2023
Programming
0
94
UI Test with Compose
UI Test with Compose
- 2023년 12월 10일 GDG Devfest 2023 SongDo
DavidKwon7
December 10, 2023
Tweet
Share
More Decks by DavidKwon7
See All by DavidKwon7
Relay_및_Compose를_사용하여_완전한_앱_빌드하기.pdf
davidkwon7
0
270
Flow 느껴보기
davidkwon7
1
82
WearOS 101
davidkwon7
0
13
Other Decks in Programming
See All in Programming
GitHub Actionsで泣かないためにやっておきたい設定 / Recommended GHA settings to avoid crying
pinkumohikan
3
560
敵対的ポイフル
futabato
0
120
ServerAction で Progressive Enhancement はどこまで頑張れるか? / progressive-enhancement-with-server-action
takefumiyoshii
6
390
冗長なエラーログを削減し、スタックトレースを手に入れる / Reducing Verbose Error Logs and Obtaining Stack Traces
upamune
0
980
新宿ダンジョンを可視化してみた
satoshi7190
3
370
Milestoner
bkuhlmann
1
410
『Railsオワコン』と言われる時代に、なぜブルーモ証券はRailsを選ぶのか
free_world21
1
350
Introducing Kotlin Multiplatform in an existing mobile app - Workshop Edition | AndroidMakers Paris
prof18
0
140
Compose-View Interop in Practice (mDevCamp 2024)
stewemetal
0
160
Git Rebase
bkuhlmann
11
1.6k
Try creating your own orderedmap
kazamori
1
170
Scalable Customer Journey Orchestration (CJO)
lewuathe
0
410
Featured
See All Featured
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
323
20k
Into the Great Unknown - MozCon
thekraken
14
1k
Optimizing for Happiness
mojombo
370
69k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
20
1.7k
Code Reviewing Like a Champion
maltzj
515
39k
The Brand Is Dead. Long Live the Brand.
mthomps
49
29k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
126
32k
How GitHub Uses GitHub to Build GitHub
holman
468
290k
Building a Scalable Design System with Sketch
lauravandoore
457
32k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
6
3.4k
Designing on Purpose - Digital PM Summit 2013
jponch
111
6.5k
Web development in the modern age
philhawksworth
203
10k
Transcript
UI Test with Compose Incheon/Songdo
What is the Purpose of this Session? UI Test ਗܻܳ
ঌҊ पઁ ۽ં ਊ
1. UI Testۆ - UI Test о ޖੋ ಝࠇפ. Incheon/Songdo
2. UI Test with XML - XML ӝ߈ UI Testܳ ೯פ. 3. UI Test with Compose - Compose ӝ߈ UI Testܳ ೯פ.
1. UI Test Incheon/Songdo
What is the Test? - য়ܨ ध߹ - ࢿמ ഛੋ
- ࢎਊ ਃҳࢎ೦ ഛੋ - উࢿ ಣо
Advantages and Disadvantages of Testing పझо হݶ স ୡ߈ࠗী ࢤࢿਸ
֫ੌ ࣻ णפ. Ӓۧ݅ दр զࣻ۾ ࢚ ޅೠ ী۞ ߊࢤ, ࠂೠ ٘ ١ਵ۽ ੋ೧ স ࣗਃ दрਸ ૐоೞѱ ؾפ. ܳ ٜয, ౠ ٘ܳ ࣻ೮חؘ ࢚ ޅೠ ٘ ীࢲ ী۞о ߊࢤೡ ࣻ णפ. ٸ పझо হ ݶ ܳ ഛੋೡ ࣻ হणפ. పझо হח ۽ં ҃ द ਬܻೞ݅, ղ ୋ হਸ ب۽ ו ۰. / Unit Testing
How to make good Test? - ാࣚ ഛೠ х -
ࣁࠗ ҳഅ ࢎ೦ী ة݀ - ੜ ࢸݺغח पಁ - ೧ೡ ࣻ ח పझ ٘ - औҊ ࡅܰѱ प೯
Test Case - ળ࠺ arrange : పझܳ ೯ೞӝ ਤ೧ ജ҃
ࢸ (ઓࢿ ࢸ, పझ ࢚ غח ېझ ੋझఢझܳ ৢ߄ܰѱ ࢸೞҊ ࢤࢿ ١) - प೯ act : పझ ੋ زਸ पઁ۽ ഐೞח ٘ܳ աఋմ. - ױ assert : పझ ੋ ز प೯غҊ աݶ पઁ۽ ৢ߄ܲ ੌ ߊࢤ೮ח ഛੋ೧ঠ ೠ. ৈӝীח ੌ߈ਵ۽ ߈ജч ࢚ೠ чҗ эѢա ੌࠗ ҃җ ࢚కо ࢚җ э ഛੋೞח স ನೣ.
Types of Tests - Unit Test - Integration Test -
UI Test
Types of Tests Unit Test - ٘ ઑпਸ ѨૐೞҊ
- ࡅܰѱ ࣻ೯ೞҊ - Ѻܻػ ߑधਵ۽ ܻೠ.
Types of Tests Integration Test - ױੌ ز ױਤܳ ѨૐೞҊ
- ࡅܰѱ ࣻ೯ೞҊ - ܲ పझ৬ ߹ب۽ ܻೠ. * ױਤపझী݅ ઓೞݶ दझమ ਵ۽ ੜ زೞח ഛन ࠛоמ.
Types of Tests UI Test (GUI Test) - ചݶ ղীࢲ
Action ઁ۽ زೞח ഛੋ. - ݽٚ زী ೧ ೞաೞա ࢚ࣁ ഛੋೞח Ѫ য۵. Ӓۧӝ ٸޙী ۞ೠ Actionী ೧ ٘۽ ۽ ਸ ֬ റী, ࣘਵ۽ ҙܻೞח Ѫ ӝਵ۽ח ݒ ಞܻೞ. - ୶оਵ۽ ࢚ ޅೠ UI ղীࢲ جߊ࢚ടীب оמೞ.
UI Test Espresso Robolectric Appium UI Automator
2. XML Incheon/Songdo
What is the XML? XML(Extensible Markup Language): ഛഋ ݃স যݴ
Android Studioীࢲ ചݶਸ Ӓܻחؘ ࢎਊػ.
What is the Espresso? Android ӝӝ ߂ ীޯۨఠীࢲ UI Test
೯ Espresso ӝࠄ ҳࢿ ਃࣗ - Espresso : onView() / onData()ܳ ాೠ ࠭৬ ࢚ഐਊਸ ਤೠ ੑ - ViewMatchers : അ view ҅க ҳઑ ղীࢲ పझೡ ࢚ ӝ - ViewActions : ࣻ೯ೡ ز - ViewAssertions : ࣻ೯ೠ ز ഛੋ https://developer.android.com/training/testing/espresso/basics?hl=ko
Espresso UI Test ࣽࢲ Find ೧ ஹನք ӝ Action ౠ
ӝמ ࣻ೯ Assert ౠ ӝמী ೠ Ѿҗ ഛੋ
Espresso UI Test Espresso UI test method ࣗѐ
https://developer.android.com/training/testing/espresso/cheat-sheet?hl=ko What is the Espresso?
View Matcher : ਗೞח view ӝ - withId - withText
- withContentDescription - … What is the Espresso?
View Action - click() - longClick() - scrollTo() - swipeRight()
What is the Espresso?
View Assertion - withText() - doesNotExist() - … What is
the Espresso?
Left Aligned Title
2. XML Incheon/Songdo - Button ߂ EditText UITest
Left Aligned Title
Left Aligned Title
Left Aligned Title
Left Aligned Title
Left Aligned Title
Left Aligned Title
Left Aligned Title
Left Aligned Title
What is the Test?
What is the Test?
Left Aligned Title
What is the Test?
3. Compose Incheon/Songdo
What is the Jetpack Compose? Jetpack Composeח ֎౭࠳ Android UIܳ
࠽٘ೞӝ ਤೠ ୭न بҳ ః. - ٘ хࣗ - ҙ - ࡅܲ ѐߊ җ - ъ۱ೠ ࢿמ
What is the Test?
XMLҗ Compose ର? - ݺ۸ഋ UI / ࢶഋ UI -
٘ ܻ࠙ - view id
What is the Test? Jetpack Composeীࢲח যڌѱ పझ ࢚ਸ ?
3. Compose Incheon/Songdo - Semantic
Semantic Semantic - UI ҅க ҳઑ৬ ࢚ഐਊפ. - दݔ౮ UI
ਃࣗী ܳ ࠗৈ - दݔ౮ ܻח UI ҅க ҳઑ৬ ೣԋ ࢤࢿغҊ UI ҅க ҳઑܳ ഋࢿ פ. Compose పझীࢲח दݔ౮ ܻۄח ҳઑܳ ࢎਊೞ ৈ ചݶীࢲ ਃࣗܳ ই ࣘࢿਸ ੍ਸ ࣻ णפ.
Semantic Semantic
Semantic Semantic
What is the Node? + ֢٘ח ޖ? ‘दݔ౮ о ח
UIܻ ݽٚ ֢٘ীח दݔ౮ ܻী ߽۳ ֢٘о णפ. दݔ౮ ܻ ֢٘ীח ࢚ ೞח ஹನ࠶ ܳ ׳ೞח ࣘࢿ ನೣغয णפ.’
Semantic ֢٘ח ޖ?
Semantic modifier.semantics
Semantic SemanticsPropertyReceiverਸ ࢎਊ೧ࢲ Semantic propertyܳ Custom೧ࢲ ࢎਊ оמ
Semantic Now In Android https://github.com/android/nowinandroid
Semantic tree visualization Scemantic ܻ दпച. - Layout Inspector بҳ
ࢎਊ - printToLog() ݫࢲ٘ ਊ.
Semantic tree visualization - Layout Inspector Menu - Tools -
Layout Inspectorਵ۽ Ӕ
Semantic tree visualization - Layout Inspector Semantic Tree ܳ ഛੋೡ
ࣻ হח ҃ - compose UI ҙ۲ ୭न ߡ ࢎਊ - Api > 29 https://stackoverflow.com/questions/75542760/compose-inspection-unavailable- could-not-determine-the-version-of-the-androidx
Semantic tree visualization - Layout Inspector https://developer.android.com/jetpack/compose/tooling/layout-inspector?hl=ko
Semantic tree visualization - printToLog() UI పझ ٘ ੑ۱
Semantic tree visualization - printToLog()
ܻ ߽ ߽غ ঋ ܻо ؼ ਃࣗ ֢٘ܳ ੌदெঠ ೠݶ
useUnMergedTreeܳ true۽ ࢸೞݶ ؾפ.
Left Aligned Title
Left Aligned Title
Semantic Error ߽ ػ ҃ী ഛೠ чਸ оҊ ঋח
҃ ઓ. ٸ modifier.semantics ߂ clearAndSetSemanticsܳ ࢎਊೞৈ ਵ۽ ࣘࢿਸ ࢸ҅ೞѢա ೡ ࣻ .
3. Compose Incheon/Songdo - Compose Basic UI Test
Compose UI Test Methods https://developer.android.com/jetpack/compose/testing-cheatsheet?hl=ko
Compose UI Test Methods https://developer.android.com/jetpack/compose/testing-cheatsheet?hl=ko
Finders - onNode - onNodeWithContentDescription - onNodeWithTag - onAllNodes https://developer.android.com/jetpack/compose/testing-cheatsheet?hl=ko
Compose UI Test Methods
Left Aligned Title
Compose UI Test Methods https://developer.android.com/jetpack/compose/testing-cheatsheet?hl=ko Matchers - hasScrollTo - has(No)ClickAction
- hasTestTag - …
Compose UI Test Methods Actions - performClick - performScrollTo -
performImeAction - … https://developer.android.com/jetpack/compose/testing-cheatsheet?hl=ko
Compose UI Test Methods Assertion - assert - assertExist -
assertIsSelected - assertIsEqualTo - … https://developer.android.com/jetpack/compose/testing-cheatsheet?hl=ko
Left Aligned Title
Compose UI Test Methods Debug - printToLog() - … https://developer.android.com/jetpack/compose/testing-cheatsheet?hl=ko
Left Aligned Title
Left Aligned Title
Left Aligned Title
Compose UI Test Compose Animation UI Test
Compose UI Test
3. Compose Incheon/Songdo - Compose Animation UI Test
Compose Animation UI Test - Composeܳ ࢎਊೣਵ۽ॄ, গפݫ࣌ పझо ೯ؼ
ٸ ࣗਃغח दрী ೧ ৮߷ೞ ѱ ઁযо оמפ. - ܳ ా೧ গפݫ࣌ ೯غח زউ р чী ೠ ഛੋ оמ೧פ.
Left Aligned Title autoAdvance = false ܳ ా೧ গפݫ࣌ दрਸ
ઁযೡ ࣻ णפ.
Left Aligned Title enabled = trueীࢲ গפݫ࣌ द advanceTimeBy ܳ
ࢎਊೞৈ ਗೞח दਵ۽ ز ࢚غח Ѿҗ৬ ࠺Ү ߂ ഛੋ
Left Aligned Title ٘
3. Compose Incheon/Songdo - Compose Navigation UI Test
Left Aligned Title
Left Aligned Title
Left Aligned Title
3. Compose Incheon/Songdo - Now In Android
Left Aligned Title
Left Aligned Title
ਃড Find - Action - Assert
QnA Incheon/Songdo
хࢎפ.