14 พ.ย. 2021 เวลา 05:00 • วิทยาศาสตร์ & เทคโนโลยี
บทเรียนที่ 4 Puppeteer
บทเรียนนี้เราจะพูดถึง Puppeteer ที่ไม่ใช่หุ่นเชิดกัน ถ้าใครอยู่ในแวดวง Developer คงน่าจะเคยได้ยินคำนี้กันมาบ้าง
ก่อนอื่นต้องขอออกตัวก่อนว่าไม่ใช่ Developer ข้อมูลด้านล่างเป็นสิ่งที่เข้าใจจากการเรียนรู้ Puppeteer
Puppeteer
Puppeteer เป็น Node library ตัวหนึ่งที่ช่วยเราจัดการ Headless Chrome หรือ Chromium ในระดับ High level
ก่อนจะไปถึงส่วนอื่นเรามาทำความรู้จักกับ Headless Chrome กันก่อน
Headless Chrome ก็คือ Chrome brower ปกตินั่นแหละ แต่ไม่ Full UI ให้ลองนึกภาพ Incognito mode ที่เราใช้งานกันอยู่
ประโยชน์หลักๆ ของ Headless Chrome คือการใช้งานสำหรับเทส Website
แล้ว Puppeteer ทำอะไรได้บ้าง
ความสามารถแรกของ Puppeteer คือ Screenshot page ที่เราต้องการเป็นรูปแบบไฟล์ PDF
ความสามารถถัดไปเป็นการ Crawl Single-Page Application (SPA) และ Generate pre-rendered content.
ถัดไป Pupeteer สามารถใช้ในการทำ Automate form summission ไม่ว่าจะเป็นการกรอกข้อมูล การเลือกค่าใน Dropdown การอัพโหลดไฟล์ หรืออื่นๆ แล้วแต่จะทำ Scenario ที่ต้องการเทส
จากข้อข้างบนเราจะเห็นถึงความสามารถของ Puppeteer ที่สามารถเทส UI และคอนโทรล Keyboard input
นอกจากนี้เจ้า Puppeteer ก็ยังสามารถ Track Web timeline ได้ด้วย ซึ่งค่อนข้างเป็นประโยชน์ในการ Dianose performance issues
ความสามารถสุดท้ายของ Puppeteer คือ การเทส Chrome extension
จริงๆ แล้ว Puppeteer ที่ใช้งานกันอยู่มี 2 แบบคือ Puppeteer ธรรมดาที่รันบน Chrome เวอร์ชันล่าสุด กับ Puppeteer Core ที่รันบน Light Chrome ใน Headless environment
Puppeteer Core สามารถใช้ทำงานได้ทั้ง Flowground และ Background แล้วแต่จุดประสงค์ของผู้ใช้งาน
ตอนไปจะเป็นหลักการทำงานของ Puppeteer
1. เริ่มจากเปิดเพจเป้าหมายที่ต้องการทำการเทส
2. ทำ Activities ต่างๆ ตาม Scenario ที่ตั้งไว้
3. ปิดเพจเป้าหมายหลังจากทำทุกอย่างเรียบร้อยแล้ว หากต้องการไปยังเพจถัดไปก็สามารถไปเริ่มที่ข้อ 1 ใหม่ได้เลย
Puppeteer library
สรุปก็คือ Puppeteer เป็นหนึ่งใน Library ที่เราสามารถนำมาใช้ในการพัฒนาเว็บไซต์เพื่อลดขั้นตอนในการทดสอบ Scenario พื้นฐานลง หากต้องการศึกษาข้อมูลเพิ่มเติมสำหรับนำไปใช้งานสามารถอ่านได้จากลิ้งค์ด้านล่าง
Reference:
นิยามของ Puppeteer
Puppeteer library และตัวอย่างการใช้งาน
โฆษณา