測(cè)試JavaScript是一件很痛苦的事情。很多工具、技術(shù)和框架已經(jīng)被開(kāi)發(fā)出來(lái)，以使這個(gè)過(guò)程盡可能的不痛苦。其中一些工具如Mocha、Jasmine和Jest提供了一個(gè)測(cè)試結(jié)構(gòu)，而其他一些工具如Istanbul和Blanket也會(huì)生成代碼覆蓋報(bào)告。在瀏覽器中測(cè)試JavaScript代碼的不同方法有不同的前景和后果。很難將范圍縮小到一個(gè)工具或技術(shù)上，來(lái)解決所有的問(wèn)題!

讓我們快速了解一下在瀏覽器中測(cè)試JavaScript代碼的一些最流行的方法:

1. JSFiddle

    無(wú)論你是使用JavaScript還是React和Vue等框架，JSFiddle都是適合你的工具。它是一個(gè)在線工具，可以在瀏覽器中編寫(xiě)和測(cè)試JavaScript代碼。它在2009年作為 "Mooshell "推出。如果你正在開(kāi)發(fā)一個(gè)網(wǎng)絡(luò)應(yīng)用程序并使用任何類型的JavaScript庫(kù)，那么JSFiddle是值得一看的東西。它的界面非常簡(jiǎn)單，你只需要輸入一些JavaScript，甚至添加一些HTML和CSS，就可以立即看到結(jié)果。在使用JSFiddle將你的JavaScript代碼片段添加到你的項(xiàng)目中之前，先對(duì)它們進(jìn)行測(cè)試!

2. 跨瀏覽器測(cè)試工具

    盡管你可以很容易地使用JSFiddle和CodePen等工具來(lái)測(cè)試你的JavaScript代碼，但這些工具不會(huì)顯示你的代碼在不同瀏覽器或移動(dòng)瀏覽器中的輸出情況。如果你想測(cè)試你的代碼的跨瀏覽器兼容性，你需要使用LambdaTest這樣的在線跨瀏覽器測(cè)試工具。它可以實(shí)現(xiàn)實(shí)時(shí)互動(dòng)的瀏覽器測(cè)試，自動(dòng)截圖測(cè)試，響應(yīng)式布局測(cè)試，以及智能視覺(jué)UI測(cè)試。該工具將大大加快你的測(cè)試周期，并幫助你解決代碼中的特定瀏覽器問(wèn)題。

3. Karma + Jasmine + Google Chrome

Karma是一個(gè)讓你在瀏覽器中測(cè)試JavaScript代碼的工具，有很多測(cè)試目的。然而，它并不測(cè)試代碼本身。它執(zhí)行代碼，但依靠第三方庫(kù)如Jasmine和Mocha進(jìn)行測(cè)試。除此以外，它還需要一個(gè)真正的瀏覽器。因此，谷歌瀏覽器必須安裝在你的本地機(jī)器上，這種方法的JavaScript才能發(fā)揮作用。它在無(wú)頭模式下啟動(dòng)谷歌瀏覽器進(jìn)行操作。

4. CodePen

CodePen是最好的在線工具之一，可以在線測(cè)試你的HTML、CSS和JavaScript代碼。這個(gè)開(kāi)發(fā)者社區(qū)有很多東西要教! 這個(gè)開(kāi)源的學(xué)習(xí)環(huán)境可能有可能是最大的開(kāi)發(fā)者社區(qū)，有高達(dá)33萬(wàn)的注冊(cè)用戶在不斷努力開(kāi)發(fā)驚人的前端應(yīng)用程序。它是建立和部署網(wǎng)站、向世界展示你的工作和建立測(cè)試案例的最佳平臺(tái)之一。

5. JSBin

JSBin是JSFiddle的一個(gè)整潔的替代品。如果你想要一個(gè)更容易理解和不那么雜亂的界面，那么JSBin就是你要的工具。該平臺(tái)有一個(gè)免費(fèi)和一個(gè)專業(yè)的訪問(wèn)權(quán)限。對(duì)于像私有倉(cāng)和無(wú)限制的Dropbox同步這樣的高級(jí)功能，你需要使用專業(yè)版，然而，你可以使用JSBin的一般訪問(wèn)權(quán)限輕松地測(cè)試HTML、CSS和JavaScript的任何組合。

6. Liveweave

Liveweave是另一個(gè)編碼游樂(lè)場(chǎng)，你可以在那里測(cè)試你的JavaScript代碼。它具有實(shí)時(shí)預(yù)覽功能，并配備了一個(gè)標(biāo)尺來(lái)幫助你進(jìn)行響應(yīng)式設(shè)計(jì)。它的HTML、CSS和JavaScript的代碼提示功能使初學(xué)者很容易輸入代碼。除此之外，你可以使用Liveweave將你的項(xiàng)目下載為一個(gè).zip文件，還可以在你的代碼中很容易地添加和使用外部庫(kù)，如jQuery、AngularJS、Bootstrap等。

7、chrome下的console下直接寫(xiě)代碼

針對(duì)DOM操作用chrome瀏覽器直接測(cè)試比較簡(jiǎn)單快捷，這也是腳本之家的技術(shù)們最愛(ài)干的事了。

這些是在瀏覽器中測(cè)試你的JavaScript代碼的一些最流行的方法。除此以外，你甚至還可以使用CSSDeck和Dabblet這樣的工具。這些都是同樣好的，而且很容易使用。除此之外，F(xiàn)irebug和Chrome開(kāi)發(fā)者工具都有Javascript控制臺(tái)，你可以在那里輸入JavaScript代碼進(jìn)行執(zhí)行。這同樣適用于Internet Explorer 8+、Opera、Safari和可能的許多其他現(xiàn)代瀏覽器。

到此這篇關(guān)于在瀏覽器測(cè)試JavaScript的方法小結(jié)的文章就介紹到這了,更多相關(guān)瀏覽器測(cè)試js內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評(píng)論