เพราะดวงตาไม่โกหก - การทดสอบด้วยสายตาโดยใช้ Applitools Eyes

เผยแพร่แล้ว: 2021-08-17

การทดสอบการถดถอยช่วยให้แน่ใจว่าการเปลี่ยนแปลงใดๆ ที่เกิดขึ้นกับซอฟต์แวร์จะไม่ทำลายสิ่งใดๆ ที่เคยทำงานได้ดีมาก่อน การทดสอบการถดถอยด้วยภาพช่วยให้แน่ใจว่าปัญหา GUI จะไม่ถูกครอบตัดเนื่องจากการเปลี่ยนแปลงที่เกิดขึ้น แอปพลิเคชันควรยังคงมีลักษณะเหมือนที่เคยก่อนที่จะทำการปรับเปลี่ยน เครื่องมือทดสอบการถดถอยด้วยภาพจะจับภาพหน้าจอของ UI ปัจจุบันและเปรียบเทียบกับภาพหน้าจอดั้งเดิม โดยจะตรวจสอบขั้วในอดีตและยืนยันว่าหน้าเว็บยังคงแสดงผลตามที่คาดไว้ในเบราว์เซอร์ต่างๆ แม้จะแก้ไขแล้วก็ตาม Applitools Eyes เป็นหนึ่งในเครื่องมือทดสอบด้วยภาพที่ได้รับความนิยมมากที่สุดในตลาด ซึ่งขับเคลื่อนโดยเทคโนโลยีการมองเห็นที่เป็นเอกสิทธิ์เฉพาะของบริษัท

Applitools ได้พัฒนาเครื่องมือทดสอบซอฟต์แวร์บนคลาวด์ Applitools Eyes ซึ่งจะตรวจสอบลักษณะภาพทั้งหมดของเว็บ มือถือ และแอพที่มาพร้อมเครื่องโดยอัตโนมัติ การตรวจสอบเหล่านี้คล้ายกับการตรวจสอบด้วยตนเอง เทคโนโลยี Applitools จะตรวจสอบความถูกต้องของเลย์เอาต์ เนื้อหา และลักษณะที่ปรากฏของ UI โดยอัตโนมัติ และช่วยให้คุณทำการทดสอบแบบอัตโนมัติที่สามารถทำได้ด้วยตนเองเท่านั้นโดยไม่ต้องใช้ มันสามารถทดสอบแอพบนเบราว์เซอร์ อุปกรณ์ ระบบปฏิบัติการ และภาษาการเขียนโปรแกรมใดๆ ที่กำหนด บนความละเอียดหน้าจอและฟอร์มแฟกเตอร์ใดก็ได้

ภาพรวมของ Applitools Eyes System

สภาพแวดล้อมการทดสอบต่างๆ โต้ตอบกับส่วนประกอบ Eyes ต่างๆ ของ Applitools เพื่อใช้การทดสอบ UI แบบเห็นภาพ ระบบประกอบด้วยส่วนประกอบต่อไปนี้:

แอปพลิเคชันภายใต้การทดสอบ (AUT)
ชุดทดสอบที่ทำงานสำหรับ AUT และยืนยันความถูกต้อง
มีการเรียก SDK ในรหัสชุดทดสอบเพื่อทริกเกอร์การจับภาพหน้าจอและการตรวจสอบภาพ
Application Drivers เช่น Selenium หรือ Appium ซึ่งมีกรอบงานในการสร้างชุดทดสอบที่สามารถส่งไปยัง AUT ได้ นอกจากนี้ยังใช้สิ่งเหล่านี้เพื่อจับภาพหน้าจอ
เซิร์ฟเวอร์รับและจัดเก็บภาพหน้าจอที่ส่งจาก SDK โดยจะเปรียบเทียบกับรูปภาพพื้นฐานที่จัดเก็บไว้และรายงานความแตกต่างใดๆ
Eyes Test Manager มอบผลการทดสอบแก่ผู้ใช้ที่สามารถตรวจสอบและช่วยเหลือผู้ใช้ในการรายงานจุดบกพร่องและจัดการภาพพื้นฐาน

ด้านล่างนี้คือตัวอย่างวิธีที่ส่วนประกอบโต้ตอบเพื่อทำการทดสอบ ทำให้ทีมทดสอบสามารถดูและจัดการผลการทดสอบได้

เครดิต : Applitools

