วิธีดาวน์โหลดและติดตั้ง Selenium IDE สำหรับ Firefox & โครเมียม

ในบทช่วยสอนนี้ เราจะได้เรียนรู้วิธีการดาวน์โหลดและติดตั้ง Selenium IDE สำหรับ Firefox และ Google Chromeไม่มีการคอมไพล์ใดๆ และไม่มีอะไรถูกเพิ่มลงในพาธของระบบ — IDE เป็นส่วนขยายของเบราว์เซอร์ ดังนั้นการติดตั้งจะเสร็จสมบูรณ์ในทันทีที่เบราว์เซอร์แจ้งว่าได้เพิ่มส่วนเสริมแล้ว

⚠️ หมายเหตุเกี่ยวกับเวอร์ชัน: ภาพหน้าจอด้านล่างมาจากต้นฉบับ Firefox-เสียบเข้าไป Selenium IDE การสร้างนั้นหยุดทำงานเมื่อ Firefox 55 ได้ยกเลิกการสนับสนุนส่วนเสริม XUL รุ่นเก่าในปี 2017 Selenium IDE ที่เผยแพร่ในปัจจุบันเป็นส่วนขยายที่เขียนขึ้นใหม่สำหรับ Firefox และ Chrome ที่บันทึกโปรเจ็กต์ไว้ใน .side ใช้รูปแบบแทน HTML ทุกขั้นตอนดั้งเดิมถูกเก็บรักษาไว้ที่นี่ โดยมีการระบุพฤติกรรมปัจจุบันไว้ข้างๆ

วิธีการติดตั้ง Selenium IDE สำหรับ Firefox

ด้านล่างนี้เป็นกระบวนการทีละขั้นตอนเกี่ยวกับวิธีการดาวน์โหลดและติดตั้ง Selenium IDE สำหรับ Firefox:

สิ่งที่คุณต้องการ

• Mozilla Firefox
• การเชื่อมต่ออินเทอร์เน็ตที่ใช้งานอยู่

หากคุณไม่มีมอซิลลา Firefox แต่คุณสามารถดาวน์โหลดได้จาก ไฟร์ฟ็อกซ์.คอม.

ขั้นตอนที่ 1) เปิด Firefox ส่วนเสริมและดาวน์โหลด Selenium IDE

ยิง Firefox และไปที่ Selenium รายการ IDE บน Firefox Add-ons- คลิกที่เพิ่มไปที่ Firefoxหน้าส่วนเสริมจะมีลักษณะดังภาพหน้าจอข้างล่าง

ขั้นตอนที่ 2) คลิกที่เพิ่ม

รอจนกระทั่ง Firefox ดาวน์โหลดให้เสร็จสมบูรณ์ จากนั้นคลิก “เพิ่ม” Firefox ขั้นแรกจะแสดงข้อความขออนุญาตด้านล่าง ซึ่งแสดงรายการสิทธิ์การเข้าถึงที่ส่วนขยายร้องขอ

ขั้นตอนที่ 3) คลิกที่ตกลง

เมื่อการติดตั้งเสร็จสมบูรณ์ คุณจะได้รับข้อความยืนยัน คลิก “ตกลง” ในข้อความแจ้งเตือนที่แสดงขึ้นที่นี่

ขั้นตอนที่ 4) คลิกและเปิด Selenium IDE

คลิกที่ Selenium ไอคอน IDE ซึ่งตอนนี้อยู่ใน Firefox แถบเครื่องมือดังแสดงในภาพด้านล่าง

Selenium โปรแกรม IDE จะเปิดขึ้นในหน้าต่างของตัวเอง ดังภาพหน้าจอถัดไป

Firefox DevTools ใน Firefox

การติดตั้ง IDE เป็นเพียงครึ่งหนึ่งของการตั้งค่าเท่านั้น การบันทึกขั้นตอนทำได้ง่าย แต่การเขียนขั้นตอนด้วยมือเองนั้นจำเป็นต้องมีตัวระบุขององค์ประกอบที่ขั้นตอนนั้นกระทำ ซึ่งตัวระบุนี้ได้มาจากเครื่องมือตรวจสอบของเบราว์เซอร์เอง

