constructor คืออะไร constructor ก็คือ ฟังก์ชันที่ถูกเรียกใช้งาน เมื่อ object ถูกสร้างขึ้นมา ซึ่งใน C#.NET  ก็คือฟังก์ชันที่ตั้งชื่อเป็นชื่อเดียวกับชื่อ class นั่นเอง   constructor มีประโยชน์อย่างไร ในการสร้าง object ขึ้นมา บางครั้งต้องมีการระบุค่าเริ่มต้นบางอย่างให้กับ object นั้น ซึ่ง constructor ก็จะเป็นเครื่องมือหนึ่งที่เป็นตัวช่วยบังคับให้ต้องระบุค่าเริ่มต้นนี้ตอนสร้าง object นั่นเอง   ยกตัวอย่าง เช่น class Student { public Student(string studentID) { คำสั่งดึงข้อมูลนักศึกษาด้วย Student ID โดยใช้ข้อมูล Student ID จาก argument studentID } } จากตัวอย่างนี้ ต้องการสร้าง object Student โดยใช้ Student ID เพื่อไปดึงข้อมูลเบื้องต้นของนักศึกษามาแสดง ดังนั้น object ใหม่ที่สร้างจาก class Student ก็จะต้องระบุค่า Student ID ให้กับ argument studentID ก่อน ตัวอย่างการเรียกใช้งานคือ Student student = new Student(12345); student ก็คือ object ที่ถูกสร้าง 123456 คือ ข้อมูล Student ID ทีต้องระบุตอนที่ object นี้ถูกสร้างนั่นเอง   ทำไมต้องเรียกใช้ constructor จากอีก constructor หนึ่ง ในบางครั้งเมื่อเราใช้งาน class ไประยะเวลาหนึ่ง อาจะเจอกรณีที่ constructor เดิม ยังไม่รองรับความต้องการที่เปลี่ยนไปหรือเพิ่มขึ้น   แต่ความต้องการใหม่นั้นยังคงต้องใช้ชุดคำสั่งและขั้นตอนการทำงานเหมือนกับที่มีอยู่เดิมด้วย และมีการเพิ่มเติมชุดคำสั่งใหม่เข้าไปเล็กน้อยเพื่อให้รองรับกับความต้องการใหม่ด้วย ซึ่งทางเลือกที่เป็นไปได้คือ ปรับแก้ constructor เดิมที่มีอยู่ให้รองรับความต้องการใหม่ สร้าง constructor ใหม่ โดยทำการสำเนาชุดคำสั่งทั้งหมดใน constructor เดิมมา สร้าง constructor ใหม่ โดยเรียกใช้งาน constructor เดิม มาพิจารณาแต่ละทางเลือก ทางเลือกที่ 1 เป็นการปรับแก้ของเดิมที่มีอยู่แล้ว ซึ่งเป็นทางที่ควรเลี่ยงที่สุด เพราะอาจจะไปกระทบกับการทำงานเดิมที่ถูกต้องอยู่แล้ว และอาจจะกระทบเป็นลูกโซ่กับ object อื่นที่มาเรียกใช้ ทางเลือกที่ 2 สำเนาคำสั่งทั้งหมดจาก constructor เดิม มาใส่ใน constructor ใหม่ แล้วเขียนคำสั่งเพิ่มเพื่อให้รองรับความต้องการใหม่ ซึ่งทางเลือกนี้ถือว่าดีกว่าทางเลือกแรก เพราะไม่กระทบกับการทำงานเดิมแน่นอน แต่จะเห็นว่าเกิดความซ้ำซ้อนกันของชุดคำสั่งของ constructor เดิม และใหม่ และจะพบปัญหาในกรณีที่มีความจำเป็นต้องปรับปรุงคำสั่งที่ใช้อยู่ใน constructor ทั้งสอง ผู้พัฒนาก็จะต้องมาแก้ทั้งสองที่ให้เหมือนกันอีก ซึ่งจะเป็นการเสียเวลา ทางเลือกที่ 3 เรียกใช้งาน constructor เดิม ซึ่งจะเห็นว่าเป็นวิธีการที่สะดวกรวดเร็วที่สุด หากต้องการปรับปรุงคำสั่ง ก็เพียงไปจัดการที่ constructor เดิมเท่านั้น   วิธีการเรียกใช้งาน constructor เดิม จาก constructor ใหม่ syntax ที่ใช้ใน C#.NET คือ  หลังจากส่วนประกาศ constructor ให้ใช้  : this() เพิ่มเข้าไป ยกตัวอย่าง   class Student { public Student(string studentID) //constructor เดิม { คำสั่งดึงข้อมูลนักศึกษาด้วย Student ID โดยใช้ข้อมูล Student ID จาก argument studentID }   public Student(string studentID, string citizenID) : this(studentID)  //constructor ใหม่ { คำสั่งใหม่ที่เพิ่มเติม } }

