ปลดล็อก Automated Test ใน Chrome: เริ่มง่ายๆ ไม่ต้องโค้ด พร้อมต่อยอด Puppeteer

สวัสดีครับ

วันนี้ ผมจะมาแนะนำการทำ Automated ด้วย chrome แบบไม่ต้องเขียนโค๊ดครับ สามารถนำไปใช้ต่อใน puppeteer ได้ด้วยนะ

มาเริ่มกันเลยครับ

1. ไปที่ Chrome Dev Tool โดยการ กด F12 หรือ คลิกขาวที่หน้าเว็บ ที่เราต้องการทำ Automated Test ครับ
2. จากนั้นเลือก Inspect หรือ ตรวจสอบ นะครับ
3. แล้วก็ มองหาเมนูที่เขียนว่า Recorder ครับ
4. จากนั้นให้กด Create a new recorder
5. จากนั้น ตั้งชื่อเพื่อให้งานต่อการนำมาใช้งานภายหลังนะครับ เช่น “ทดสอบส่งแบบฟร์อม จองโรงแรม” แบบนี้ก็ได้ครับ
6. จากนั้นทำการกด บันทึก ปุ่มสีแดงๆ ได้เลยครับ
7. ทำการทดสอบเว็บไชต์ของเราตามปกติเลยครับ เช่น กรอกชื่อ เบอร์โทร คลิกปุ่ม และอื่นๆ จนจบขั้นตอน ดังวิดีโอตัวอย่างต่อไปนี้
8. จากนั้นกดหยุดการบันทึก เป็นอันจบครับ

ลองเล่นซ้ำและแก้ไขดูครับ

• จากนั้นลองเล่นการทดสอบซ้ำอีกครั้งครับ โดยครั้งนี้ ให้ลองเปลี่ยนข้อความที่ เราเคยพิมไปในขั้นตอนก่อนหน้าดูครับ
• ให้ไปที่ รายการที่เราบันทึกไว้ จาดนั้นทำการแก้ไข ชื่อ ผู้จองห้องพัก ดูครับดังภาพตัวอย่าง
• จากนั้นลองกด Replay ตรงมุมขาวมือด้านบนดูครับ

ส่งออกไปใช้ต่อใน Puppeteer นะครับ

สุดท้ายนี้ เพื่อนๆสามารถนำ เทคนิคนี้ ไปใช้กับการทดสอบ กับระบบของเพื่อนๆได้นะครับ วิธีการส่งออกเป็นรูปแบบอื่นๆ เพื่อใช้ในการเขียนโค๊ด เช่น puppeteer สามารถทำได้ดังนี้ครับ

1. ไปที่รายการที่เราบันทึกไว้
2. กดที่ รูป ดาวโหลด
3. เลือก puppeteer

เพียงเท่านี้เราก็สามารถนี้ไปใช้ เขียนโค๊ดเพิ่มเติมต่อได้แล้วครับ

อยากลองทำตาม? โหลดไฟล์ไปเลยครับ

เพิ่ิอนๆคนไหนอยากจะลองทดสอบ จากไฟล์ที่ผู้เขียนได้ทดลองทดให้ดูในบทความนี้ สามารถดาวโหลดไฟล์แล้วนำไป import เข้า Chrome ของเพื่อนๆดูได้นะครับ จากนั้นไปที่หน้านี้ เพื่อลองทดสอบดูกันครับ “แบบฟร์อมสำหรับทดสอบ Automated Test”

บทความนี้ละครับ