Firefox DevTools คือ Firefox นี่คือฟีเจอร์ที่เราจะใช้ตรวจสอบองค์ประกอบ HTML ของเว็บแอปพลิเคชันที่กำลังทดสอบ โดยจะระบุชื่อขององค์ประกอบที่คำสั่ง Selenese ของเราจะดำเนินการด้วย

ขั้นตอน 1) คลิกขวาที่ใดก็ได้บนหน้าและเลือกตรวจสอบองค์ประกอบ คุณยังสามารถใช้ทางลัด Ctrl + Shift + I. เมนูบริบทแสดงอยู่ด้านล่าง

ขั้นตอน 2) คุณจะเห็นอินเทอร์เฟซตามภาพที่แสดงอยู่ด้านหนึ่ง โดยโค้ดสำหรับจัดหน้าจะอยู่ด้านหนึ่ง และสไตล์จะอยู่ด้านอีกด้านหนึ่ง

ขั้นตอน 3) คุณสามารถคลิกขวาที่องค์ประกอบแล้วเลือก CSS หรือ XPathสิ่งนี้มีประโยชน์ในการระบุวัตถุ เนื่องจากค่าที่คัดลอกมาสามารถวางลงในช่องได้โดยตรง Target ฟิลด์ของคำสั่ง

หมายเหตุ ในทำนองเดียวกัน คุณสามารถใช้เครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ใน Chrome เพื่อระบุคุณสมบัติของวัตถุได้เช่นกัน แผง Chrome ด้านล่างนี้ทำหน้าที่เดียวกัน

ตัวตรวจสอบทั้งสองยังแสดงแอตทริบิวต์ id, name และ class ที่ IDE ต้องการเมื่อทำการสร้างอีกด้วย ระบุตำแหน่ง ระหว่างการบันทึก

Selenium IDE เลิกใช้แล้ว และการพัฒนาก็หยุดลง เมื่อไม่นานมานี้โครงการนี้ได้รับการฟื้นคืนชีพขึ้นมาใหม่ ใหม่ Selenium ขาดคุณสมบัติมากมายเมื่อเทียบกับ IDE ที่เลิกใช้แล้ว กำลังเพิ่มคุณสมบัติต่างๆ แต่เป็นไปอย่างช้าๆ เพื่อสำรวจคุณสมบัติทั้งหมดของ Selenium IDE เราขอแนะนำให้คุณใช้เวอร์ชันเก่า หากต้องการใช้ IDE เวอร์ชันเก่า

ขั้นตอน 1) ใช้ Firefox 54 ตรวจสอบเวอร์ชันพกพา Good Farm Animal Welfare Awards

ขั้นตอน 2) เยี่ยมชม Selenium ประวัติเวอร์ชันของ IDE และติดตั้ง รายชื่อเวอร์ชันจะมีลักษณะดังนี้

คุณสมบัติต่อไปนี้อาจใช้ไม่ได้ใน IDE เวอร์ชันล่าสุด เราจะอัปเดตบทช่วยสอนอย่างต่อเนื่องเมื่อมีการอัปเดตเวอร์ชันใหม่

⚠️ สถานะปัจจุบัน: การใช้งานเบราว์เซอร์ที่ไม่รองรับเพียงเพื่อรักษาส่วนเสริมที่ไม่รองรับให้ใช้งานได้ต่อไปนั้นไม่ใช่ทางเลือกที่ทำได้จริงอีกต่อไปบนเครื่องทำงาน ดังนั้นให้ถือว่าสองขั้นตอนข้างต้นเป็นเพียงข้อมูลในอดีต IDE ที่สร้างใหม่นี้ครอบคลุมฟังก์ชันส่วนใหญ่ที่ทำให้เครื่องมือรุ่นเก่ามีประโยชน์ รวมถึง... ตัวแปรที่จัดเก็บไว้คำสั่งควบคุมการไหลของโปรแกรม และการส่งออกโค้ด