Puppeteer เป็น Node library ที่มีชุดของ API สำหรับการควบคุม Google Chrome หรือ Chromium ผ่าน DevTool protocol ทำงานในรูปแบบ headless โดย default แต่สามารถกำหนดให้ทำงานแบบ full (non-headless) Chrome ได้  ที่สำคัญไม่ต้องทำงานผ่าน Web Driver อีกต่อไป puppeteer สามารถทำงานได้ทุกอย่างที่สามารถทำได้โดย manual บน browser เช่น สร้าง screenshots และ PDFs ของ page Automate form submission UI testing keyboard input การติดตั้ง Puppeteer การติดตั้ง Puppeteer เพื่อใช้งานใน project สามารถทำได้ผ่านทาง NPM โดยใช้คำสั่ง npm i puppeteer เมื่อทำการติดตั้ง Puppeteer จะทำการ downloads Chromium version ล่าสุดซึ่งสามารถทำงานร่วมกับ api ได้อย่างสมบูรณ์ (ประมาณ 170 Mb สำหรับ Mac, 282 Mb สำหรับ Linux และ 280 Mb สำหรับ Windows) ถ้าไม่ต้องการ download Chromium ในระหว่างการติดตั้ง สามารถยกเลิกได้โดยการกำหนดค่า “PUPPETEER_SKIP_CHROMIUM_DOWNLOAD”  environment variables การใช้งาน Puppeteer Puppeteer API ให้ความสามารถในการสร้าง instance ของ  browser, เปิด webpage และบันทึก screenshot โดยสร้าง file ชื่อ example.js และเขียน code ดังนี้ เรียกใช้งาน script  บน command line โดยใช้คำสั่ง node example.js Puppeteer กำหนด default ขนาดของ page ที่ 800 x 600px  และสามารถเปลี่ยน page size โดยใช้ page.setViewport() ซึ่งสามารถศึกษาเพิ่มเติมการใช้งาน Puppeteer API ได้ที่ https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md ผลของการ run script  จะทำการบันทึก screenshot ของ https://example.com ไปที่ file “example.png” จะเห็นว่าในระหว่างการ run script ไม่ได้ปรากฎ browser ขึ้นมาให้เห็น เนื่องจากโดยค่า default จะทำงานเป็น headless mode แต่สามารถเปลี่ยนการทำงานได้โดยกำหนด headless = false หากต้องการดูการทำงาน const browser = await puppeteer.launch({ headless: true }); // default is true   อ้างอิง https://github.com/GoogleChrome/puppeteer/

จากบทความ Visual test automation ที่ได้กล่าวถึง Appraise ที่ใช้สำหรับทำการทดสอบการแสดงผลแบบอัตโนมัติในเบื้องต้น ตั้งแต่การติดตั้ง ตัวอย่าง test page, test fixture การเรียกใช้งานการทดสอบ และผลการทดสอบ บทความนี้จะมาลงรายละเอียดในการสร้าง test page Creating test pages Appraise สามารถกำหนดรูปแบบข้อกำหนดการทดสอบสำหรับการทดสอบส่วนแสดงผลได้ไม่ยุ่งยาก โดย Appraise จะทำการอ่านข้อมูลนำเข้า และ ผลลัพธ์ที่คาดหวัง จาก file ที่เขียนในรูปแบบ Markdown แล้วส่งต่อให้กับระบบทำการทดสอบ จากนั้นจะบันทึกภาพการแสดงผลที่เกิดขึ้น เปรียบเทียบภาพการแสดงผลที่ได้จริงกับผลลัพธ์ที่คาดหวัง โดยมีสิ่งที่จำเป็นที่จะต้องกำหนดสำหรับการทดสอบ 3 ส่วน คือ input expect output fixture Input (parameters ของ example) input parameters อยู่ในรูปแบบ text JSON หรือ YAML  ในการกำนด input parameters สำหรับแต่ละการทดสอบหรือ example จะต้องกำหนด block ของ example และกำหนดชื่อให้กับ example ในส่วนเริ่มต้น block ในรูปแบบ example=”ชื่อ” จากรูปข้างต้น จะเห็นว่ามี example ชื่อ “first” ถูกกำหนดรูปแบบเป็น YAML ซึ่ง Appraise จะรู้ว่าจะนำข้อมูลไปได้อย่างไร ในแต่ละ test page สามารถมี eaxmple ได้มากกว่าหนึ่ง example โดยที่แต่ละ example จะต้องมีชื่อที่ไม่ซ้ำกัน ซึ่งจำเป็นในการใช้สำหรับเปรียบเทียบกับผลลัพธ์ที่คาดหวังด้วย Expect output ecpect output – ผลลัพธ์ที่คาดหวัง ซึ่งอยู่ในรูปแบบ file รูปภาพ .png  การกำหนดผลลัพธ์ที่คาดหวังใน test page ทำได้โดยระบุ  ซึ่งจะอยู่ส่วนใดๆใน test page ก็ได้ ไม่ว่าจะอยู่ก่อน example input ก็ได้ โดยที่ความเชื่อมโยงระหว่าง input กับ expect output ก็คือชื่อของ example ที่กำหนดใน [] ในการสร้าง test page อาจจะไม่ต้องกำหนด expect output ก่อนก็ได้เช่นกัน เมื่อทำการ run test ครั้งแรก ผลที่ออกมาจะ failed เนื่องจากไม่ได้ระบุ expect output แต่สามารถที่จะบันทึกผลที่ได้จากการ run test ใช้เป็น expect output สำหรับการ run test ครั้งต่อไปได้ Fixture fixture คือส่วนของ code ที่ Apprise ใช้ในการเชื่อมต่อกับระบบที่จะทดสอบ รวมทั้งกำหนดการใช้งานและการประมวลผล input ในการทดสอบ โดยทั่วไป examples ที่เชื่อมโยงกันจะใช้ fixture เดียวกัน การกำหนด fixture ทำโดยการระบุ fixture =”ชื่อ fixture” ในส่วนของ header ของ example block จากรูปข้างต้น จะเห็นว่ามี example ชื่อ “first” มีการกำหนด fixture คือ “hello.js” จากตัวอย่าง fixture ด้านบน เป็น fixture ที่มีการสร้าง output page ออกมาโดยตรงโดยไม่ได้เชื่อมต่อกับระบบใดๆ ซึ่งในการใช้งานจริง จะต้องเชื่อมต่อกับระบบหรือส่วนที่จะทำการทดสอบจริงที่ทำการ render ผลลัพธ์ออกมา input