javascript - Untuk apa ujian automatik bahagian hadapan?

Question

Saya sering menggunakan Vue cli untuk membina projek
tetapi saya tidak pernah memahaminya

? Vue build standalone
? Install vue-router? Yes
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Airbnb
? Setup unit tests with Karma + Mocha? Yes      这个？
? Setup e2e tests with Nightwatch? Yes            这个是干嘛的？

Apakah ujian unit dan apakah ujian e2e? ? Apakah yang perlu saya lakukan semasa menulis kod? ?

Answer 1

Dari perspektif keperluan, saya fikir tidak menguji adalah seperti memandu melalui lampu merah Kemalangan mungkin tidak semestinya berlaku, tetapi apabila jumlah kod menjadi lebih besar dan lebih besar, dan jarak memandu semakin lama, kemalangan akan berlaku. satu hari.

Jika anda mempunyai projek:

function Swiper (el, options) {
    if (typeof el === 'string') {
        this.el = document.getElementById(el)
    } else {
        this.el = el
    }
    console.log('a swiper is created')
}

Ujian unit

Kandungan: Uji unit dalam projek anda. Fungsi boleh menjadi unit, dan submodul boleh menjadi unit

Tujuan: Automasi, memacu anda ke reka bentuk yang lebih baik (contohnya, anda akan mendapati sukar untuk menulis ujian unit untuk kod berganding tinggi), tanpa menjadi penyangak

Jika tiada perpustakaan ujian dan saya ingin menguji kod di atas, saya mungkin melakukan ini:

1. Tulis demo.html dan perkenalkan kod di atas

2. Uji instantiasi id elemen yang diluluskan

3. Uji instantiasi elemen yang diluluskan itu sendiri

4. Uji fungsi swiper

yang lain

5. Dan yang terbaik adalah console.log sesuatu pada konsol untuk memberitahu saya perkara yang sedang diuji dan apakah keputusan ujian

Rangka kerja ujian membantu anda menyelesaikan proses di atas, mengklasifikasikan kes ujian, kemajuan output, keputusan ujian, memberikan laporan, dsb. Seperti mocha

Pustaka assertion membolehkan anda melakukan apa sahaja kecuali ===之外，有很多其他手段去做比较，而且可读性很强，比如：this.obj.should.have.property('id').which.is.a.Number().

Perpustakaan berkaitan termasuk: chai, should.js, superagent yang pakar dalam menguji http, dll.

Lihat cara menulis ujian unit dalam kod sumber Vue:

Karma ialah alat ujian yang membolehkan kod anda diuji dalam persekitaran penyemak imbas. Sebab mengapa ia diperlukan ialah kod anda mungkin direka untuk dilaksanakan pada bahagian penyemak imbas, dan beberapa pepijat mungkin tidak terdedah apabila diuji dalam persekitaran nod Selain itu, jika penyemak imbas mempunyai masalah keserasian, karma menyediakan cara untuk jalankan kod anda secara automatik pada berbilang penyemak imbas Jalankan dalam persekitaran (chrome, firefox, ie, dll.). Jika kod anda hanya akan dijalankan pada bahagian nod, maka anda tidak perlu menggunakan karma.

Liputan

Tujuan ujian unit adalah untuk membahagikan projek anda kepada unit kecil Dalam setiap ujian unit, cuba reka bentuk kes untuk menjalankan setiap cabang logik kod, supaya apabila semua ujian unit dijalankan, setiap baris kod dalam projek. Sebaiknya jalankan sekali sahaja, iaitu kadar liputan hendaklah sehampir 100% yang mungkin.

Jika anda hanya menguji kod Swiper di atas: new Swiper(document.getElement('mountNode'))的情况的话，那么覆盖率就只有50%，所以要补上new Swiper('mountNode')Jalankan cawangan lain untuk ujian unit.

Untuk projek kecil, tidak sukar untuk mempertimbangkan semua cawangan, tetapi untuk projek seperti Vue, mencapai liputan 100% terasa sangat tidak normal.

Alat:istanbul

Ujian E2E

Ujian hujung ke hujung terutamanya untuk menguji perniagaan Dalam kebanyakan kes, ini bermakna melakukan operasi tertentu pada tapak web tertentu pada penyemak imbas, seperti log masuk.

Ambil contoh laman utama jam malam:

Saya tidak menggunakan jam malam, tetapi mudah untuk melihat bahawa ini sedang menguji proses log masuk dari hujung ke hujung ke Google dan memasukkan kata kunci untuk mencari perniagaan. Anda boleh melihat bahawa perpustakaan ini menyediakan banyak fungsi untuk mensimulasikan operasi manusia pada halaman, dengan itu menggantikan operasi input klik manusia untuk melengkapkan ujian E2E automatik.

Anda juga boleh melihat ujian E2E dalam projek Vue yang sedang diuji:

Adakah anda biasa dengan ini? Ini sedang menguji beberapa contoh di tapak web rasmi, kerana halaman itu adalah perniagaan Vue.

Realiti

Phoenix Legend: Ujian bukanlah apa yang anda mahu tulis, anda boleh menulis jika anda mahu~

Ujian menulis mengambil banyak masa, dan mungkin mengambil masa lebih lama daripada menulis kod projek Selain itu, jika kod projek berubah, ujian mesti diubah suai. Oleh itu, kebanyakan syarikat domestik tidak mempunyai persekitaran untuk pembangun menulis ujian, dan hanya bergantung pada penguji untuk memastikan kualiti perisian. Jika anda berada dalam syarikat yang memerlukan anda menulis ujian dengan tekun, sila hargainya.

Pengujian boleh menambah baik reka bentuk, baca buku dipacu ujian Martin Fowler.