ปลั๊กอิน

Selenium IDE สามารถรองรับเพิ่มเติมได้ Firefox ส่วนเสริมหรือปลั๊กอินที่สร้างโดยผู้ใช้รายอื่น คุณสามารถเยี่ยมชมได้ที่นี่ เป็นทางการ Selenium เว็บไซต์ IDE สำหรับรายการ Selenium ส่วนเสริมที่มีอยู่จนถึงปัจจุบัน ติดตั้งเช่นเดียวกับที่คุณทำกับผู้อื่น Firefox Add-on

โดยค่าเริ่มต้น Selenium IDE มาพร้อมกับปลั๊กอิน 4 ตัว:

1. Selenium ไอดี: C# ตัวจัดรูปแบบ
2. Selenium ไอดี: Java ตัวจัดรูปแบบ
3. Selenium ไอดี: Python ตัวจัดรูปแบบ
4. Selenium IDE: ตัวจัดรูปแบบ Ruby

ปลั๊กอินทั้งสี่นี้จำเป็นโดย Selenium IDE เพื่อแปลง Selenese เป็นรูปแบบต่างๆ

แท็บปลั๊กอินจะแสดงรายการปลั๊กอินทั้งหมดที่คุณติดตั้ง พร้อมด้วยหมายเลขเวอร์ชันและชื่อผู้สร้างของแต่ละรายการ ดังในภาพหน้าจอด้านล่าง

ส่วนขยายผู้ใช้

Selenium IDE สามารถรองรับส่วนขยายของผู้ใช้เพื่อเพิ่มความสามารถขั้นสูง ส่วนขยายของผู้ใช้อยู่ในรูปแบบของ Javaไฟล์สคริปต์ คุณสามารถติดตั้งไฟล์สคริปต์ได้โดยระบุเส้นทางที่แน่นอนในฟิลด์ใดฟิลด์หนึ่งจากสองฟิลด์นี้ในกล่องโต้ตอบตัวเลือก

• Selenium ส่วนขยายหลัก (user-extensions.js)
• Selenium ส่วนขยาย IDE

ช่องระบุเส้นทางทั้งสองช่องถูกไฮไลต์ไว้ในกล่องโต้ตอบตัวเลือกด้านล่าง

คุณจะพบส่วนขยายของผู้ใช้มากมายบนเว็บไซต์นี้ Selenium หน้าดาวน์โหลดโปรดทราบว่ากลไกนี้เป็นของ Selenium แกนกลางซึ่งถูกนำออกไปแล้วใน Selenium 3; IDE สมัยใหม่ได้รับการขยายขีดความสามารถผ่าน API ปลั๊กอินของตัวเองแทน

วิธีการติดตั้ง Selenium IDE ใน Chrome

ด้านล่างนี้เป็นกระบวนการทีละขั้นตอนเกี่ยวกับวิธีการดาวน์โหลดและติดตั้ง Selenium IDE สำหรับ Google Chrome:

ขั้นตอน 1) ไปที่ Selenium เว็บไซต์ IDE และคลิกปุ่มดาวน์โหลดของ Chrome
ขั้นตอน 2) เปิดรายการใน Chrome Web Store เพื่อดู Selenium ดาวน์โหลดและติดตั้งส่วนขยาย IDE
ขั้นตอน 3) คลิกปุ่ม "เพิ่มไปยัง Chrome" เพื่อเพิ่ม Selenium IDE ถึง Google Chrome.
ขั้นตอน 4) ไปที่เมนูส่วนขยาย คลิกที่ไอคอนนั้น แล้วเปิดขึ้นมา Selenium IDE สำหรับบันทึกการทดสอบใหม่ในโปรเจ็กต์ใหม่

