Ujian Angular: Pengenalan Pemaju

Panduan ini meneroka ujian automatik dalam 5 projek sudut, meliputi unit dan ujian akhir-ke-akhir. Keupayaan ujian terbina dalam Angular, boleh diakses melalui CLI sudut atau projek permulaan cepat, adalah pusat.

Panduan ini memberikan pemahaman asas. Rawatan yang komprehensif memerlukan sumber yang lebih panjang.

Konsep Utama:

• Fundamental Ujian Angular: Projek Angular 5 termasuk ciri ujian automatik menggunakan CLI sudut atau permulaan cepat.
Teknologi ujian:
• (mengkonfigurasi modul ujian), melati (ujian menulis), karma (pelaksanaan ujian pelayar), dan protractor (ujian akhir-ke-akhir) adalah teknologi utama. Komponen Ujian Unit Ujian: TestBed Komponen diuji secara berasingan atau dalam persekitaran sudut untuk menilai interaksi templat dan ketergantungan.
dan utiliti asynchronous memudahkan ini.
• Ujian dengan kebergantungan: TestBed Untuk komponen yang bergantung kepada komponen, perkhidmatan, atau modul lain,
memerlukan perkhidmatan mengejek atau skema seperti
• untuk pengasingan. TestBed Ujian akhir-ke-akhir: NO_ERRORS_SCHEMA Protractor mensimulasikan tindakan pengguna dalam penyemak imbas sebenar, mengesahkan fungsi aplikasi.
• liputan kod: alat seperti Karma's
menghasilkan laporan yang menunjukkan tahap liputan ujian.
• Alat Tambahan: coverageIstanbulReporter
(kod linting) dan Kod Visual Studio (Pengeditan Kod Pintar) Meningkatkan Kualiti Kod dan Konsistensi.
• Prasyarat: ng lint pemahaman kuat dari 4 fundamental dan kebiasaan dengan konsep ujian automatik diandaikan. Panduan ini menggunakan sudut 5.2. Contoh kod tersedia (pautan ke repositori GitHub akan pergi ke sini).

Teknologi ujian:

• utiliti ujian sudut: Kelas dan fungsi untuk persekitaran ujian bangunan (terutamanya TestBed untuk mengkonfigurasi modul ujian). Contoh:

TestBed.configureTestingModule({
  imports: [ RouterTestingModule ],
  declarations: [ DashboardComponent ],
  schemas: [ NO_ERRORS_SCHEMA ],
  providers: [
    {
      provide: HeroService,
      useClass: MockHeroService
    }
  ],
})
.compileComponents();

• Jasmine: Rangka kerja ujian menggunakan notasi yang didorong oleh tingkah laku. Contoh:

describe('createCustomer', () => {
  it('should create new customer', (customer) => {
    // ...assertions...
  });
  // ...more tests...
});

• karma: Melaksanakan ujian dalam persekitaran penyemak imbas, memaparkan hasil dalam baris arahan dan penyemak imbas. Konfigurasi adalah dalam karma.conf.js. Contoh coretan konfigurasi:

module.exports = function (config) {
  config.set({
    // ...configuration details...
    browsers: ['Chrome'],
    // ...more configuration...
  });
};

• Protractor: Rangka kerja ujian akhir-ke-akhir untuk sudut, meniru interaksi pengguna dalam penyemak imbas sebenar. Konfigurasi berada di protractor.conf.js.

Ujian unit:

Running ng test Melaksanakan ujian. Panduan kemudian memperincikan bagaimana untuk menangani isu -isu biasa seperti komponen ujian dengan dependensi (komponen lain, modul, perkhidmatan) menggunakan teknik seperti mengejek atau NO_ERRORS_SCHEMA. Contohnya menunjukkan cara menguji komponen yang menggunakan FormsModule dan RouterTestingModule. Komponen ujian yang menggunakan perkhidmatan ditangani, menunjukkan penciptaan perkhidmatan mengejek untuk mengasingkan ujian unit.

Ujian Perkhidmatan: Panduan menyediakan contoh menguji perkhidmatan yang berinteraksi dengan HttpClientModule, menggunakan HttpTestingController untuk mengawal permintaan dan respons, mewujudkan pelbagai senario ujian.

Ujian akhir-ke-akhir:

Panduan memperkenalkan ujian akhir-ke-akhir dengan protractor, menunjukkan cara membuat fungsi penolong (mis., Dalam ) dan tulis ujian E2E (mis. ). Contoh menunjukkan navigasi ujian dan mengesahkan teks yang dipaparkan. app.po.ts app.e2e-spec.ts

liputan kod:

Panduan menerangkan cara menjana laporan liputan kod menggunakan

, dan bagaimana untuk mengkonfigurasi ambang liputan dalam . ng test --watch=false --code-coverage karma.conf.js

Utiliti tambahan: Panduan ini mengesyorkan menggunakan

untuk kod linting dan kod studio visual untuk ciri pengeditan kod pintarnya (Intellisense, ralat menonjolkan, sambungan sudut). Manfaat integrasi berterusan (CI) juga disebutkan.

Apabila menulis ujian: Panduan ini menyimpulkan dengan membincangkan apabila sesuai untuk menulis ujian (selepas prototaip, dengan pembiayaan yang mencukupi) dan manfaat pembangunan yang didorong oleh ujian (TDD). Ia menekankan pentingnya ujian untuk aplikasi siap pengeluaran. Seksyen Soalan Lazim menangani soalan umum mengenai ujian sudut.

Atas ialah kandungan terperinci Ujian Angular: Pengenalan Pemaju. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!