ขั้นตอนที่ 1: ทีมทดสอบดำเนินการชุดทดสอบ รหัสมักจะทำซ้ำขั้นตอนต่อไปนี้สำหรับสถานะแอปพลิเคชันต่างๆ

ขั้นตอนที่ 2.1: การใช้ไดรเวอร์ เช่น Selenium หรือ Appium การกระทำของผู้ใช้ เช่น การคลิกเมาส์ การป้อนข้อมูลด้วยแป้นพิมพ์ ฯลฯ จะถูกจำลอง

ขั้นตอนที่ 2.2: นอกจากนี้ Eyes SDK API ยังถูกเรียกให้ดำเนินการตรวจสอบด้วยภาพพร้อมกัน

ขั้นตอนที่ 2.2.a: Eyes SDK ใช้ไดรเวอร์เพื่อรวบรวมภาพหน้าจอ

ขั้นตอนที่ 2.2.b: หลังจากนั้น Eyes SDK จะส่งภาพที่รวบรวมไปยัง Eyes Server ที่นี่ รูปภาพและรูปภาพจุดตรวจอื่นๆ จะถูกเปรียบเทียบกับรูปภาพพื้นฐานที่จัดเก็บไว้ก่อนหน้านี้บนเซิร์ฟเวอร์

ขั้นตอนที่ 3: เมื่อภาพในการทดสอบได้รับการประมวลผลแล้ว Eyes Server จะให้ข้อมูลเกี่ยวกับความแตกต่างที่สังเกตได้ นอกจากนี้ยังมีลิงก์ไปยังไซต์ Eyes ซึ่งสามารถดูผลลัพธ์ได้

ขั้นตอนที่ 4: ทีมทดสอบใช้ Eyes Test Manager เพื่อดูผลการทดสอบ อัปเดตข้อมูลพื้นฐาน รายงานจุดบกพร่อง และอธิบายพื้นที่ที่ต้องการการจัดการพิเศษ หลังจากดูผลลัพธ์ทั้งหมดแล้ว ทีมทดสอบจะบันทึกการตรวจวัดพื้นฐาน สิ่งนี้จะกลายเป็นพื้นฐานสำหรับการเปรียบเทียบในการทดสอบครั้งต่อไป

Applitools มี SDK ที่สนับสนุนเฟรมเวิร์กการทดสอบอัตโนมัติบนเว็บ มือถือและเดสก์ท็อป โครงสร้างพื้นฐานโปรแกรมควบคุมแอปพลิเคชันต่างๆ ภาษาโปรแกรม และแพลตฟอร์มทั่วไป เบราว์เซอร์ และระบบปฏิบัติการทั้งหมด SDK เหล่านี้ไม่ได้โต้ตอบโดยตรงกับ AUT ดังนั้น Eyes จึงไม่ขึ้นกับวิธีการใช้งานและปรับใช้แอปพลิเคชันโดยสิ้นเชิง

ความเข้ากันได้ของ Applitools Eyes

Applitools มี SDK สำหรับภาษาการเขียนโปรแกรมยอดนิยมทั้งหมดและตัวดำเนินการทดสอบซึ่งครอบคลุมการทดสอบอย่างเต็มรูปแบบสำหรับเว็บ, มือถือ, เดสก์ท็อป, PDF, OS ของทีวี, IoT, รูปภาพ และอื่นๆ

เว็บ SDK

WEB SDK รองรับเครื่องมือและโปรแกรมทดสอบเว็บที่สำคัญทั้งหมด:

ซีลีเนียมสำหรับ -Java, JavaScript, C#, Ruby, PHP, Python
WebdriverIO4, WebdriverIO5, WebdriverIO6
ซีลีเนียม IDE
ไซเปรส
นักเขียนบทละคร (เพิ่มใหม่)
เชิดหุ่น (เพิ่มใหม่)
TestCafe
Storybook CSF React (เพิ่มใหม่), Storybook -React, Angular, Vue
วาทีร์
Capybara
ไม้โปรแทรกเตอร์ (เพิ่มใหม่)
UFT/QTP
Lean CFT#, Lean JavaScript
รหัส UI

SDK มือถือ

Mobile SDK รองรับเครื่องมือและโปรแกรมทดสอบมือถือที่สำคัญทั้งหมด:

Appium Native –C#, Java, JavaScript, PHP, Python, Ruby
Appium Web - C#, Java, JavaScript, PHP, Python, Ruby
วัตถุประสงค์ XCUI-C, XCUI Swift
เอสเพรสโซ
น้ำเต้า iOS และ Android