การสร้าง Chrome และ Firefox ไฟล์ build มีนามสกุลเดียวกัน ดังนั้นโปรเจ็กต์ที่บันทึกไว้ในไฟล์หนึ่งจะสามารถเปิดในอีกไฟล์หนึ่งได้ เนื่องจากร้านค้าแอปพลิเคชันมีการเปลี่ยนแปลงรายการสินค้าอยู่เรื่อยๆ ดังนั้นควรเริ่มต้นจากเว็บไซต์อย่างเป็นทางการในขั้นตอนที่ 1 แทนที่จะเริ่มต้นจากร้านค้าที่บันทึกไว้เป็นบุ๊กมาร์ก URL.

วิธีการตรวจสอบการติดตั้งและบันทึกการทดสอบครั้งแรก

การที่ส่วนเสริมโหลดได้ไม่ได้หมายความว่าการตั้งค่าใช้งานได้เสมอไป วิธีตรวจสอบที่เร็วที่สุดคือการบันทึกอะไรง่ายๆ แล้วลองเล่นดู

1. คลิก Selenium ไอคอน IDE หน้าต่างต้อนรับมีตัวเลือกสี่อย่าง ได้แก่ บันทึกการทดสอบใหม่ในโปรเจ็กต์ใหม่ เปิดโปรเจ็กต์ที่มีอยู่ สร้างโปรเจ็กต์ใหม่ หรือปิด IDE
2. เลือกตัวเลือกแรกและตั้งชื่อโครงการ
3. เข้าสู่ฐาน URLนี่คือที่อยู่ของแอปพลิเคชันที่กำลังทดสอบ และที่อยู่นี้จะถูกนำมาใช้ซ้ำในทุกการทดสอบในโครงการ
4. หน้าต่างเบราว์เซอร์ใหม่จะเปิดขึ้นบนหน้าจอนั้น URL และเริ่มการบันทึก คลิกที่ลิงก์หรือพิมพ์ลงในช่อง จากนั้นสลับกลับไปยัง IDE แล้วคลิกไอคอนบันทึกเพื่อหยุด
5. คลิกไอคอนบันทึก โปรแกรม IDE จะเขียนไฟล์เดียวที่มีชื่อไฟล์ว่า... .side การขยาย.
6. เลือกการทดสอบแล้วคลิกเล่น หากขั้นตอนที่บันทึกไว้เล่นซ้ำโดยไม่มีเครื่องหมายแสดงข้อผิดพลาดสีแดง แสดงว่าการติดตั้งเสร็จสมบูรณ์

การเล่นครั้งแรกที่ล้มเหลวตั้งแต่คำสั่งแรกมักจะชี้ไปที่ต้นตอของปัญหา URL แทนที่จะเป็นตอนติดตั้ง การเล่นที่ล้มเหลวกลางคันเป็นปัญหาเกี่ยวกับตัวระบุตำแหน่ง ซึ่งเป็นจุดที่... คำสั่งตรวจสอบและรอ พวกเขาทำหน้าที่ของตนเองได้ดี

วิธีแก้ไขปัญหาทั่วไป Selenium ปัญหาการติดตั้ง IDE

เกือบทุกข้อร้องเรียนเกี่ยวกับการติดตั้งมักตกอยู่ในรูปแบบใดรูปแบบหนึ่งจากไม่กี่รูปแบบ รูปแบบสองอย่างแรกเป็นรูปแบบที่ได้รับการบันทึกไว้โดย... Selenium ตัวโครงการเอง

