feature-image-android-ios-inspector
feature-image-android-ios-inspector

และแล้ววันนี้ก็มาถึง วันที่จะได้เล่นกับ Native Selector ของ Android และ IOS การมาถึงขั้นนี้ หรือใครอ่านอันนี้ มันเหมือนกับระดับ Advance มากกว่าการทํา Automate บน Web มากๆๆเลย เพราะการทํา Automateบนเว็ปมันไม่ได้มีเงื่อนไขหรือความซับซ้อนมากเท่าการทําบน devices ทั่วไปอย่างนี้ บนเว็ปอย่ามากก็ใช้ css selector เล่นกับ element มากหน่อยก็เขียน Library เข้าไปเพิ่ม เพื่อควบคุมอะไรหลายๆอย่างเบื้องหลัง

แต่ทาง devices เนี่ยมันมีหลายอย่างที่มีความแตกต่าง ไม่ว่าจะมีการเข้ามายุ่งกับ Network ของ devices, มายุ่งกับ OS หรือ push/pull file มันมีไรซับซ้อนอีกเยอะแยะไปหมด เหมือนเป็นขั้น advance เลยก็ว่าได้ ที่นี้เรามาเริ่มต้นกับการเขียน automate บน device ก่อน ด้วยอะไรที่เป็นพื้นฐานสุดๆๆๆเลย นั่นก็คือ Inspect Locator

Locator มีกี่แบบน่ะ?

Locator มันมีเยอะแยะมากมายไปหมดเลย แต่หลักๆที่ใช้ก็จะไม่พ้น พวกนี้ในการ locate element ต่างๆ

  1. ID/Name/Attribute
  2. CSS (Web/Hybrid App)
  3. Xpath
  4. OS API

แล้วจะทําการ Inspect ยังไง?

ข้อ 1-3 ส่วนใหญ่เราใช้ chrome-dev-tools ในการหาได้ง่ายๆ สําหรับ webview/hybrid app

chrome-dev-tools-example
chrome-dev-tools-example

แต่ถ้าข้อ 4 เนี่ย มันจะมี tools เฉพาะของมันเพื่อจัดการเลยล่ะ

  • iOS
    appium-inspector
    appium-inspector

    appium inspector มันจะช่วยเราบอกรายละเอียดได้ดีทีเดียวเมื่อเราหา locator บน iOS

  • android
    uiautomatorviewer-example
    uiautomatorviewer-example

    ถ้าเป็นส่วนของ android เนี่ยเราสามารถใช้ได้ทั้ง appium inspector และ uiautomatorviewer ได้ มันจะบอกรายละเอียดของ element ที่อยู่บนหน้านั้นๆอย่างสบายๆเลย (ส่วนใหญ่จะอยู่ที่ C:\Users\<<username>>\AppData\Local\Android\sdk\tools – A.K.A %ANDROID_HOME%\tools )

แต่กฎข้อสําคัญเลยในการใช้ locator สําหรับ devices เนี่ยคือ

ID > OS API (Native) > CSS (HYBRID) > XPATH

แต่ถ้าสําหรับ web ก็จะคล้ายๆกันน่ะ เป็น

ID > NAme > CSS > XPATH

ในบทความนี้ก็จะขอไม่พูดถึงเรื่องเก่าๆเนอะ เรามาสนใจเรื่องของ Native Selector หรือ OS API กันดีกว่า เพราะเคยเขียนเรื่องของ inspect ด้วย chromedevtools กับ css selector technique แล้ววววววว ลองหาอ่านดูน่ะ 🙂 ส่วน tools ของ appium กับ uiautomatorviewer เข้าไปกดเล่นๆตาม path จะเข้าใจง่ายกว่าอ่านน่ะ

งั้นเข้าเรื่องของ OS API (Native)

เจ้า OS API แบ่งได้เป็น 2 ตัวก็คือพวกนี้

การใช้งานของมันก็จริงๆก็คล้ายๆกันแหละ แต่จะแยกออกเป็นตัวๆดีกว่า

UIAutomator

