iTesting，愛測試，愛分享

發(fā)現(xiàn)已經(jīng)3個多月沒更新了。差點(diǎn)忘記我還有公眾號這個事兒了，不過你們懂的，蔡老師絕對不會讓粉絲們失望。先賣個關(guān)子，準(zhǔn)備迎接我?guī)淼男◇@喜吧：）

轉(zhuǎn)眼之間，你不知道的Cypress系列已經(jīng)到第10篇了。在Cypress中國群內(nèi)、在公眾號iTesting里，我每天都能看到大量關(guān)于Cypress的使用討論和私下問詢。這讓我感到無比榮幸（買了書的同學(xué)們，公眾號回復(fù)你的微信號，拉你到Cypress中國群）。

今天是. 你不知道的Cypress系列（10） -- CypressHelper。

這是IDE VS Code的Cypress插件，可以用來幫助我們更好的使用Cypress進(jìn)行編碼，不是我主動發(fā)現(xiàn)的，是Cypress中國(3)群的一位同學(xué)主動分享的，為他點(diǎn)贊。

”Cypress編寫代碼“的痛點(diǎn)

當(dāng)前在使用Cypress進(jìn)行UI自動化測試中，存在如下痛點(diǎn)：

1. 無法直接通過點(diǎn)擊的方式直達(dá)自定義的函數(shù)。
2. 如使用Fixture，需要手工填寫路徑，無法自動現(xiàn)完成。
3. 無法查找一個函數(shù)有幾處定義，有多少引用。
4. 不知道有哪些別名可以用。

這些問題的存在影響了測試效率，現(xiàn)發(fā)現(xiàn)CypressHelper插件可有效解決這個問題，分享如下。

CypressHelper安裝配置

當(dāng)前使用CypressHelper需要在Visual Studio Code中提前安裝。方式如下：

打開VS Code --> Extensions， 在搜索框搜CypressHelper

安裝好后，點(diǎn)擊”配置“圖標(biāo)，選擇”Extension Settings“。

正常情況下，你就可以使用了。例如你想一鍵直達(dá)Custom Commands函數(shù)的定義位置，使用方式如下：

找到你定義的Custom Commands，然后右鍵選擇”Cypress: Go to Custom Command Definition“ 即可直達(dá)代碼定義處。

但這是默認(rèn)的情況，大部分時(shí)候，你的測試框架應(yīng)該都是進(jìn)行了定制（例如你Cypress文件夾改成了src文件夾），可能更改了Cypress文件的默認(rèn)位置，這時(shí)，你就要進(jìn)行配置。

點(diǎn)擊”配置“圖標(biāo)，選擇”Extension Settings“，在設(shè)置菜單里找到如下選項(xiàng)，并進(jìn)行設(shè)置。

設(shè)置完后即可使用。

CypressHelper還提供了其他功能，均已Cypress：開頭，大家可以自己嘗試看看。我就不再贅述。官方鏈接：https://marketplace.visualstudio.com/items?itemName=Shelex.vscode-cy-helper。

這篇文章沒有一點(diǎn)技術(shù)含量，但是卻實(shí)際解決了很多問題，提高了測試生產(chǎn)率，其實(shí)有時(shí)候想想，日常測試工作也是如此，并不是每天都要高大上，框架，k8s，云原生，亂七八糟整，不見得能提高多少測試效率。反而最平常的小事能起到大作用。比如：你每天開個早會溝通下今日待作事項(xiàng)，優(yōu)先級排列下，一天下來發(fā)現(xiàn)做掉了2天的事兒。又比如，你發(fā)現(xiàn)測試流程很多不順暢的地方，測試文檔總找不到，周末自己理一下，下周效率馬上提高了。

預(yù)告一下：我又回來了，后續(xù)回復(fù)周期性更新，咱們Cypress這個系列還沒更新完畢，敬請期待！

Cypress有很多奇淫巧技，我已經(jīng)總結(jié)超過百篇

別走開，下一篇更精彩！

往期回看：