• ไม่มีไอคอนในแถบเครื่องมือ ยืนยันว่าส่วนขยายเปิดใช้งานอยู่ พิมพ์ chrome://extensions ใน Chrome หรือ about:addons in Firefoxและตรวจสอบว่า Selenium IDE เปิดใช้งานแล้ว
• ส่วนขยายเปิดใช้งานอยู่ แต่ยังมองไม่เห็น ไอคอนอาจถูกซ่อนไว้เนื่องจากแถบเครื่องมือแคบเกินไป ใน Chrome ให้ลากพื้นที่ทางด้านขวาของแถบที่อยู่ ในเบราว์เซอร์อื่นๆ Firefoxคลิกขวาที่แถบเครื่องมือ เลือก ปรับแต่ง ปรับแต่ง แล้วคลิก เสร็จสิ้น
• โปรแกรม IDE เปิดขึ้นมา แต่ไม่บันทึกข้อมูลใดๆ หน้าต่างบันทึกต้องเป็นหน้าต่างที่ IDE เปิดใช้งาน การบันทึกในแท็บที่เปิดด้วยตนเองจะไม่ถูกบันทึก
• ไม่มีอะไรใช้งานได้บนหน้าเว็บภายใน ส่วนขยายไม่สามารถเขียนสคริปต์สำหรับหน้าเว็บภายในเบราว์เซอร์ เช่น หน้าจอการตั้งค่าหรือหน้าจอส่วนขยาย ดังนั้นจึงควรบันทึกข้อมูลกับหน้าเว็บทั่วไป
• เบราว์เซอร์ที่มีการจัดการจะบล็อกการติดตั้ง ในการตั้งค่าโปรไฟล์ขององค์กร การติดตั้งส่วนขยายมักถูกควบคุมด้วยนโยบาย และต้องให้ผู้ดูแลระบบอนุญาตหมายเลขประจำตัวส่วนขยายก่อน

วิธีการติดตั้ง Selenium โปรแกรมรันบรรทัดคำสั่ง IDE

ส่วนขยายนี้จะเล่นการทดสอบเฉพาะในเบราว์เซอร์ที่ติดตั้งไว้เท่านั้น หากต้องการเรียกใช้โปรเจ็กต์ที่บันทึกไว้ในเบราว์เซอร์อื่น ๆ พร้อมกัน หรือบน Grid ให้ติดตั้งตัวเรียกใช้งานแบบบรรทัดคำสั่ง ซึ่งต้องใช้ Node.js และ npm

npm install -g selenium-side-runner

แต่ละเบราว์เซอร์ยังต้องการไฟล์ไบนารีไดรเวอร์ของตัวเองด้วย ติดตั้งไดรเวอร์สำหรับเบราว์เซอร์ที่คุณต้องการใช้งาน

npm install -g chromedriver
npm install -g geckodriver
npm install -g edgedriver

เมื่อมีตัวรันเนอร์และไดรเวอร์พร้อมแล้ว ให้ชี้ตัวรันเนอร์ไปยังไฟล์โปรเจ็กต์ที่ IDE บันทึกไว้ก่อนหน้านี้

selenium-side-runner /path/to/your-project.side

ตัวรันเนอร์จะกระจายชุดคำสั่งไปยังกระบวนการต่างๆ มากเท่ากับจำนวนคอร์ CPU ของเครื่อง การตั้งค่าแบบสองแฟล็กก็ครอบคลุมความต้องการใช้งานทั่วไปได้แล้ว: -c ตั้งค่าเบราว์เซอร์ และ --base-url เป็นการปรับเป้าหมายโครงการทั้งหมดไปยังสภาพแวดล้อมที่แตกต่างออกไป ซึ่งทำให้การบันทึกเดียวกันสามารถใช้งานได้ทั้งกับการสร้างในเครื่องและเซิร์ฟเวอร์ทดสอบ

selenium-side-runner -c "browserName=firefox" --base-url https://localhost

จากตรงนี้ ขั้นตอนต่อไปตามธรรมชาติคือการละทิ้งการบันทึกและเล่นซ้ำ แล้วเขียนการตรวจสอบแบบเดียวกันในรูปแบบโค้ด — ดูที่นี่ สคริปต์ WebDriver ตัวแรก คำแนะนำและรายละเอียดเพิ่มเติม Selenium ชุด.

คำถามที่พบบ่อย