เป็นตัวเฉพาะของ Android เค้าเลยล่ะ การทํางานก็จะทํางานควบกับ inspector ที่ชื่อ uiautomatorviewer หรือ appium inspector ดังตัวอย่างที่ให้ดูข้างบนน่ะ เพื่อใช้ locate element ลูกเล่นหลากหลายมาก

แต่ที่คนนิยมใช้กันก็จะเป็นเรื่องของ text มัน match กับคําที่เราค้นหาไหมนั้นเอง ตาม api ข้างล่างเลย

example-uiselector-android
example-uiselector-android

ที่นี้วิธีใช้งานไม่ยากเลย เราแค่ประกาศ Object ของ class UiSelector ขึ้นมาแล้วก็เรียก Method ใช้ง่ายๆแค่นั้น เช่น

android=new UiSelector().text(‘Name’)

แค่นี้เลย ง่ายไหมล่ะ 🙂 สิ่งที่มันจะทําก็คือมันจะหา element ที่มี text คือ Name นั้นเอง (android= หมายถึงไปใส่เป็น locator ให้ appium)

ยังมีเทคนิคอีกหลากหลายอย่างเช่น

android=new UISelector().clickable().textMatches(“&dictionary[key]”)

ถ้าคำสั่งข้างบนจะหมายถึง ให้ UISelector หา element ที่ click ได้และมี text ที่ตรงกับใน dictionary ที่เราเตรียมไว้ (สังเกตุว่าเราจะ chain command ไปได้เรื่อยๆเลย)

มีแบบ array ด้วยนะ เช่น

android=new UISelector().clickable().textMatches(“&dictionary[key]”).instance(2)

สมมุติว่ามี element ที่ match ทั้งหมด แล้วเลือกตัวที่ 2นั้นเอง

แล้วพวกนี้เราก็ get text มาเทียบกัน ชิวๆ

ส่วน method อื่นๆก็หาอ่านเอาจากใน API หลักของมันน่ะ (ถ้า element เป็น scrollable เราจะต้องใช้ API แยกน่ะ ก็คือตัวนี้ UiScrollable หลักการณ์เดียวกับ UiSelector แต่จะใช้เมื่อ element เป็น scrollable layout elements ใน android บรรดา layout ของมัน)

UIAutomation

ทีนี้มาดูเจ้าตัวแสบ UIAutomation ของ apple กัน เนื่องจากมันจะมีหลักการณ์ไม่เหมือน android และ version ของ iOS ก็มีผล

เจ้านี้ใช้ Native JS search strategy โดยใช้ Predicate เป็นตัวจัดการหา element นั้นๆ

ข้อมูลเพิ่มจาก readme มันเลย แบ่งกันที่ iOS 9.3 และ ตํ่ากว่า กับ  iOS10 จะใช้คนละวิธีล่ะ ต้องใช้ argument คนละตัวตอน parse ให้ appiumด้วย -ios uiautomation (9.3) กับ -ios predicate string (10)

โดยหน้าตาจะออกมาแนวนี้

ios=.buttons().firstWithPredicate(“name=mart”)

ios=.buttons().withName(“Mart”)

แต่เนื่องจาก UIAutomation ตอนนี้มันเปลี่ยนไปเยอะแล้ว Document ของมันก็ดันถูกลบออกไปจากสารบอีก ดังนั้นเลยต้องหาอ่านจาก archive.org ที่นี้เอา ซึ่งก็พอจะมีครบครันอยู่ใช้ได้ที่เดียว

สรุปสั้นๆ

สรุปแล้วคนที่เคยทํา Web Automate มา รับรองว่ามาเจอบน device น่ะมีงงแน่ๆ มันเหมือนการ Up level แต่จําไว้เลยว่ามันไม่มีไรยากเกินไป เพียงแค่รู้จัก locator 2 ตัวนี้ UIAutomator กับ UIAutomation เราก็จะสามารถเริ่มหา Locator เพื่อไปใช้กับ keyword ของ appium ได้แล้ว 🙂

Leave a Reply

avatar

This site uses Akismet to reduce spam. Learn how your comment data is processed.