Artikel ini akan meneroka ujian fungsional JavaScript dengan lebih mendalam dan menunjukkan menggunakan Perpustakaan Nightwatch.js.
Sebelum kita mula, mari kita semak ujian fungsional dan mengapa ia penting. Ringkasnya, ujian fungsional direka untuk memastikan aplikasi berfungsi seperti yang diharapkan dari perspektif pengguna.
Kami tidak bercakap mengenai ujian teknikal seperti ujian unit atau ujian integrasi. Matlamat di sini adalah untuk memastikan pengguna dapat melaksanakan senario tertentu dengan lancar seperti log masuk ke platform, membeli produk, dan sebagainya.
mata utama
nightwatch.json pada akar projek. persekitaran pengeluaran. nightwatch.conf.js
Nightwatch.js Pengenalan nightwatch.js menggambarkan dirinya sebagai rangka ujian akhir-ke-akhir berdasarkan Node.js. Ia bergantung kepada Selenium, sebuah projek yang direka untuk memudahkan automasi pelayar web.
dengan sintaks mesra pengguna, nightwatch.js boleh "skrip" senario dan kemudian dilaksanakan secara automatik oleh penyemak imbas (tidak semestinya tidak berkepala).
Pemasangan Nightwatch
NightWatch sendiri adalah modul Node.js, yang bermaksud anda perlu memasang Node.js pada mesin anda. Cara paling mudah ialah menggunakan pengurus versi, seperti NVM. Nightwatch diedarkan pada npm, jadi anda boleh memasangnya seperti anda akan memasang modul lain - pasangnya secara global dengan
atau pasangnya dalam projek semasa menggunakan. -g
--save-dev
npm install --save-dev nightwatch
Selepas memuat turun dan pemasangan selesai, anda boleh menggunakan java -version untuk memastikan Java tersedia pada mesin anda. Langkah terakhir adalah untuk memuat turun Server Standalone Selenium yang dibungkus sebagai balang dari halaman muat turun Selenium. Saya cadangkan anda memasukkannya ke dalam folder bin dalam projek anda.
npm install --save-dev nightwatch
Baiklah, kami sudah bersedia sekarang. Mari bermula.
Konfigurasi Nightwatch
atau fail nightwatch.json dalam direktori root projek. Saya cadangkan menggunakan yang terakhir kerana ia lebih fleksibel dan membolehkan anda menambah komen. nightwatch.conf.js
<code>your_project/ | |– bin/ | |– selenium-server-standalone-2.53.1.jar | `– package.json</code>
Nota: Saya secara peribadi fikir ia lebih mudah dibaca apabila fail konfigurasi dibahagikan kepada objek konfigurasi yang lebih kecil, dan fail JSON tidak membenarkan ini.
Dalam kes ini, kami memberitahu NightWatch bahawa ujian kami akan berada di folder, menggunakan konfigurasi selenium tertentu dan tetapan ujian tertentu. Mari lihat satu demi satu: tests
var SELENIUM_CONFIGURATION = {
start_process: true,
server_path: 'bin/selenium-server-standalone-2.53.0.jar',
host: '127.0.0.1',
port: 4444
};
var FIREFOX_CONFIGURATION = {
browserName: 'firefox',
javascriptEnabled: true,
acceptSslCerts: true
};
var DEFAULT_CONFIGURATION = {
launch_url: 'http://localhost',
selenium_port: 4444,
selenium_host: 'localhost',
desiredCapabilities: FIREFOX_CONFIGURATION
};
var ENVIRONMENTS = {
default: DEFAULT_CONFIGURATION
};
module.exports = {
src_folders: ['tests'],
selenium: SELENIUM_CONFIGURATION,
test_settings: ENVIRONMENTS
};, yang menjadi nilai lalai Nightwatch. Kami juga memastikan ia bermula secara automatik menggunakan pelayan Selenium yang kami muat turun dan disimpan dalam folder 127.0.0.1:4444. bin
NOTA: Untuk penggunaan yang lebih maju, pastikan anda menyemak senarai semua pilihan selenium.
terus ke persediaan ujian sebenar:Pilihan
var SELENIUM_CONFIGURATION = {
start_process: true,
server_path: 'bin/selenium-server-standalone-2.53.0.jar',
host: '127.0.0.1',
port: 4444
}; mengharapkan objek yang kunci adalah nama setiap persekitaran, dipetakan ke objek konfigurasi yang lain. Dalam kes ini, kami belum menubuhkan persekitaran tersuai (belum), jadi kami menggunakan persekitaran lalai. Kemudian, kita boleh mempunyai persekitaran ujian pementasan atau pengeluaran. test_settings
NOTA: Untuk penggunaan yang lebih maju, pastikan anda menyemak senarai semua pilihan ujian.
var DEFAULT_CONFIGURATION = {
launch_url: 'http://localhost',
selenium_port: 4444,
selenium_host: 'localhost',
desiredCapabilities: FIREFOX_CONFIGURATION
};
var ENVIRONMENTS = {
default: DEFAULT_CONFIGURATION
};) atau sistem operasi (menggunakan version). platform
NOTA: Untuk penggunaan yang lebih maju, pastikan anda menyemak senarai semua pilihan ciri.
Baiklah, kami kini mempunyai konfigurasi yang betul. Sudah tiba masanya untuk menulis ujian pertama anda!
Menulis Ujian Nightwatch
Untuk ujian kami, kami akan mempertimbangkan halaman log masuk yang terletak di dengan medan e -mel, medan kata laluan, dan butang hantar. Selepas menyerahkan borang, pengguna harus diarahkan ke halaman yang memaparkan "suapan berita". /login
Dalam konfigurasi kami, kami menyatakan bahawa ujian terletak dalam folder bernama tests. Mari buat folder tests ini, dan fail bernama login.js.
npm install --save-dev nightwatch
Fail ini akan mengeksport objek yang menggambarkan senario kami. Setiap kunci (jika terdapat banyak) adalah nama ujian, dipetakan ke fungsi yang mengandungi langkah -langkah yang akan dilakukan.
<code>your_project/ | |– bin/ | |– selenium-server-standalone-2.53.1.jar | `– package.json</code>
mendedahkan objek yang menyediakan API yang diperlukan untuk menggambarkan tempat kejadian. Perkara pertama yang perlu dilakukan ialah menavigasi ke url log masuk. Kemudian, isikan medan dan tekan butang. Akhirnya, periksa sama ada kita dapat melihat teks "suapan berita".
var SELENIUM_CONFIGURATION = {
start_process: true,
server_path: 'bin/selenium-server-standalone-2.53.0.jar',
host: '127.0.0.1',
port: 4444
};
var FIREFOX_CONFIGURATION = {
browserName: 'firefox',
javascriptEnabled: true,
acceptSslCerts: true
};
var DEFAULT_CONFIGURATION = {
launch_url: 'http://localhost',
selenium_port: 4444,
selenium_host: 'localhost',
desiredCapabilities: FIREFOX_CONFIGURATION
};
var ENVIRONMENTS = {
default: DEFAULT_CONFIGURATION
};
module.exports = {
src_folders: ['tests'],
selenium: SELENIUM_CONFIGURATION,
test_settings: ENVIRONMENTS
}; Nota: Sentiasa gunakan .end() untuk menamatkan senarai arahan supaya sesi selenium ditutup dengan betul.
Ini sangat mudah! Kami kini boleh menjalankan ujian kami untuk melihat apakah ia berfungsi:
var SELENIUM_CONFIGURATION = {
start_process: true,
server_path: 'bin/selenium-server-standalone-2.53.0.jar',
host: '127.0.0.1',
port: 4444
};ini harus memberi kita hasil seperti ini:
Nota: Dengan pembebasan Firefox 47, versi FirefoxDriver berasaskan sambungan telah berhenti berfungsi. Ini telah ditetapkan dalam Firefox 47.1 dan Selenium 2.53.1. Untuk menjalankan ujian menggunakan penyemak imbas yang berbeza, periksa wiki projek.
Perkara terakhir yang boleh kita lakukan adalah untuk mengelakkan mengakses binari malam setiap kali, buat skrip NPM kecil sebagai alias dalam: package.json
var DEFAULT_CONFIGURATION = {
launch_url: 'http://localhost',
selenium_port: 4444,
selenium_host: 'localhost',
desiredCapabilities: FIREFOX_CONFIGURATION
};
var ENVIRONMENTS = {
default: DEFAULT_CONFIGURATION
};Meningkatkan Ujian Nightwatch
Mempunyai banyak ujian fungsional menghasilkan banyak maklumat pendua, yang membuat penyelenggaraan (ya, suite ujian juga memerlukan penyelenggaraan). Untuk mengelakkan ini, kita boleh menggunakan objekobjek .
Di dunia ujian akhir-ke-akhir, pendekatan objek halaman adalah corak popular yang melibatkan pembungkus halaman (atau fragmen halaman) ke objek. Matlamatnya adalah untuk abstrak HTML yang mendasari dan konfigurasi biasa untuk memudahkan senario.bernasib baik, Nightwatch mempunyai cara mudah untuk mengendalikan objek halaman. Perkara pertama yang perlu kita lakukan ialah menambah pilihan
ke konfigurasi. Saya fikir page_objects_path masuk akal; tests/pages
var FIREFOX_CONFIGURATION = {
browserName: 'firefox',
javascriptEnabled: true,
acceptSslCerts: true
}; dalam folder ini. Nama fail akan digunakan sebagai kunci untuk mengambil semua konfigurasi yang ditentukan dalam fail ini, jadi saya cadangkan memberikan nama yang bermakna. login.js
<code>your_project/ | |– bin/ | |– selenium-server-standlone-2.53.1.jar | |– tests/ | |– login.js | |- nightwatch.conf.js `– package.json</code>
yang ditakrifkan dalam konfigurasi persekitaran. Dengan cara ini, objek halaman kami tidak mempunyai konteks dan ia berfungsi tanpa mengira persekitaran. launchUrl
Mengubah ujian kami untuk menggunakan objek halaman kini sangat mudah. Pertama, kita perlu mengambil halaman dari objek halaman melalui klien. Setiap objek halaman didedahkan sebagai fungsi yang dinamakan selepas nama fail objek halaman (mis. login()
untuk menunjukkan bahawa kami merujuk kepada nama tersuai. Itu sahaja. @
npm install --save-dev nightwatch
Perhatikan bagaimana kami menamatkan sesi pada klien itu sendiri, bukan pada halaman.
Menggunakan pelbagai persekitaran
Keupayaan untuk menjalankan ujian fungsional dalam persekitaran yang berbeza sangat berguna untuk memastikan kerja tempatan tidak memecahkan sebarang laluan pengguna, atau persekitaran pementasan dan pengeluaran berfungsi dengan cara yang sama.Untuk menjalankan ujian dalam persekitaran tertentu, kita boleh menggunakan pilihan
di CLI. Apabila kita menghilangkan pilihan ini, persekitaran lalai (sudah dalam konfigurasi kita) akan digunakan. --env
<code>your_project/ | |– bin/ | |– selenium-server-standalone-2.53.1.jar | `– package.json</code>
akan berubah mengikut persekitaran. launch_url
var SELENIUM_CONFIGURATION = {
start_process: true,
server_path: 'bin/selenium-server-standalone-2.53.0.jar',
host: '127.0.0.1',
port: 4444
};
var FIREFOX_CONFIGURATION = {
browserName: 'firefox',
javascriptEnabled: true,
acceptSslCerts: true
};
var DEFAULT_CONFIGURATION = {
launch_url: 'http://localhost',
selenium_port: 4444,
selenium_host: 'localhost',
desiredCapabilities: FIREFOX_CONFIGURATION
};
var ENVIRONMENTS = {
default: DEFAULT_CONFIGURATION
};
module.exports = {
src_folders: ['tests'],
selenium: SELENIUM_CONFIGURATION,
test_settings: ENVIRONMENTS
};Ringkasan
mari kita meringkaskan semua ini. Nightwatch.js adalah rangka kerja JavaScript untuk menulis ujian fungsi akhir-ke-akhir. Ia bergantung pada API Webdriver Selenium dan dapat menjalankan pelayar yang berbeza secara automatik.Ujian menulis terutamanya melibatkan menentukan senario pengguna biasa. Untuk tujuan ini, terdapat API yang mudah tetapi sangat lengkap.
dari sini saya akan menyerahkannya kepada anda dan menggalakkan anda untuk mula menulis ujian fungsional untuk projek terbesar anda untuk memastikan anda tidak pernah memecahkan ciri pengguna lagi!
Nightwatch.js FAQ (FAQ)
Apakah tujuan utama nightwatch.js dalam ujian JavaScript?bagaimana nightwatch.js berbanding dengan kerangka ujian JavaScript yang lain?
bolehkah nightwatch.js digunakan untuk ujian akhir-ke-akhir?
nightwatch.js menggunakan mekanisme panggilan balik mudah untuk mengendalikan ujian tak segerak. Setiap arahan ujian di nightwatch.js berjalan secara asynchronously dalam urutan yang ditetapkan. Pelari ujian menunggu setiap arahan selesai sebelum meneruskan dengan arahan seterusnya. Ini memastikan bahawa semua arahan dilaksanakan dalam urutan yang betul, walaupun mereka tidak segerak.
Ya, nightwatch.js boleh digunakan dengan perpustakaan ujian lain. Ia direka untuk bekerja dengan lancar dengan perpustakaan lain seperti Mocha, Jasmine, dan Qunit. Ini membolehkan anda memanfaatkan pelbagai perpustakaan ujian untuk membuat suite ujian yang komprehensif untuk aplikasi web anda.
Menyediakan Nightwatch.js termasuk beberapa langkah. Pertama, anda perlu memasang Node.js dan NPM pada mesin anda. Anda kemudian boleh memasang Nightwatch.js menggunakan NPM. Selepas pemasangan selesai, anda perlu membuat fail konfigurasi untuk nightwatch.js di mana anda menentukan tetapan dan pilihan ujian anda. Selepas itu, anda boleh mula menulis ujian.
Ya, nightwatch.js menyokong ujian silang penyemak imbas. Ia mengintegrasikan dengan lancar dengan Selenium WebDriver, alat untuk pelayar automatik. Ini bermakna anda boleh menulis ujian yang boleh dijalankan pada pelbagai pelayar menggunakan Nightwatch.js untuk memastikan aplikasi web anda berfungsi dengan baik pada platform yang berbeza.
nightwatch.js menyediakan beberapa pilihan ujian debugging. Anda boleh menggunakan debugger terbina dalam node.js atau menggunakan alat luaran seperti Chrome Devtools. Nightwatch.js juga menyediakan mesej ralat terperinci dan jejak timbunan untuk memudahkan untuk mengenal pasti dan menyelesaikan masalah apabila ujian gagal.
Walaupun nightwatch.js terutamanya digunakan untuk ujian web, ia juga boleh digunakan untuk ujian mudah alih dengan mengintegrasikan dengan Appium, kerangka ujian mudah alih yang popular. Ini membolehkan anda menulis ujian untuk aplikasi mudah alih menggunakan sintaks dan alat yang sama seperti ujian web.
nightwatch.js secara asli menyokong pelaksanaan ujian selari. Anda boleh menentukan ujian untuk dijalankan selari dalam fail konfigurasi. Apabila anda menjalankan ujian, nightwatch.js secara automatik menyerahkan ujian kepada pelbagai program pekerja, mempercepat masa pelaksanaan ujian keseluruhan.
Output mengekalkan pemformatan dan penempatan imej asal.
Atas ialah kandungan terperinci Ujian Fungsi JavaScript dengan Nightwatch.js. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Bolehkah saya mendapatkan semula video pendek Douyin yang dipadamkan?
Apakah yang perlu saya lakukan jika chaturbate tersekat?
Pengenalan kepada penggunaan rowid dalam oracle
Perisian penilaian pelayan
sambungan jauh mstsc gagal
Apakah kaedah membina tapak web mudah alih?
Bagaimana untuk mendapatkan masa semasa dalam JAVA
Apa yang perlu dilakukan jika penggunaan memori terlalu tinggi
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
