เชื่อว่าหลายๆคนที่ใช้งาน Selenium ในการค้นหา Element น่าจะเคยเจอปัญหาที่การแสดงผลต่างๆไม่สามารถตรวจจับได้ทัน หรือมีการเปลี่ยนแปลงที่ค่อนข้างรวดเร็วเช่น loading animation ในบางครั้งถ้าเว็บโหลดเร็วมากๆ อาจจะทำให้การตรวจสอบการแสดงหน้า loading เจอบ้างไม่เจอบ้าง ปัญหาคลาสสิกแบบนี้ เราสามารถแก้ได้ด้วยการเขียนเทสแบบ Asynchronous นั่นเอง
Asynchronous คืออะไร
ก่อนอื่นเลยเราต้องเข้าใจก่อนว่า เทสสคริปต์ที่เราเขียน ปกติจะเป็นแบบ Synchronous โดยจะเป็นการทำงานแบบเป็นลำดับต่อๆกัน จากstep 1 ไป 2 และ 3 ตามลำดับ เช่น step ในการ login หน้าเว็บไซท์ ก็จะเริ่มต้นด้วย
1. กรอก username
2. กรอก password
3. กด ปุ่ม login
4. ตรวจสอบว่า login สำเร็จ
หรือถ้าดู timeline กันทำงานแล้วก็จะได้ตามรูปแบบด้านล่างนี้
แล้วถ้าเป็น Asynchronous การทำงานจะไม่ได้เรียงตามลำดับ แต่จะเป็นการทำงานในส่วนที่ตรงตามเงื่อนไขก่อน
จะเห็นว่า Asynchronous จะทำงานโดยไม่มีการเรียงลำดับก่อนหลัง แต่ถ้ากลับไปที่ Flow การทดสอบการ login แล้วถ้าเราไปกดปุ่ม Login ก่อนจะกรอก username และ password แล้วล่ะก็ การทำงานคงไม่ถูกต้องอย่างที่เราต้องการ ผมแนะนำว่า Test step ที่เราทำก็ควรจะเขียนเป็นลำดับการทำงานที่ชัดเจน มากกว่าเพื่อผลลัพธ์ที่เราควบคุมได้ แล้วแบบนี้จะใช้งาน Asynchronous ในการเทสตอนไหน ล่ะ
การประยุกต์ใช้ Asynchronous กับการเทส
เราสามารถประยุต์ใช้งานการทำงานแบบ Asynchronous เป็นส่วนๆในการเทสเช่น
- การรอให้ข้อมูล load สำเร็บหลังจากกดปุ่มค้นหา ตัวอย่าง
- การรอให้ server response ข้อมูลก่อนทำงานขั้นตอนต่อไป
โดยใน Robot Framework Puppeteer Library จะมี Keyword Run Async Keywords เป็นตัวแปลงชุดคำสั่งให้กลายเป็น Asynchronous อัตโนมัติเช่น
Run Async Keywords
... Wait For New Window Open AND
... Click Element css=button[type="submit"]
เป็นการรอให้ window ใหม่เปิดหลังจากกดปุ่ม Submit button ไปแล้วนั่นเอง หรืออีกตัวอย่าง สำหรับการรอให้ Server response หลังจากที่ submit ข้อมูลใน Search form
Run Async Keywords
... Wait for response url /search_info.json 200 name.*?p1 AND
... Click Element id:search_ajax
ซี่งสุดท้ายเราจะได้ Test Script ที่ผสมผสานการทำงานแบบ Sync & Async เข้าโดยกันนั่นเอง
