Komponen LWC - Bagaimana cara menguji metode kelas komponen secara terpisah?

Dec 04 2020

Apakah mungkin untuk menguji metode di kelas yang meluas LightningElement(misalnya komponen LWC) dalam isolasi?

Dengan kata lain, menurut saya akan lebih efektif waktu jika hanya membuat instance dari kelas komponen menggunakan new MyComponent()dan kemudian menguji metode instance. Dengan kata lain, pengujian unit JavaScript biasa standar, bukan pengujian tingkat DOM.

Bukannya saya tidak melihat nilai dalam pengujian tingkat DOM, tetapi banyak logika dalam komponen LWC yang tidak terkait dengan DOM, dan sulit untuk mengujinya melalui DOM.

Apakah ini masalah meletakkan logika non-DOM di kelas yang kemudian diimpor ke komponen?

Terima kasih.

Jawaban

3 TrevorBliss Dec 04 2020 at 03:05

Seperti yang disebutkan di akhir posting, taruhan terbaik Anda adalah menarik logika itu ke file terpisah dan mengimpornya ke komponen Anda serta langsung ke pengujian unit.

Contoh yang bagus dari itu dalam proyek lwc-recpies adalah pustaka mortgage.js yang memiliki pengujiannya sendiri (tidak ada komponen yang terlibat), dan diimpor ke komponen miscSharedJavascript untuk digunakan. Tes miscSharedJavascript kemudian dapat memilih untuk meniru panggilan hipotek jika diinginkan.

Perhatikan juga dengan contoh di atas, logika yang ditarik dari komponen tidak perlu berada dalam folder terpisah dan dapat berupa file Javascript lokal dalam bundel komponen.

1 MatthewSouther Dec 04 2020 at 07:08

Dalam satu LWC yang sangat berat, saya mengeluarkan logika non-DOM ke helper.jsfile terpisah dalam bundel komponen, yang saya uji langsung dengan Jest.

Jawaban StackExchange ini menjelaskan di mana saya meletakkan file tersebut dan bagaimana saya melipatnya ke dalam kelas komponen utama.