ภาพหน้าจอ SDK

CLI, C#, Java, JavaScript, PHP, Ruby, XCTest Objective-C, XCTest Swift

Desktop SDKs

Windows UFT, Windows Coded UI

เครื่องมือไร้รหัส

แบบฟอร์ม PDF, Codeless IDE

ตัวจัดการการทดสอบใน Applitools Eyes

Eyes Test Manager เป็นเครื่องมือบนเบราว์เซอร์ที่ให้การเข้าถึงข้อมูลการทดสอบ UI แบบภาพ ช่วยให้ผู้ใช้สามารถจัดการผลการทดสอบ เส้นฐาน และข้อมูลเมตาอื่นๆ

Eyes Test Manager มีสิ่งอำนวยความสะดวกดังต่อไปนี้:

เข้าถึงผลลัพธ์ของการทดสอบ UI แบบภาพ
ยอมรับหรือปฏิเสธความแตกต่างที่บันทึกไว้
ใส่คำอธิบายประกอบขั้นตอนด้วยความคิดเห็น
เพิ่มระดับการแข่งขันและละเว้นภูมิภาค
อัพเดทข้อมูลพื้นฐาน
ดูและจัดการแอปพลิเคชันและชื่อการทดสอบ
ดูและจัดการเส้นฐานและสาขา
ดูและจัดการสภาพแวดล้อมการดำเนินการ
เปรียบเทียบและรวมสาขาพื้นฐาน
จัดการบัญชี ทีม และผู้ใช้ของคุณ

มีเครื่องมือและแนวคิดอื่นๆ มากมายที่รวมอยู่ใน Eyes ซึ่งช่วยให้ผู้ใช้สามารถจัดระเบียบกรณีทดสอบและทดสอบได้ หนึ่งในเครื่องมือดังกล่าวคือพื้นฐาน โปรโตคอลการตรวจสอบด้วยภาพจะเปรียบเทียบภาพที่ถ่ายกับภาพที่บันทึกไว้ในบรรทัดฐานจากการทดสอบครั้งก่อน การทดสอบแต่ละครั้งอาจมีรูปลักษณ์ที่แตกต่างกัน Eyes มีเส้นพื้นฐานหลายเส้นต่อการทดสอบ โดยที่เส้นพื้นฐานแต่ละเส้นแสดงถึงสภาพแวดล้อมที่เลือก ข้อมูลพื้นฐานแต่ละรายการเหล่านี้สามารถจัดเก็บชุดข้อมูลอ้างอิงรูปภาพได้

เมื่อทำการทดสอบด้วยภาพ แอปพลิเคชันจะถูกขับเคลื่อนโดยลำดับของสถานะของแอปพลิเคชัน และสำหรับแต่ละสถานะจะมีการดำเนินการจุดตรวจสอบ ซึ่งจะจับภาพของแอปพลิเคชันสำหรับสถานะนั้น ตาเปรียบเทียบชุดของภาพที่ถ่ายกับชุดของภาพอ้างอิงที่จัดเก็บไว้ในเส้นฐานของการทดสอบนั้นและรายงานความแตกต่างที่มีนัยสำคัญ รูปภาพที่อยู่ภายในเส้นฐานขึ้นอยู่กับการทดสอบการทำงาน แต่ก็อาจขึ้นอยู่กับปัจจัยอื่นๆ เช่น ระบบปฏิบัติการ ประเภทของเบราว์เซอร์ และขนาดวิวพอร์ต ปัจจัยเหล่านี้เรียกว่าสภาพแวดล้อมการดำเนินการ

วิวพอร์ตคือพื้นที่แสดงภาพของแอปพลิเคชันใดๆ ภายในหน้าต่างแอปพลิเคชัน ขนาดของวิวพอร์ตยังส่งผลต่อเลย์เอาต์ของหน้าใดก็ได้ ตัวอย่างเช่น การเปลี่ยนขนาดของเบราว์เซอร์อาจเปลี่ยนลักษณะที่ปรากฏของข้อความที่แสดง หน้าที่ปรับเปลี่ยนตามอุปกรณ์ซึ่งมีองค์ประกอบ เช่น เมนู อาจปรากฏแตกต่างกันในมิติข้อมูลที่แตกต่างกัน แบบอักษรและขนาดภาพอาจเปลี่ยนแปลงได้ หมายเหตุ: วิวพอร์ตเป็นแบบเฉพาะของแพลตฟอร์ม