CodeceptJS
3.6.10
สร้างสถานะ:
Appium Helper:
ผู้ช่วยเว็บ:
ข้อมูลอ้างอิง: ผู้ช่วย API
CodeceptJS เป็นกรอบการทดสอบใหม่สำหรับการทดสอบแบบครบวงจรกับ WebDriver (หรืออื่น ๆ ) มันเป็นนามธรรมของเบราว์เซอร์กับขั้นตอนง่าย ๆ ที่เขียนจากมุมมองของผู้ใช้ การทดสอบอย่างง่าย ๆ ที่ตรวจสอบข้อความ "ยินดีต้อนรับ" มีอยู่ในหน้าหลักของไซต์จะมีลักษณะ:
Feature ( 'CodeceptJS demo' ) ;
Scenario ( 'check Welcome page on site' , ( { I } ) => {
I . amOnPage ( '/' ) ;
I . see ( 'Welcome' ) ;
} ) ;การทดสอบ codeceptjs คือ:
I นั่นทำให้การทดสอบง่ายต่อการอ่านเขียนและบำรุงรักษาแม้สำหรับบุคคลที่ไม่ใช่เทคโนโลยี CodeCeptJS ใช้โมดูลตัว ช่วย เพื่อให้การดำเนินการกับ I คัดค้าน ปัจจุบัน CodeCeptJS มีผู้ช่วยเหล่านี้:
และอีกมากมายที่จะมา ...
CodeceptJS เป็นผู้สืบทอดของ CodecePtion ซึ่งเป็นกรอบการทดสอบเต็มรูปแบบยอดนิยมสำหรับ PHP ด้วย codeceptjs การทดสอบการทำงานและการยอมรับสถานการณ์ของคุณจะง่ายและสะอาดเท่าที่ควร คุณไม่จำเป็นต้องกังวลเกี่ยวกับธรรมชาติแบบอะซิงโครนัสของ nodejs หรือเกี่ยวกับ APIs ของนักเขียนบทละคร, ซีลีเนียม, puppeteer, testcafe ฯลฯ ในขณะที่ codeceptjs รวมเข้าด้วยกันและทำให้พวกเขาทำงานได้
npm i codeceptjs --saveย้ายไปยังไดเรกทอรีที่คุณต้องการให้การทดสอบของคุณ (และ codeceptjs config) เก็บไว้และดำเนินการ:
npx codeceptjs initเพื่อสร้างและกำหนดค่าสภาพแวดล้อมการทดสอบ ขอแนะนำให้เลือก WebDriver จากรายชื่อผู้ช่วยหากคุณต้องการเขียนการทดสอบ Selenium WebDriver
หลังจากนั้นสร้างการทดสอบครั้งแรกของคุณโดยดำเนินการ:
npx codeceptjs generate:testตอนนี้การทดสอบถูกสร้างขึ้นและสามารถดำเนินการได้ด้วย
npx codeceptjs runหากคุณต้องการเขียนการทดสอบของคุณโดยใช้ typeScript เพียงสร้างคำจำกัดความประเภทมาตรฐานโดยการดำเนินการ:
npx codeceptjs def .ในภายหลังคุณสามารถอัปเดตคำจำกัดความประเภทโดยอัตโนมัติเพื่อรวมวิธีการช่วยเหลือที่กำหนดเองของคุณเอง
บันทึก:
12+ หรือใหม่กว่า เรียนรู้ codeceptjs โดยตัวอย่าง สมมติว่าเรามีการติดตั้ง CodeceptJS และเปิดใช้งาน WebDriver Helper
มาดูกันว่าเราจะจัดการกับการทดสอบแบบฟอร์มพื้นฐานได้อย่างไร:
Feature ( 'CodeceptJS Demonstration' ) ;
Scenario ( 'test some forms' , ( { I } ) => {
I . amOnPage ( 'http://simple-form-bootstrap.plataformatec.com.br/documentation' ) ;
I . fillField ( 'Email' , '[email protected]' ) ;
I . fillField ( 'Password' , secret ( '123456' ) ) ;
I . checkOption ( 'Active' ) ;
I . checkOption ( 'Male' ) ;
I . click ( 'Create User' ) ;
I . see ( 'User is valid' ) ;
I . dontSeeInCurrentUrl ( '/documentation' ) ;
} ) ; การกระทำทั้งหมดดำเนินการโดย I คัดค้าน; ฟังก์ชั่นการยืนยันเริ่มต้นด้วยฟังก์ชั่น see ในตัวอย่างเหล่านี้ทุกวิธีของ I ถูกนำมาจากผู้ช่วย webdriver ดูการอ้างอิงเพื่อเรียนรู้วิธีการใช้งาน
ลองดำเนินการทดสอบนี้ด้วยคำสั่ง run ตัวเลือกเพิ่มเติม --steps จะแสดงกระบวนการทำงานให้เรา เราขอแนะนำให้ใช้ --steps หรือ --debug ระหว่างการพัฒนา
npx codeceptjs run --stepsสิ่งนี้จะสร้างผลลัพธ์:
CodeceptJS Demonstration --
test some forms
• I am on page " http://simple-form-bootstrap.plataformatec.com.br/documentation "
• I fill field " Email " , " [email protected] "
• I fill field " Password " , " **** "
• I check option " Active "
• I check option " Male "
• I click " Create User "
• I see " User is valid "
• I dont see in current url " /documentation "
✓ OK in 17752ms CodeceptJS มีคุณสมบัติสูงสุดที่จะช่วยคุณพัฒนาและแก้ไขข้อบกพร่องการทดสอบของคุณ คุณสามารถ หยุดการทดสอบชั่วคราวในสถานที่ใด ๆ และใช้เชลล์แบบโต้ตอบ เพื่อลองดำเนินการและตัวระบุตำแหน่งที่แตกต่างกัน เพียงเพิ่ม pause() โทรที่สถานที่ใด ๆ ในการทดสอบและเรียกใช้
เปลือกแบบโต้ตอบสามารถเริ่มต้นนอกบริบทการทดสอบโดยการรัน:
npx codeceptjs shell เรากรอกแบบฟอร์มด้วยวิธี fillField ซึ่งอยู่ในรูปแบบองค์ประกอบตามฉลากของพวกเขา เช่นเดียวกับที่คุณสามารถค้นหาองค์ประกอบตามชื่อ, CSS หรือ locators XPath ในการทดสอบ:
// by name
I . fillField ( 'user_basic[email]' , '[email protected]' ) ;
// by CSS
I . fillField ( '#user_basic_email' , '[email protected]' ) ;
// don't make us guess locator type, specify it
I . fillField ( { css : '#user_basic_email' } , '[email protected]' ) ; วิธีอื่น ๆ เช่น checkOption และ click ทำงานในลักษณะเดียวกัน พวกเขาสามารถใช้ป้ายกำกับหรือ CSS หรือ XPATH เพื่อค้นหาองค์ประกอบที่จะโต้ตอบ
การยืนยันเริ่มต้นด้วยคำนำหน้า see หรือ dontSee ในกรณีของเราเรากำลังยืนยันว่าสตริง 'ผู้ใช้ถูกต้อง' อยู่ที่ไหนสักแห่งในหน้าเว็บ อย่างไรก็ตามเราสามารถ จำกัด การค้นหาองค์ประกอบเฉพาะได้โดยการจัดหาพารามิเตอร์ที่สอง:
I . see ( 'User is valid' ) ;
// better to specify context:
I . see ( 'User is valid' , '.alert-success' ) ; ในกรณีนี้สตริง 'ผู้ใช้ที่ถูกต้อง' จะถูกค้นหาเฉพาะภายในองค์ประกอบที่อยู่ใน CSS .alert-success
ในกรณีที่คุณต้องการส่งคืนค่าจากหน้าเว็บและใช้โดยตรงในการทดสอบคุณควรใช้วิธีการด้วยคำนำหน้า grab พวกเขาคาดว่าจะใช้ภายในฟังก์ชั่น async/await และผลลัพธ์ของพวกเขาจะมีอยู่ในการทดสอบ:
Feature ( 'CodeceptJS Demonstration' ) ;
Scenario ( 'test page title' , async ( { I } ) => {
I . amOnPage ( 'http://simple-form-bootstrap.plataformatec.com.br/documentation' ) ;
const title = await I . grabTitle ( ) ;
I . expectEqual ( title , 'Example application with SimpleForm and Twitter Bootstrap' ) ; // Avaiable with Expect helper. -> https://codecept.io/helpers/Expect/
} ) ;เช่นเดียวกับที่คุณสามารถคว้าข้อความแอตทริบิวต์หรือค่าฟอร์มและใช้ในขั้นตอนการทดสอบถัดไป
ขั้นตอนการเตรียมการทั่วไปเช่นการเปิดหน้าเว็บการเข้าสู่ระบบในผู้ใช้สามารถวางไว้ Before หรือ Background :
const { I } = inject ( ) ;
Feature ( 'CodeceptJS Demonstration' ) ;
Before ( ( ) => { // or Background
I . amOnPage ( 'http://simple-form-bootstrap.plataformatec.com.br/documentation' ) ;
} ) ;
Scenario ( 'test some forms' , ( ) => {
I . click ( 'Create User' ) ;
I . see ( 'User is valid' ) ;
I . dontSeeInCurrentUrl ( '/documentation' ) ;
} ) ;
Scenario ( 'test title' , ( ) => {
I . seeInTitle ( 'Example application' ) ;
} ) ; CodeCeptJS เป็นวิธีที่ง่ายที่สุดในการสร้างและใช้วัตถุหน้าในการทดสอบของคุณ คุณสามารถสร้างหนึ่งโดยการรัน
npx codeceptjs generate pageobject มันจะสร้างไฟล์วัตถุหน้าสำหรับคุณและเพิ่มลงในการกำหนดค่า สมมติว่าเราสร้างหนึ่งชื่อ docsPage :
const { I } = inject ( ) ;
module . exports = {
fields : {
email : '#user_basic_email' ,
password : '#user_basic_password'
} ,
submitButton : { css : '#new_user_basic input[type=submit]' } ,
sendForm ( email , password ) {
I . fillField ( this . fields . email , email ) ;
I . fillField ( this . fields . password , password ) ;
I . click ( this . submitButton ) ;
}
}คุณสามารถฉีดได้อย่างง่ายดายเพื่อทดสอบโดยให้ชื่อในอาร์กิวเมนต์ทดสอบ:
Feature ( 'CodeceptJS Demonstration' ) ;
Before ( ( { I } ) => { // or Background
I . amOnPage ( 'http://simple-form-bootstrap.plataformatec.com.br/documentation' ) ;
} ) ;
Scenario ( 'test some forms' , ( { I , docsPage } ) => {
docsPage . sendForm ( '[email protected]' , '123456' ) ;
I . see ( 'User is valid' ) ;
I . dontSeeInCurrentUrl ( '/documentation' ) ;
} ) ; เมื่อใช้ typeScript ให้แทนที่ module.exports ออกด้วย export สำหรับการเติมเงินอัตโนมัติ
davertmik | Kobenguyent | Vorobeyko | reubenmiller |
อาร์เฮลล์ | apshenkin | ฟาเบโอเอล | Pablopaul |
เมราโอ | จอร์จกริฟฟ์ | kmkoushik | nikocanvacom |
Elukoyanov | Thomashohn | คนขี้เกียจ | ซุมูระ |
Egorbodnar | Vikalpp | Elaichenkov | Borisosipov |
คนขี้ขลาด | Nitschsb | เสียงดัง | jploskonka |
Maojunxyz | Abhimanyupandian | มาร์โตโม | Hatufacci |
ทีม mit © codeceptjs
