Hide_XHR

https://dev.to/samelawrence/muting-noisy-xhr-logs-in-cypress-4495

Hide_XHR

每次Debug Cypress 都會顯示一大堆XHR 導致關鍵的資訊都無法值觀的顯示

成果展示

情境

展示

綠框是一堆xhr資訊都不是我想看得

100-Projects/E2E/resource/Hide_XHR.png

設定之後變成

100-Projects/E2E/resource/Hide_XHR-1.png

設定

support下建立 index.js並加入以下程式碼

if (Cypress.env('hideXHR')) {

    const app = window.top;

    if (!app.document.head.querySelector('[data-hide-command-log-request]')) {

      const style = app.document.createElement('style');
      style.innerHTML =
        '.command-name-request, .command-name-xhr { display: none }';
    }
  }

修改e2e.js,把index.js加入

import './commands'
import './index' // 加入這行

在跟目錄加入 cypress.env.js

{
"hideXHR": true
}

tips

設定完成之後需要重新啟動才會生效唷。