diff --git a/nezha-fronted/src/components/charts/chart-alert-list.vue b/nezha-fronted/src/components/charts/chart-alert-list.vue
index 5b52219f9..7f0401e06 100644
--- a/nezha-fronted/src/components/charts/chart-alert-list.vue
+++ b/nezha-fronted/src/components/charts/chart-alert-list.vue
@@ -61,7 +61,7 @@
           <div slot="title">
             <span class="nz-dialog-title">{{data.title}}</span>
             <div class="float-right panel-calendar dialog-tool">
-              <pick-time :refresh-data-func="dateChange" v-model="searchTime" :show-time-picker="false" :use-chart-unit="false" ref="pickTime" style="height: 28px;"></pick-time>
+              <pick-time :refresh-data-func="dateChange" v-model="searchTime" :show-time-picker="false" :use-chart-unit="false" ref="pickTime" style="height: 28px;" id="alert-chart"></pick-time>
             </div>
 <!--            <span class="float-right  dialog-tool" @click="screenRefreshChart"><i class="global-active-color nz-icon nz-icon-refresh"/></span>-->
           </div>
@@ -84,7 +84,7 @@
             <div class="upload-body">
               <el-input type="textarea" :placeholder="$t('alert.description')" v-model="deleteBox.remark"></el-input>
               <div style="text-align: right; margin-top: 10px;">
-                <button @click="closeDialog" class="el-button el-button--default el-button--small">
+                <button @click="closeDialog" class="el-button el-button--default el-button--small" >
                   <span>{{$t('tip.no')}}</span>
                 </button>
                 <button @click="deleteMessage" class="el-button el-button--default el-button--small el-button--primary">
@@ -104,7 +104,7 @@
           <div slot="title">
             {{$t("project.endpoint.dialogTitle")}}
             <div class="float-right panel-calendar dialog-tool" style="display: flex">
-              <pick-time :refresh-data-func="queryChartDate" :use-refresh="true" :use-chart-unit="false" v-model="searchTime" style="height: 28px;" @unitChange="chartUnitChange"></pick-time>
+              <pick-time :refresh-data-func="queryChartDate" :use-refresh="true" :use-chart-unit="false" v-model="searchTime" style="height: 28px;" @unitChange="chartUnitChange" id="alert-sub-chart"></pick-time>
             </div>
           </div>
           <chart ref="messageChart" name="alertMessageChart" :unit="chartUnit" ></chart>
diff --git a/nezha-fronted/src/components/charts/chart-single-stat.vue b/nezha-fronted/src/components/charts/chart-single-stat.vue
index 7e194167e..f162e3e03 100644
--- a/nezha-fronted/src/components/charts/chart-single-stat.vue
+++ b/nezha-fronted/src/components/charts/chart-single-stat.vue
@@ -54,7 +54,7 @@
             <span class="nz-dialog-title">{{data.title}}</span>
             <div class="float-right panel-calendar dialog-tool">
 <!--              <time-picker ref="calendarPanel" class="nz-dashboard-picker" style="margin-top: -12px;" @change="dateChange"></time-picker>-->
-              <pick-time :refresh-data-func="dateChange" v-model="searchTime" :use-chart-unit="false" ref="pickTime" style="height: 28px;"></pick-time>
+              <pick-time :refresh-data-func="dateChange" v-model="searchTime" :use-chart-unit="false" ref="pickTime" style="height: 28px;" id="single-chart"></pick-time>
             </div>
 <!--            <span class="float-right  dialog-tool" @click="screenRefreshChart" style="margin-right: 15px"><i class="global-active-color nz-icon nz-icon-refresh"/></span>-->
           </div>
diff --git a/nezha-fronted/src/components/charts/chart-table.vue b/nezha-fronted/src/components/charts/chart-table.vue
index 0cb2d9a67..6910714e6 100644
--- a/nezha-fronted/src/components/charts/chart-table.vue
+++ b/nezha-fronted/src/components/charts/chart-table.vue
@@ -82,7 +82,7 @@
             <div class="float-right panel-calendar dialog-tool">
 <!--              <time-picker ref="calendarPanel" class="nz-dashboard-picker" style="margin-top: -12px;"-->
 <!--                           @change="dateChange"></time-picker>-->
-              <pick-time :refresh-data-func="dateChange" v-model="searchTime" :use-chart-unit="false" ref="pickTime" style="height: 28px;"></pick-time>
+              <pick-time :refresh-data-func="dateChange" v-model="searchTime" :use-chart-unit="false" ref="pickTime" style="height: 28px;" id="table-chart"></pick-time>
             </div>
 <!--            <span class="float-right  dialog-tool" @click="screenRefreshChart" style="margin-right: 15px"><i class="global-active-color nz-icon nz-icon-refresh"/></span>-->
           </div>
diff --git a/nezha-fronted/src/components/charts/chartPreview.vue b/nezha-fronted/src/components/charts/chartPreview.vue
index c7d2aa200..c7b186993 100644
--- a/nezha-fronted/src/components/charts/chartPreview.vue
+++ b/nezha-fronted/src/components/charts/chartPreview.vue
@@ -60,7 +60,7 @@
         <div class="float-right panel-calendar dialog-tool"  v-if="chart.type!=='url' && chart.type !=='alertList'">
 
 <!--          <time-picker ref="calendarPanel" class="nz-dashboard-picker" style="margin-top: -12px;" @change="dateChange" v-if="chart.type !='text'"></time-picker>-->
-          <pick-time :refresh-data-func="dateChange" v-model="searchTime" :use-chart-unit="false" ref="pickTime" style="height: 28px;"></pick-time>
+          <pick-time :refresh-data-func="dateChange" v-model="searchTime" :use-chart-unit="false" ref="pickTime" style="height: 28px;" id="chart-preview"></pick-time>
           <!--
           <el-date-picker ref="calendar" prefix-icon=" " size="mini" class="nz-preview-picker"
                           format="yyyy/MM/dd HH:mm"
diff --git a/nezha-fronted/src/components/charts/line-chart-block.vue b/nezha-fronted/src/components/charts/line-chart-block.vue
index 5c9a5d530..c51104dd7 100644
--- a/nezha-fronted/src/components/charts/line-chart-block.vue
+++ b/nezha-fronted/src/components/charts/line-chart-block.vue
@@ -131,7 +131,7 @@
             <div class="float-right panel-calendar dialog-tool">
 
 <!--              <time-picker ref="calendarPanel" class="nz-dashboard-picker" style="margin-top: -12px;"  @change="dateChange"></time-picker>-->
-              <pick-time :refresh-data-func="dateChange" v-model="searchTime" :use-chart-unit="false" ref="pickTime" style="height: 28px;"></pick-time>
+              <pick-time :refresh-data-func="dateChange" v-model="searchTime" :use-chart-unit="false" ref="pickTime" style="height: 28px;" id="line-chart"></pick-time>
             </div>
 <!--            <span class="float-right  dialog-tool" @click="screenRefreshChart" style="margin-right: 15px"><i class="global-active-color nz-icon nz-icon-refresh"/></span>-->
           </div>
diff --git a/nezha-fronted/src/components/common/alert/alertMessageTable.vue b/nezha-fronted/src/components/common/alert/alertMessageTable.vue
index b78b402a1..2201293e7 100644
--- a/nezha-fronted/src/components/common/alert/alertMessageTable.vue
+++ b/nezha-fronted/src/components/common/alert/alertMessageTable.vue
@@ -6,6 +6,7 @@
     <!-- 自定义table列 -->
     <transition name="el-zoom-in-top">
       <element-set
+        :id="projectAlertId+'-element-set'"
         v-if="tools.showCustomTableTitle"
         @close="tools.showCustomTableTitle = false"
         :custom-table-title.sync="tools.customTableTitle"
@@ -232,6 +233,7 @@
     },
     mixins:[bus],
     props:{
+      id:String,
       tableData:{},
       loading:{},
       tableHeight:{},
diff --git a/nezha-fronted/src/components/common/bottomBox/bottomBox.vue b/nezha-fronted/src/components/common/bottomBox/bottomBox.vue
index 5b0d74c3a..070251c95 100644
--- a/nezha-fronted/src/components/common/bottomBox/bottomBox.vue
+++ b/nezha-fronted/src/components/common/bottomBox/bottomBox.vue
@@ -9,11 +9,11 @@
         <!--窗口大小控制-->
       <div class="sub-list-window-control">
         <!--退出全屏-->
-        <div class="window-control-btn" v-if="isFullScreen" @click="exitFullScreen"><i class="nz-icon nz-icon-exit-full-screen"></i></div>
+        <div class="window-control-btn" v-if="isFullScreen" @click="exitFullScreen" :id="from+'-bottom-exit-full'"><i class="nz-icon nz-icon-exit-full-screen" ></i></div>
         <!--全屏-->
-        <div class="window-control-btn" v-if="!isFullScreen" @click="fullScreen"><i class="el-icon-full-screen"></i></div>
+        <div class="window-control-btn" v-if="!isFullScreen" @click="fullScreen" :id="from+'-bottom-full'"><i class="el-icon-full-screen"></i></div>
         <!--关闭-->
-        <div class="window-control-btn" @click="closeSubList"><i class="nz-icon nz-icon-close"></i></div>
+        <div class="window-control-btn" @click="closeSubList" :id="from+'-bottom-close'"><i class="nz-icon nz-icon-close"></i></div>
       </div>
 
         <!------TAB区------>
diff --git a/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue b/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue
index 583e556ab..5cbc55b48 100644
--- a/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/alertMessageTab.vue
@@ -6,11 +6,11 @@
           <template v-if="from == $CONSTANTS.fromRoute.asset">{{obj.host}}</template>
           <template v-if="from == $CONSTANTS.fromRoute.rule">{{obj.alertName}}</template>
           <template v-if="from == $CONSTANTS.fromRoute.endpoint"><div class="sub-list-tab-title">{{$t("project.endpoint.endpointId")}}: {{obj ? obj.id : ''}}</div></template>
-        </div><div
+        </div><div :id="from+'-change-panelordetail'"
         @click="changeTab(from == $CONSTANTS.fromRoute.asset || from == $CONSTANTS.fromRoute.rule || from == $CONSTANTS.fromRoute.endpoint? 'panel' : 'detail')" class="sub-list-tab">{{$t("overall.detail")}}</div><div
-        class="sub-list-tab sub-list-tab-active">{{$t("asset.tableTitle.alerts")}}</div><div v-if="from == $CONSTANTS.fromRoute.asset"
+        class="sub-list-tab sub-list-tab-active">{{$t("asset.tableTitle.alerts")}}</div><div v-if="from == $CONSTANTS.fromRoute.asset" :id="from+'-change-modules'"
         @click="changeTab('endpoint')" class="sub-list-tab" v-has="'asset_endpoint_view'">{{$t("asset.tableTitle.modules")}}</div>
-        <div @click="changeTab('endpointQuery')" class="sub-list-tab" v-has="'project_endpoint_query_chart_view'" v-if="from == $CONSTANTS.fromRoute.endpoint">{{$t("overall.query")}}</div>
+        <div @click="changeTab('endpointQuery')" class="sub-list-tab" v-has="'project_endpoint_query_chart_view'" v-if="from == $CONSTANTS.fromRoute.endpoint" :id="from+'-change-endpoint'">{{$t("overall.query")}}</div>
       </div>
       <div class="top-tool-right">
         <pick-time :refresh-data-func="getAlertList" v-model="searchTime" :use-chart-unit="false" :use-refresh="false" :default-pick="defaultPick" :show-empty="true"></pick-time>
@@ -21,10 +21,11 @@
             class="nz-btn nz-btn-size-normal nz-btn-style-light margin-l-20" id="alert-list-export">
           <i class="nz-icon nz-icon-download1"></i>
         </button>
-        <delete-button :clickFunction="openDelMessageBox" :delete-objs="batchDeleteObjs" @after="getAlertList" api="alert/message" v-has="['rule_alerts_delete', 'project_endpoint_alerts_delete', 'asset_alerts_delete']"></delete-button>
+        <delete-button :clickFunction="openDelMessageBox" :delete-objs="batchDeleteObjs" @after="getAlertList" api="alert/message" v-has="['rule_alerts_delete', 'project_endpoint_alerts_delete', 'asset_alerts_delete']" :id="from+'-sub-batch-delete'"></delete-button>
       </div>
     </div>
     <alertMessageTable
+      :projectAlertId="from+'-sub-alert-table'"
       ref="alertMessageTable"
       :tableData="tableData"
       :loading="loading"
diff --git a/nezha-fronted/src/components/common/bottomBox/tabs/cabinetTab.vue b/nezha-fronted/src/components/common/bottomBox/tabs/cabinetTab.vue
index 24408d96d..844dffda4 100644
--- a/nezha-fronted/src/components/common/bottomBox/tabs/cabinetTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/cabinetTab.vue
@@ -13,10 +13,11 @@
                 class="nz-btn nz-btn-size-normal nz-btn-style-light float-right margin-l-20" id="cab-add">
           <i class="nz-icon-create-square nz-icon"></i>
         </button>
-        <delete-button :delete-objs="batchDeleteObjs" @after="allDelAfter" api="cabinet" v-has="'dc_cabinet_delete'"></delete-button>
+        <delete-button :delete-objs="batchDeleteObjs" @after="allDelAfter" api="cabinet" v-has="'dc_cabinet_delete'" id="cabinet-list-batch-delete"></delete-button>
       </div>
     </div>
     <el-table
+      id="cabinet-list-table"
       class="nz-table"
       :data="tableData"
       border
diff --git a/nezha-fronted/src/components/common/bottomBox/tabs/endpointQueryTab.vue b/nezha-fronted/src/components/common/bottomBox/tabs/endpointQueryTab.vue
index 71b4476a9..80d0f77ba 100644
--- a/nezha-fronted/src/components/common/bottomBox/tabs/endpointQueryTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/endpointQueryTab.vue
@@ -19,8 +19,8 @@
     <div class="sub-top-tools">
       <div class="sub-list-tabs">
         <div class="sub-list-tab-title">{{$t("project.endpoint.endpointId")}}: {{currentEndpoint ? currentEndpoint.id : ''}}</div><div
-        class="sub-list-tab" @click="changeTab('panel')">{{$t("overall.detail")}}</div>
-        <div class="sub-list-tab" @click="changeTab('alertMessage')">{{$t("asset.tableTitle.alerts")}}</div>
+        class="sub-list-tab" @click="changeTab('panel')" id="endpoint-query-changepanel">{{$t("overall.detail")}}</div>
+        <div class="sub-list-tab" @click="changeTab('alertMessage')" id="endpoint-query-alertMessage">{{$t("asset.tableTitle.alerts")}}</div>
         <div class="sub-list-tab sub-list-tab-active">{{$t("overall.query")}}</div>
       </div>
       <div class="top-tool-right">
@@ -30,7 +30,7 @@
           </el-input>
         </div>
         <div class="margin-r-20 nz-btn-group nz-btn-group-size-small nz-btn-group-light">
-          <button @click="changeTime(-10)" class="nz-btn nz-btn-size-normal nz-btn-style-light change-time-height nz-input-group-prepend"><i class="el-icon-d-arrow-left"></i></button><el-date-picker
+          <button @click="changeTime(-10)" class="nz-btn nz-btn-size-normal nz-btn-style-light change-time-height nz-input-group-prepend" id="endpoint-query-changetime"><i class="el-icon-d-arrow-left"></i></button><el-date-picker
           v-model="formatTime"
           type="datetime"
           size="mini"
@@ -61,7 +61,7 @@
     <div class="table-header-inner" @click="clearSelectedMetrics"><span><i style="font-size: 12px;margin-left: 2px;" class="nz-icon nz-icon-close " :class="{'control-icon-unchecked':selectedEndpoints.length<1,'control-icon-checked':selectedEndpoints.length>0}"></i></span></div>
      <pl-table :row-height="28" use-virtual :datas="tableData" border :empty-text="$t('config.mib.noData')" :header-cell-class-name="cellClass" :style="{height: $tableHeight.noPagination}"
                :pagination-show="false" class="nz-table endpoint-query-table" ref="endpointQueryTable" style="width: 100%;" v-loading="loading"
-               @selection-change="selectChange" v-if="tableShow && plTableSHow" :border="true" :tooltip-effect="'light'">
+               @selection-change="selectChange" v-if="tableShow && plTableSHow" :border="true" :tooltip-effect="'light'" id="endpoint-list-table">
       <pl-table-column
         type="selection"
         width="39"
@@ -99,7 +99,7 @@
         min-width="180">
       </pl-table-column>
     </pl-table>
-    <button :class="{'to-top-is-hover': tools.tableHover}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn"><i class="nz-icon nz-icon-top"></i></button>
+    <button :class="{'to-top-is-hover': tools.tableHover}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn" id="endpoint-list-totop"><i class="nz-icon nz-icon-top"></i></button>
 
     <el-dialog class="line-chart-block-modal nz-dialog endpoint-dialog"
                :title="$t('project.endpoint.dialogTitle')"
@@ -111,8 +111,8 @@
       <div slot="title">
         {{$t("project.endpoint.dialogTitle")}}
         <div class="float-right panel-calendar dialog-tool" style="display: flex">
-          <pick-time :refresh-data-func="queryChartDate" :use-refresh="false" v-model="searchTime" style="height: 28px;" @unitChange="chartUnitChange"></pick-time>
-          <button @click="saveChart" class="nz-btn nz-btn-size-large nz-btn-style-normal-new" v-has="'project_endpoint_query_chart_toAdd'">{{$t('dashboard.metric.saveChart')}}</button>
+          <pick-time :refresh-data-func="queryChartDate" :use-refresh="false" v-model="searchTime" style="height: 28px;" @unitChange="chartUnitChange" id="endpoint-query-full-chart"></pick-time>
+          <button @click="saveChart" class="nz-btn nz-btn-size-large nz-btn-style-normal-new" v-has="'project_endpoint_query_chart_toAdd'" id="endpoint-query-full-chart-save">{{$t('dashboard.metric.saveChart')}}</button>
         </div>
       </div>
       <chart ref="endpointChart" :unit="chartUnit"></chart>
diff --git a/nezha-fronted/src/components/common/bottomBox/tabs/endpointTab.vue b/nezha-fronted/src/components/common/bottomBox/tabs/endpointTab.vue
index 65a1f9663..a147c4393 100644
--- a/nezha-fronted/src/components/common/bottomBox/tabs/endpointTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/endpointTab.vue
@@ -3,8 +3,8 @@
     <div class="sub-top-tools">
       <div class="sub-list-tabs">
         <div class="sub-list-tab-title">{{obj.host}}</div><div
-        class="sub-list-tab" @click="changeTab('panel')">{{$t("overall.detail")}}</div><div
-        @click="changeTab('alertMessage')" class="sub-list-tab" v-has="'asset_alerts_view'">{{$t("asset.tableTitle.alerts")}}</div><div
+        class="sub-list-tab" @click="changeTab('panel')" id="endpoint-tab-change-panel">{{$t("overall.detail")}}</div><div
+        @click="changeTab('alertMessage')" class="sub-list-tab" v-has="'asset_alerts_view'" id="endpoint-tab-change-alertmsg">{{$t("asset.tableTitle.alerts")}}</div><div
         class="sub-list-tab sub-list-tab-active">{{$t("asset.tableTitle.modules")}}</div>
       </div>
       <div class="top-tool-right">
@@ -12,6 +12,7 @@
           <search-input :searchMsg="searchMsg" @search="search" position="endpoint-bottom"></search-input>
         </div>
         <export-excel
+          id="endpoint-sub-list"
           export-file-name="endpoint"
           export-url="/endpoint/export"
           import-url="/endpoint/import"
@@ -26,12 +27,13 @@
             </button>
           </template>
         </export-excel>
-        <delete-button :delete-objs="batchDeleteObjs" @after="getTableData" api="endpoint" v-has="'asset_endpoint_delete'"></delete-button>
+        <delete-button :delete-objs="batchDeleteObjs" @after="getTableData" api="endpoint" v-has="'asset_endpoint_delete'" id="endpoint-tab-batch-delete"></delete-button>
       </div>
     </div>
     <!-- 自定义table列 -->
       <transition name="el-zoom-in-top">
         <element-set
+          id="endpoint-sub-list"
           v-if="tools.showCustomTableTitle"
           @close="tools.showCustomTableTitle = false"
           :custom-table-title.sync="tools.customTableTitle"
@@ -41,6 +43,7 @@
         ></element-set>
       </transition>
     <el-table
+      id="endpoint-sub-list-table"
       :data="tableData"
       border
       v-loading="tools.loading"
diff --git a/nezha-fronted/src/components/common/bottomBox/tabs/panelTab.vue b/nezha-fronted/src/components/common/bottomBox/tabs/panelTab.vue
index 341c59690..cec772b52 100644
--- a/nezha-fronted/src/components/common/bottomBox/tabs/panelTab.vue
+++ b/nezha-fronted/src/components/common/bottomBox/tabs/panelTab.vue
@@ -10,11 +10,11 @@
           <template v-else-if="from == $CONSTANTS.fromRoute.endpoint">{{$t("project.endpoint.endpointId")}}: {{obj.id}}</template>
         </div><div class="sub-list-tab sub-list-tab-active" v-if="from == $CONSTANTS.fromRoute.model">{{$t("dashboard.panel.title")}}</div><template v-if="from == $CONSTANTS.fromRoute.asset"><div
           class="sub-list-tab sub-list-tab-active">{{$t("overall.detail")}}</div><div
-          @click="changeTab('alertMessage')" class="sub-list-tab" v-has="'asset_alerts_view'">{{$t("asset.tableTitle.alerts")}}</div><div
-          @click="changeTab('endpoint')" class="sub-list-tab" v-has="'asset_endpoint_view'">{{$t("asset.tableTitle.modules")}}</div>
+          @click="changeTab('alertMessage')" class="sub-list-tab" v-has="'asset_alerts_view'" id="panel-tab-change-asset-alertmsg">{{$t("asset.tableTitle.alerts")}}</div><div
+          @click="changeTab('endpoint')" class="sub-list-tab" v-has="'asset_endpoint_view'" id="panel-tab-change-endpoint">{{$t("asset.tableTitle.modules")}}</div>
         </template><template v-if="from == $CONSTANTS.fromRoute.rule"><div
           class="sub-list-tab sub-list-tab-active">{{$t("overall.detail")}}</div><div
-          @click="changeTab('alertMessage')" class="sub-list-tab" v-has="'rule_alerts_view'">{{$t("asset.tableTitle.alerts")}}</div>
+          @click="changeTab('alertMessage')" class="sub-list-tab" v-has="'rule_alerts_view'" id="panel-tab-change-rule-alertmsg">{{$t("asset.tableTitle.alerts")}}</div>
         </template><template v-if="from == $CONSTANTS.fromRoute.endpoint"><div
           class="sub-list-tab sub-list-tab-active">{{$t("overall.detail")}}</div><div
           @click="changeTab('alertMessage')" class="sub-list-tab " v-has="'project_endpoint_alerts_view'">{{$t("asset.tableTitle.alerts")}}</div><div
@@ -23,12 +23,13 @@
       </div>
       <div class="top-tool-right">
         <div class="top-tool-search margin-r-20" v-if="from != $CONSTANTS.fromRoute.rule && from != $CONSTANTS.fromRoute.endpoint">
-          <el-input ref="queryPanel" @clear="clearInput" id="queryPanel" @focus="focusInput"  @blur="blurInput" v-model="filter.searchName" class="query-input-inactive" size="mini" clearable   >
+          <el-input ref="queryPanel" @clear="clearInput"  @focus="focusInput"  @blur="blurInput" v-model="filter.searchName" class="query-input-inactive" size="mini" clearable   id="panel-tab-search">
             <i slot="suffix" class="el-input__icon nz-icon nz-icon-search" @click="focusInput" style="float: right"></i>
           </el-input>
         </div>
         <pick-time :refresh-data-func="dateChange" :use-chart-unit="false" ref="pickTime" v-if="from == $CONSTANTS.fromRoute.asset" v-model="searchTime"></pick-time>
         <export-excel
+          id="panel-tab"
           export-file-name="chart"
           export-url="/panel/export"
           import-url="/panel/import"
diff --git a/nezha-fronted/src/components/common/chartUnit.vue b/nezha-fronted/src/components/common/chartUnit.vue
index 030d34660..d5d2b4f31 100644
--- a/nezha-fronted/src/components/common/chartUnit.vue
+++ b/nezha-fronted/src/components/common/chartUnit.vue
@@ -1,7 +1,8 @@
 <template>
     <div style="display: flex;justify-content: flex-start">
-      <button class="input-prepend nz-btn nz-btn-size-small nz-btn-style-light nz-btn-style-square nz-input-group-prepend" @click="openSeletor">{{$t('dashboard.panel.chartForm.unit')}}</button>
+      <button class="input-prepend nz-btn nz-btn-size-small nz-btn-style-light nz-btn-style-square nz-input-group-prepend" @click="openSeletor" :id="id+'-open-select'">{{$t('dashboard.panel.chartForm.unit')}}</button>
       <el-cascader placeholder="" popper-class="no-style-class unit-pop-class" size="mini"
+                   :id="id+'-unit-input'"
                    :options="chartUnits"
                    class="chart-unit"
                    :props="{ expandTrigger: 'click' ,emitPath:false}"
@@ -23,7 +24,8 @@
       prop:'postUnit'
     },
     props:{
-      postUnit:{}
+      postUnit:{},
+      id:{type:String,default:'chart-unit'}
     },
     data(){
       return{
diff --git a/nezha-fronted/src/components/common/deleteButton.vue b/nezha-fronted/src/components/common/deleteButton.vue
index 707a842b1..2ed6462dd 100644
--- a/nezha-fronted/src/components/common/deleteButton.vue
+++ b/nezha-fronted/src/components/common/deleteButton.vue
@@ -1,6 +1,6 @@
 <template>
     <div :class="['delete-button',(deleteObjs.length<1?'':'delete-button-light')]">
-      <el-button class="nz-btn nz-btn-size-normal nz-btn-style-light" :class="{'nz-btn-disabled' : deleteObjs.length<1}" @click="batchDelete"><span><i class="nz-icon nz-icon-delete"></i></span></el-button>
+      <el-button class="nz-btn nz-btn-size-normal nz-btn-style-light" :class="{'nz-btn-disabled' : deleteObjs.length<1}" @click="batchDelete" :id="id"><span><i class="nz-icon nz-icon-delete" ></i></span></el-button>
     </div>
 </template>
 
@@ -11,7 +11,8 @@
       filterFunction:Function,
       deleteObjs:Array,
       api:String,
-      clickFunction:Function
+      clickFunction:Function,
+      id:String
     },
     methods:{
       batchDelete:function(){
diff --git a/nezha-fronted/src/components/common/elementSet.vue b/nezha-fronted/src/components/common/elementSet.vue
index 32cb42b92..57a0f5b0a 100644
--- a/nezha-fronted/src/components/common/elementSet.vue
+++ b/nezha-fronted/src/components/common/elementSet.vue
@@ -22,17 +22,17 @@
       </div>
     </div>
     <div class="custom-bottom-btns">
-      <button v-if="isCancel" type="button" @click="batchHandler(false)" class="nz-btn nz-btn-size-small-new nz-btn-style-light-new is-cancel">
+      <button v-if="isCancel" type="button" @click="batchHandler(false)" class="nz-btn nz-btn-size-small-new nz-btn-style-light-new is-cancel" :id="id+'-element-set-none'">
         <span class="top-tool-btn-txt">{{$t('overall.clear')}}</span>
       </button>
-      <button v-if="!isCancel" type="button" @click="batchHandler(true)" class="nz-btn nz-btn-size-small-new nz-btn-style-light-new">
+      <button v-if="!isCancel" type="button" @click="batchHandler(true)" class="nz-btn nz-btn-size-small-new nz-btn-style-light-new" :id="id+'-element-set-all'">
         <span class="top-tool-btn-txt">{{$t('overall.all')}}</span>
       </button>
       <div>
-        <button type="button" @click="esc" class="nz-btn nz-btn-size-small-new nz-btn-style-light-new">
+        <button type="button" @click="esc" class="nz-btn nz-btn-size-small-new nz-btn-style-light-new" :id="id+'-element-set-esc'">
           <span class="top-tool-btn-txt">{{$t('overall.esc')}}</span>
         </button>
-        <button type="button" @click="save" class="nz-btn nz-btn-size-small-new nz-btn-style-normal-new">
+        <button type="button" @click="save" class="nz-btn nz-btn-size-small-new nz-btn-style-normal-new" :id="id+'-element-set-save'">
           <span class="top-tool-btn-txt">{{$t('overall.save')}}</span>
         </button>
       </div>
@@ -47,6 +47,7 @@ export default {
     originalTableTitle: Array, //原始title
     path: String,
     allowedAll: {default: false},
+    id:{type:String,default:'table'}
   },
   data() {
     return {
diff --git a/nezha-fronted/src/components/common/exportXLSX.vue b/nezha-fronted/src/components/common/exportXLSX.vue
index 9f6d69a33..9a78e30c2 100644
--- a/nezha-fronted/src/components/common/exportXLSX.vue
+++ b/nezha-fronted/src/components/common/exportXLSX.vue
@@ -5,8 +5,8 @@
         <i class="nz-icon nz-icon-arrow-down"></i>
         <transition name="el-zoom-in-top">
           <ul class="el-dropdown-menu el-popper el-dropdown-menu--mini export-dropdown" style="z-index: 101" v-show="exportShow">
-            <li @click="showImportBox(1)" class="el-dropdown-menu__item dropdown-content" v-has="permissions.import"><i class="nz-icon nz-icon-upload"></i>{{$t('overall.importExcel')}}</li>
-            <li @click="showImportBox(2)" class="el-dropdown-menu__item dropdown-content" v-has="permissions.export"><i class="nz-icon nz-icon-download1"></i>{{$t('overall.exportExcel')}}</li>
+            <li @click="showImportBox(1)" class="el-dropdown-menu__item dropdown-content" v-has="permissions.import" :id="id+'-xlsx-import'"><i class="nz-icon nz-icon-upload"></i>{{$t('overall.importExcel')}}</li>
+            <li @click="showImportBox(2)" class="el-dropdown-menu__item dropdown-content" v-has="permissions.export" :id="id+'-xlsx-export'"><i class="nz-icon nz-icon-download1"></i>{{$t('overall.exportExcel')}}</li>
           </ul>
         </transition>
       </button>
@@ -15,7 +15,7 @@
     <el-dialog :visible.sync="importBox.show" :title="importBox.title" modal-append-to-body append-to-body :modal-append-to-body='false' :show-close="true" :width="importBox.width" @close="closeDialog" class="nz-dialog" :close-on-click-modal="importBox.type!=3">
       <div v-if="importBox.type==1">
         <div class="upload-body">
-          <el-upload drag class="upload-demo" ref="uploadExcel"  action="" :file-list="importFileList" :on-change="importChange"  :auto-upload="false" accept=".xlsx,.xls">
+          <el-upload drag class="upload-demo" ref="uploadExcel"  action="" :file-list="importFileList" :on-change="importChange"  :auto-upload="false" accept=".xlsx,.xls" :id="id+'-xlsx-input-file'">
             <div slot="tip" class="el-upload__tip" >{{$t('overall.importTip')}}</div>
             <i class="nz-icon nz-icon-upload"></i>
             <div class="el-upload__text">{{$t('overall.dragFileTip')}}，{{$t('overall.or')}}&nbsp;<em>{{$t('overall.clickUpload')}}</em></div>
@@ -26,13 +26,13 @@
         </div>
         <div slot="footer" class="footer">
           <div class="el-message-box__btns" style="text-align: right;">
-            <button @click="downloadTemplate"  class="el-button el-button--default el-button--small">
+            <button @click="downloadTemplate"  class="el-button el-button--default el-button--small" :id="id+'-xlsx-import-template'">
               <span>{{$t('overall.template')}}</span>
             </button>
-            <button  @click="importExcel"  class="nz-btn el-button el-button--default el-button--small" :disabled="prevent_opt.import" :class="{'nz-btn-disabled':prevent_opt.import}">
+            <button  @click="importExcel"  class="nz-btn el-button el-button--default el-button--small" :disabled="prevent_opt.import" :class="{'nz-btn-disabled':prevent_opt.import}" :id="id+'-xlsx-import-add'">
               <span>{{$t('overall.importExcel')}}</span>
             </button>
-            <button @click="closeDialog"  class="el-button el-button--default el-button--small" >
+            <button @click="closeDialog"  class="el-button el-button--default el-button--small" :id="id+'-xlsx-import-esc'">
               <span>{{$t('overall.cancel')}}</span>
             </button>
           </div>
@@ -40,10 +40,10 @@
       </div>
       <div v-if="importBox.type == 2">
         <div class="upload-body">
-          <button @click="exportCur"  class="el-button el-button--default el-button--small">
+          <button @click="exportCur"  class="el-button el-button--default el-button--small" :id="id+'-xlsx-export-current'">
             <span>{{$t('overall.exportCur')}}</span>
           </button>
-          <button  @click="exportAll"  class="el-button el-button--default el-button--small">
+          <button  @click="exportAll"  class="el-button el-button--default el-button--small" :id="id+'-xlsx-export-all'">
             <span>{{$t('overall.exportAll')}}</span>
           </button>
         </div>
@@ -83,7 +83,7 @@
           </div>
           <div slot="footer" class="footer">
             <div class="el-message-box__btns">
-              <button @click="rollbackImport"  class="nz-btn nz-btn-size-normal-new nz-btn-style-error-new">
+              <button @click="rollbackImport"  class="nz-btn nz-btn-size-normal-new nz-btn-style-error-new" :id="id+'-xlsx-import-rollback'">
                 <span>{{$t('overall.rollbackImport')}}</span>
               </button>
               <!--<button  @click="closeDialog"  class="el-button el-button&#45;&#45;default el-button&#45;&#45;small">-->
@@ -108,7 +108,8 @@
       importUrl: {type:String,required:true},
       link:{type:Object},
       permissions: {type: Object},
-      showCur:{type:Boolean,default:true}
+      showCur:{type:Boolean,default:true},
+      id:{type:String,default:'export'}
     },
     data:function(){
       return {
diff --git a/nezha-fronted/src/components/common/header.vue b/nezha-fronted/src/components/common/header.vue
index 652f48873..ffa05d1bf 100644
--- a/nezha-fronted/src/components/common/header.vue
+++ b/nezha-fronted/src/components/common/header.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="header">
-    <div @click="jumpTo('overview')" class="logo link">
+    <div @click="jumpTo('overview')" class="logo link" id="header-to-overview">
       <img height="34" src="../../assets/img/logo1-2.png"/>
       <span class="header-system-name">{{systemName&&systemName != 'undefined'&&systemName != null?systemName: $t('dashboard.overview.contentTitle')}}</span>
     </div>
@@ -23,7 +23,7 @@
             </template>
           </el-submenu>
           <el-submenu :index="`${index}-${subIndex}`" class="icon-menu-item" popper-class="display-none" v-if="subMenu.code == 'header_terminal'">
-            <div @click="cli" class="el-submenu__title" slot="title" >
+            <div @click="cli" class="el-submenu__title" slot="title" id="header-open-cli">
               <i class="nz-icon nz-icon-cli" style="font-size: 18px;"></i>
               <div class="right-tip" v-show="$store.state.consoleCount>0">{{$store.state.consoleCount<=10?$store.state.consoleCount:'10+'}}</div>
             </div>
@@ -34,7 +34,7 @@
             </template>
             <template v-for="(item, createIndex) in createMenu">
               <el-menu-item :index="`${index}-${subIndex}-${createIndex}`" v-has="item.permission">
-                <div @click="createBox(item)">
+                <div @click="createBox(item)" :id="'create-box-'+createIndex">
                   <span>{{item.label}}</span>
                 </div>
               </el-menu-item>
@@ -50,36 +50,38 @@
       <el-submenu :index="`${index}`" :key="index" popper-class="nz-submenu" v-for="(menu, index) in getMenuList" v-if="menu.code != 'header' && menu.code != 'menu'">
         <template v-if="menu.code == 'asset'">
           <template slot="title">
-            <div @click="jumpToAsset()" v-if="assetData.length == 0">{{$t(menu.i18n)}}</div>
-            <div :class="{'menu-active' : route == '/asset'}" @click="jumpToAsset()" v-else>{{$t(menu.i18n)}}</div>
+            <div @click="jumpToAsset()" v-if="assetData.length == 0" id="header-to-asset">{{$t(menu.i18n)}}</div>
+            <div :class="{'menu-active' : route == '/asset'}" @click="jumpToAsset()" v-else id="header-to-asset2">{{$t(menu.i18n)}}</div>
           </template>
           <template>
-            <el-menu-item index="3-0" v-if="assetData.length == 0"><div @click="createBox({type: 6})" v-has="'asset_toAdd'"><i class="nz-icon nz-icon-create-square header-dropdown-add"></i>&nbsp;&nbsp;{{$t("overall.createDatacenter")}}</div></el-menu-item>
+            <el-menu-item index="3-0" v-if="assetData.length == 0"><div @click="createBox({type: 6})" v-has="'asset_toAdd'" id="header-to-addasset"><i class="nz-icon nz-icon-create-square header-dropdown-add"></i>&nbsp;&nbsp;{{$t("overall.createDatacenter")}}</div></el-menu-item>
             <template v-else>
-              <div style='height: 360px; overflow: auto;' v-has="'asset_view'" v-if="assetData.length>10">
+              <div style='height: 360px; overflow: auto;' v-has="'asset_view'" v-if="assetData.length>10" id="header-to-subAsset">
                 <el-menu-item :index="'3-' + index" :key="index" v-for="(item, index) in assetData">
                   <div :class="{'menu-item-active': route == '/asset' && activeItemIndex == item.id}" @click="jumpToAsset(item)" @mouseenter="hoverItemIndex = '3-' + index" @mouseleave="hoverItemIndex = ''">
                     <span class="too-long-split" style="width: 130px;">{{item.name}}</span>
                   </div>
                 </el-menu-item>
               </div>
-              <el-menu-item :index="'3-' + index" :key="index" v-else v-for="(item, index) in assetData" v-has="'asset_view'">
-                <div :class="{'menu-item-active': route == '/asset' && activeItemIndex == item.id}" @click="jumpToAsset(item)" @mouseenter="hoverItemIndex = '3-' + index" @mouseleave="hoverItemIndex = ''">
-                  <span class="too-long-split" style="width: 130px;">{{item.name}}</span>
-                </div>
-              </el-menu-item>
+              <div  v-else id="header-to-subAsset2">
+                <el-menu-item :index="'3-' + index" :key="index" v-for="(item, index) in assetData" v-has="'asset_view'">
+                  <div :class="{'menu-item-active': route == '/asset' && activeItemIndex == item.id}" @click="jumpToAsset(item)" @mouseenter="hoverItemIndex = '3-' + index" @mouseleave="hoverItemIndex = ''">
+                    <span class="too-long-split" style="width: 130px;">{{item.name}}</span>
+                  </div>
+                </el-menu-item>
+              </div>
             </template>
           </template>
         </template>
         <template v-else-if="menu.code == 'project'">
           <template slot="title">
             <div v-if="projectData.length == 0">{{$t(menu.i18n)}}</div>
-            <div :class ="route == '/project' ? 'menu-active' :''" @click="jumpToProject(projectData[0])" v-else >{{$t(menu.i18n)}}</div>
+            <div :class ="route == '/project' ? 'menu-active' :''" @click="jumpToProject(projectData[0])" v-else id="header-to-project">{{$t(menu.i18n)}}</div>
           </template>
           <template>
-            <el-menu-item index="2-0" v-if="projectData.length == 0"><div @click="createBox({type: 1})" v-has="'project_toAdd'"><i class="nz-icon nz-icon-create-square header-dropdown-add"></i>&nbsp;&nbsp;{{$t("overall.createProject")}}</div></el-menu-item>
+            <el-menu-item index="2-0" v-if="projectData.length == 0"><div @click="createBox({type: 1})" v-has="'project_toAdd'" id="header-create-project"><i class="nz-icon nz-icon-create-square header-dropdown-add"></i>&nbsp;&nbsp;{{$t("overall.createProject")}}</div></el-menu-item>
             <template v-else>
-              <div style="height: 360px; overflow: auto;" v-has="'project_view'" v-if="projectData.length>10">
+              <div style="height: 360px; overflow: auto;" v-has="'project_view'" v-if="projectData.length>10" id="header-sub-project">
                 <el-menu-item :index="'2-' + index" :key="index" v-for="(item, index) in projectData">
                   <div :class="{'menu-item-active': route == '/project' && activeItemIndex == item.id}" @click="jumpToProject(item)" @mouseenter="hoverItemIndex = '2-' + index" @mouseleave="hoverItemIndex = ''">
                     <span class="too-long-split" style="width: 135px;">{{item.name}}</span>
@@ -87,23 +89,25 @@
                   </div>
                 </el-menu-item>
               </div>
-              <el-menu-item :index="'2-' + index" :key="index" v-else v-for="(item, index) in projectData" v-has="'project_view'">
-                <div :class="{'menu-item-active': route == '/project' && activeItemIndex == item.id}" @click="jumpToProject(item)" @mouseenter="hoverItemIndex = '2-' + index" @mouseleave="hoverItemIndex = ''">
-                  <span class="too-long-split" style="width: 135px;">{{item.name}}</span>
-                  <div @click.stop="toEditProject(item)" class="menu-edit" v-has="'project_toEdit'" v-show="hoverItemIndex == '2-' + index && item.buildIn != 1"><i class="nz-icon nz-icon-edit"></i></div>
-                </div>
-              </el-menu-item>
+              <div v-else id="header-sub-project2">
+                <el-menu-item :index="'2-' + index" :key="index" v-for="(item, index) in projectData" v-has="'project_view'">
+                  <div :class="{'menu-item-active': route == '/project' && activeItemIndex == item.id}" @click="jumpToProject(item)" @mouseenter="hoverItemIndex = '2-' + index" @mouseleave="hoverItemIndex = ''">
+                    <span class="too-long-split" style="width: 135px;">{{item.name}}</span>
+                    <div @click.stop="toEditProject(item)" class="menu-edit" v-has="'project_toEdit'" v-show="hoverItemIndex == '2-' + index && item.buildIn != 1"><i class="nz-icon nz-icon-edit"></i></div>
+                  </div>
+                </el-menu-item>
+              </div>
             </template>
           </template>
         </template>
         <template v-else>
           <template slot="title">
-            <div :class="menuIsActive(menu, 'parent')" @click="jumpTo(menu.route)" >
+            <div :class="menuIsActive(menu, 'parent')" @click="jumpTo(menu.route)" :id="'header-to-'+menu.name">
               {{$t(menu.i18n)}}
             </div>
           </template>
           <el-menu-item :index="`${index}-${subIndex}`" :key="`${index}-${subIndex}`" v-for="(subMenu, subIndex) in menu.children">
-            <div :class="menuIsActive(subMenu)" @click="jumpTo(subMenu.route)" >{{$t(subMenu.i18n)}}</div>
+            <div :class="menuIsActive(subMenu)" @click="jumpTo(subMenu.route)" :id="'header-to-submenu-'+subMenu.name">{{$t(subMenu.i18n)}}</div>
           </el-menu-item>
         </template>
       </el-submenu>
@@ -113,19 +117,19 @@
           <div class='nz-user'>{{username}}<i class="nz-icon nz-icon-arrow-down"></i></div>
         </template>
         <el-menu-item index="101-0">
-          <div :style="language=='en'?'color:#f90':''" @click="changeLocal('en')">English</div>
+          <div :style="language=='en'?'color:#f90':''" @click="changeLocal('en')" id="header-to-english">English</div>
         </el-menu-item>
         <el-menu-item index="101-1">
-          <div :style="language=='cn'?'color:#f90':''" @click="changeLocal('cn')">中文</div>
+          <div :style="language=='cn'?'color:#f90':''" @click="changeLocal('cn')" id="header-to-chinese">中文</div>
         </el-menu-item>
         <el-menu-item class="nz-menu-line" @click.stop index="6-2">
           <div style="height: 1px; width: 100%; background-color: #cccccc;"></div>
         </el-menu-item>
         <el-menu-item index="101-3">
-          <div @click="showPwdDialog">{{$t('overall.changePwd')}}</div>
+          <div @click="showPwdDialog" id="header-to-changepwd">{{$t('overall.changePwd')}}</div>
         </el-menu-item>
         <el-menu-item index="101-4">
-          <div @click="logout">{{$t('overall.signOut')}}</div>
+          <div @click="logout" id="header-to-logout">{{$t('overall.signOut')}}</div>
         </el-menu-item>
       </el-submenu>
     </el-menu>
diff --git a/nezha-fronted/src/components/common/pickTime.vue b/nezha-fronted/src/components/common/pickTime.vue
index 9af9ab1e4..17172aa12 100644
--- a/nezha-fronted/src/components/common/pickTime.vue
+++ b/nezha-fronted/src/components/common/pickTime.vue
@@ -3,7 +3,7 @@
     <time-picker v-if="showTimePicker" ref="timePicker" class="time-picker" @change="dateChange" :default-pick="defaultPick" :show-empty="showEmpty" v-model="this.searchTime"></time-picker>
     <chart-unit v-model="unit" v-if="useChartUnit"></chart-unit>
       <div class="nz-btn-group nz-btn-group-size-normal nz-btn-group-light margin-r-20" v-show="useRefresh" style="height: 24px;line-height: 24px;vertical-align: middle;">
-        <button style="border-right: 1px solid rgba(162,162,162,0.50);" type="button" class="nz-btn nz-btn-size-normal nz-btn-style-light" @click="refreshDataFunc">
+        <button style="border-right: 1px solid rgba(162,162,162,0.50);" type="button" class="nz-btn nz-btn-size-normal nz-btn-style-light" @click="refreshDataFunc" :id="id+'-refresh'">
           <i style="font-size: 14px" class="global-active-color nz-icon nz-icon-refresh"></i>&nbsp;
           <span class="nz-btn nz-btn-text" ><slot name="added-text"></slot></span>
         </button>
@@ -57,7 +57,8 @@
         default:true,
       },
       defaultPick:Number,
-      showEmpty:{type:Boolean,default:false}
+      showEmpty:{type:Boolean,default:false},
+      id:String
     },
     data(){
       return{
diff --git a/nezha-fronted/src/components/common/popBox/selectPanel.vue b/nezha-fronted/src/components/common/popBox/selectPanel.vue
index 5a4502a29..a449186ba 100644
--- a/nezha-fronted/src/components/common/popBox/selectPanel.vue
+++ b/nezha-fronted/src/components/common/popBox/selectPanel.vue
@@ -23,7 +23,7 @@
             <div class="tree--node" slot-scope="{ node, data }">
               <span>{{ node.label }}</span>
               <span class="tree--operation" v-if="!panelLock">
-                <span @click.stop="deletePanel(data)" class="panel-dropdown-btn panel-dropdown-btn-delete"><i class="nz-icon nz-icon-delete"></i></span>
+                <span @click.stop="deletePanel(data)" class="panel-dropdown-btn panel-dropdown-btn-delete" ><i class="nz-icon nz-icon-delete"></i></span>
                 <span @click.stop="editPanel(data)" class="panel-dropdown-btn"><i class="nz-icon nz-icon-edit"></i></span>
               </span>
             </div>
diff --git a/nezha-fronted/src/components/common/rightBox/accountBox.vue b/nezha-fronted/src/components/common/rightBox/accountBox.vue
index 9dc3f798a..83ffaa560 100644
--- a/nezha-fronted/src/components/common/rightBox/accountBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/accountBox.vue
@@ -20,32 +20,32 @@
       <el-form :model="editUser" :rules="editUser.userId ? rules2 : rules" class="right-box-form right-box-form-left" label-position="right" label-width="120px" ref="accountForm">
         <!--username-->
         <el-form-item :label="$t('config.account.account')" prop="username">
-          <el-input autocomplete="new-password" type="text" placeholder=""
+          <el-input autocomplete="new-password" type="text" placeholder="" id="account-input-username"
                     v-model="editUser.username" maxlength="64" show-word-limit size="small" :disabled="editUser.username==='admin' && editUser.userId==1"></el-input>
         </el-form-item>
         <!--password-->
         <el-form-item :label="$t('config.account.password')" prop="password">
-          <el-input autocomplete="new-password" type="password" placeholder="" v-model="editUser.password"
+          <el-input autocomplete="new-password" type="password" placeholder="" v-model="editUser.password" id="account-input-password"
                     maxlength="16" show-word-limit size="small" @blur="passwordBlur"></el-input>
         </el-form-item>
         <!--passwordChange-->
         <el-form-item :label="$t('config.account.confirmPwd')" class="passwordChange" label-width="160px" prop="passwordChange">
-          <el-input autocomplete="new-password" type="password" placeholder="" v-model="editUser.passwordChange"
+          <el-input autocomplete="new-password" type="password" placeholder="" v-model="editUser.passwordChange" id="account-input-passwordChange"
                     maxlength="16" show-word-limit size="small"></el-input>
         </el-form-item>
         <!--email-->
         <el-form-item label="E-mail" prop="email">
-          <el-input type="text" placeholder="" v-model="editUser.email" size="small"></el-input>
+          <el-input type="text" placeholder="" v-model="editUser.email" size="small" id="account-input-email"></el-input>
         </el-form-item>
         <!--enable-->
         <el-form-item :label="$t('config.account.enable')">
-          <el-switch v-model="editUser.status" active-color="#ee9d3f" :disabled="isCurrentUser(editUser.username) || (editUser.username==='admin' && editUser.userId==1) " active-value="1"
+          <el-switch v-model="editUser.status" active-color="#ee9d3f" :disabled="isCurrentUser(editUser.username) || (editUser.username==='admin' && editUser.userId==1) " active-value="1" id="account-input-status"
                      inactive-value="0">
           </el-switch>
         </el-form-item>
         <!--roles-->
         <el-form-item :label="$t('config.account.roles')" prop="roleIds">
-          <el-select @change="()=>{this.$forceUpdate()}" clearable collapse-tags placeholder="" popper-class="config-dropdown" size="small" v-model="editUser.roleIds" :disabled="(editUser.username==='admin') && editUser.userId==1">
+          <el-select @change="()=>{this.$forceUpdate()}" clearable collapse-tags placeholder="" popper-class="config-dropdown" size="small" v-model="editUser.roleIds" :disabled="(editUser.username==='admin') && editUser.userId==1" id="account-input-roleIds">
             <template v-for="role in roles">
               <el-option :label="role.i18n?$t(role.i18n):role.name" :value="role.id"></el-option>
             </template>
@@ -62,14 +62,15 @@
         </div>
 
         <div class="right-box-line"></div>
-
-        <el-form-item v-for="(notification, index) in editUser.notifications" :key="index" class="notification-item">
-          <el-select class='form-item-title' placeholder="" popper-class="no-style-class" size="small" v-model="notification.scriptId">
-            <el-option v-for="(item, i) in selectableScripts" :label="item.name" :key="i" :value="item.id" :disabled="item.disabled"></el-option>
-          </el-select>
-          <el-input placeholder="" v-model="notification.account" size="small" style="width: calc(100% - 37px);"></el-input>
-          <span @click="removeNotification(index)" style="padding-left: 5px;"><i class="nz-icon nz-icon-shanchu1"></i></span>
-        </el-form-item>
+        <div id="account-input-box">
+          <el-form-item v-for="(notification, index) in editUser.notifications" :key="index" class="notification-item">
+            <el-select class='form-item-title' placeholder="" popper-class="no-style-class" size="small" v-model="notification.scriptId">
+              <el-option v-for="(item, i) in selectableScripts" :label="item.name" :key="i" :value="item.id" :disabled="item.disabled"></el-option>
+            </el-select>
+            <el-input placeholder="" v-model="notification.account" size="small" style="width: calc(100% - 37px);"></el-input>
+            <span @click="removeNotification(index)" style="padding-left: 5px;"><i class="nz-icon nz-icon-shanchu1"></i></span>
+          </el-form-item>
+        </div>
       </el-form>
     </div>
     <!-- end--表单-->
diff --git a/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue b/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
index bb3604425..937a1b2dd 100644
--- a/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
@@ -13,13 +13,13 @@
       <el-form class="right-box-form right-box-form-left" label-position="right" ref="addEndpoint" :model="endpoint" :rules="rules">
         <!--project-->
         <el-form-item :label='$t("project.project.project")' prop="projectId" class="select-warp">
-          <el-select @change="((val) => {changeProject(val)})" value-key="id" popper-class="config-dropdown" v-model="currentProjectCopy" placeholder="" size="small">
+          <el-select @change="((val) => {changeProject(val)})" value-key="id" popper-class="config-dropdown" v-model="currentProjectCopy" placeholder="" size="small" id="add-endpoint-project">
             <el-option v-for="item in projectList" :key="item.id" :label="item.name" :value="item" :id="'project-'+item.id"></el-option>
           </el-select>
         </el-form-item>
         <!--module-->
         <el-form-item :label='$t("project.module.module")' prop="moduleId" class="select-warp">
-          <el-select @change="((val) => {changeModule(val)})" value-key="id" popper-class="config-dropdown" v-model="currentModuleCopy" placeholder="" size="small">
+          <el-select @change="((val) => {changeModule(val)})" value-key="id" popper-class="config-dropdown" v-model="currentModuleCopy" placeholder="" size="small" id="add-endpoint-module">
             <el-option v-for="item in moduleList" :key="item.id" :label="item.name" :value="item" :id="'module-'+item.id"></el-option>
           </el-select>
         </el-form-item>
@@ -38,10 +38,11 @@
                     <i v-if="assetSearch.dropdownShow" class="nz-icon nz-icon-caret-up"></i>
                     <i v-if="!assetSearch.dropdownShow" class="nz-icon nz-icon-caret-bottom"></i>
                   </span>
-                </button><el-input style="width: 100px;" v-if="assetSearch.label === 'Host' || assetSearch.label === 'SN'" @keydown.enter.native="searchAssetKeydown" class="input-x-mini-24 nz-input-group-middle" placeholder="" v-model="assetSearch.text">
-                </el-input><el-select placeholder="" v-else-if="assetSearch.label === 'DC'" v-model="assetSearch.idcId" class="input-x-mini-24 nz-input-group-middle" popper-class="no-style-class">
+                </button><el-input style="width: 100px;" v-if="assetSearch.label === 'Host' || assetSearch.label === 'SN'" @keydown.enter.native="searchAssetKeydown" class="input-x-mini-24 nz-input-group-middle" placeholder="" v-model="assetSearch.text" id="add-endpoint-filter-input">
+                </el-input><el-select placeholder="" v-else-if="assetSearch.label === 'DC'" v-model="assetSearch.idcId" class="input-x-mini-24 nz-input-group-middle" popper-class="no-style-class" id="add-endpoint-filter-select">
                   <el-option v-for="item in dcList" :key="item.id" :label="item.name" :value="item.id"></el-option>
                 </el-select><el-cascader
+                  id="add-endpoint-filter-cascader"
                   v-else-if="assetSearch.label === 'Model'"
                   :options="vendorAndModelOptionData"
                   :props="{emitPath: false}"
@@ -53,7 +54,7 @@
                   class="nz-input-group-middle"
                   @change="selectModel"
                 >
-                </el-cascader><el-select placeholder="" v-else-if="assetSearch.label === 'Type'" v-model="assetSearch.typeIds" class="input-x-mini-24 nz-input-group-middle" popper-class="no-style-class">
+                </el-cascader><el-select placeholder="" v-else-if="assetSearch.label === 'Type'" v-model="assetSearch.typeIds" class="input-x-mini-24 nz-input-group-middle" popper-class="no-style-class" id="add-endpoint-filter-typeIds">
                   <el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id"></el-option>
                 </el-select><!--<el-autocomplete style="width: 100px;" v-else-if="assetSearch.label === 'DC'" @keydown.enter.native="searchAssetKeydown" :fetch-suggestions="filterDCValue" @select="selectDC" class="input-x-mini-24 nz-input-group-middle" placeholder="" v-model="assetSearch.text" value-key="name">
                 </el-autocomplete><el-autocomplete style="width: 100px;" v-else-if="assetSearch.label === 'Type'" @keydown.enter.native="searchAssetKeydown" :fetch-suggestions="filterTypeValue" @select="selectType" class="input-x-mini-24 nz-input-group-middle" placeholder="" v-model="assetSearch.text" value-key="name">
@@ -128,7 +129,7 @@
             <div class="line-100" style="border-color:#dcdfe6"></div>
             <div>
               <button type="button" @click="addToEndpointList"
-                      class="nz-btn nz-btn-size-small-new nz-btn-style-light-new endpoints-clear-btn" style="margin-top: 3px;">
+                      class="nz-btn nz-btn-size-small-new nz-btn-style-light-new endpoints-clear-btn" style="margin-top: 3px;" id="add-endpoint-add-asset">
                 {{$t('overall.addAssetList')}}
               </button>
               <span style="display: inline-block; font-size: 14px; float: right;padding-right: 15px;margin-top: 3px;">All: {{this.assetList.length}}</span>
@@ -140,7 +141,7 @@
             <!--module-->
             <div class="endpoints-box-module-info">
               <div class="title">{{$t('project.endpoint.moduleParameter')}}:</div>
-              <el-input class="module-info module-info-port input-x-mini-22" :class="{'module-info-port-snmp': currentModuleCopy.type && currentModuleCopy.type.toLowerCase() == 'snmp'}" v-model="currentModuleCopy.port"></el-input>
+              <el-input class="module-info module-info-port input-x-mini-22" :class="{'module-info-port-snmp': currentModuleCopy.type && currentModuleCopy.type.toLowerCase() == 'snmp'}" v-model="currentModuleCopy.port" id="add-endpoint-module-port"></el-input>
               <el-popover
                 placement="bottom"
                 width="100"
@@ -150,7 +151,7 @@
                 <div class="endpoint-param-pop">
                   <div v-for="item,index in currentModuleCopy.paramObj">{{item.key}}={{item.value}}</div>
                 </div>
-                <el-input id="edit-param" @click.native.stop="showEditParamBox(true, currentModuleCopy, 1, $event)" slot="reference" disabled class="module-info module-info-param  input-x-mini-22" v-model="currentModuleCopy.param"></el-input>
+                <el-input id="add-endpoint-module-param" @click.native.stop="showEditParamBox(true, currentModuleCopy, 1, $event)" slot="reference" disabled class="module-info module-info-param  input-x-mini-22" v-model="currentModuleCopy.param" ></el-input>
               </el-popover>
 
               <el-popover
@@ -164,7 +165,7 @@
                 <el-input id="edit-labels" @click.native.stop="showEditLabelsBox(true, currentModuleCopy, 1, $event)" slot="reference" disabled class="module-info module-info-param module-info-labels input-x-mini-22" :class="{'module-info-labels-snmp': currentModuleCopy.type && currentModuleCopy.type.toLowerCase() == 'snmp'}" v-model="currentModuleCopy.labels"></el-input>
               </el-popover>
 
-              <el-input v-if="currentModuleCopy.type && currentModuleCopy.type.toLowerCase() == 'http'" class="module-info module-info-path input-x-mini-22" v-model="currentModuleCopy.path"></el-input>
+              <el-input v-if="currentModuleCopy.type && currentModuleCopy.type.toLowerCase() == 'http'" class="module-info module-info-path input-x-mini-22" v-model="currentModuleCopy.path" id="add-endpoint-module-path"></el-input>
               <button type="button" id="cover-param" @click="coverEndpoint" class="nz-btn nz-btn-size-small nz-btn-style-light module-info module-info-cover"><i class="nz-icon nz-icon-override"></i></button>
             </div>
             <!--endpoints-->
@@ -175,6 +176,7 @@
                 style="width: 100%;border-radius: 4px;"
                 height="calc(100% - 36px)"
                 :row-class-name="setRowIndex"
+                id="add-endpoint-asset-table"
                 empty-text=" ">
                 <el-table-column
                   type="selection"
diff --git a/nezha-fronted/src/components/common/rightBox/alertConfigBox.vue b/nezha-fronted/src/components/common/rightBox/alertConfigBox.vue
index 38d730210..f07dbf32d 100644
--- a/nezha-fronted/src/components/common/rightBox/alertConfigBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/alertConfigBox.vue
@@ -18,7 +18,7 @@
       <el-form class="right-box-form right-box-form-left" :model="editAlertRule" label-position="right" label-width="120px" :rules="rules" ref="alertRuleForm">
         <!--alertName-->
         <el-form-item :label='$t("alert.config.name")' prop="alertName">
-          <el-input placeholder="" maxlength="64" show-word-limit v-model="editAlertRule.alertName" size="small"></el-input>
+          <el-input placeholder="" maxlength="64" show-word-limit v-model="editAlertRule.alertName" size="small" id="alert-box-input-name"></el-input>
         </el-form-item>
         <div style="width: calc(100% - 70px);margin-left: 70px">
           <promql-input
@@ -27,22 +27,23 @@
             :index="0"
             :styleType="2"
             :plugins="['metric-input']"
+            id="alert-box-input-promql"
           ></promql-input>
         </div>
         <!--operator-->
         <el-form-item :label="$t('alert.config.operator')" prop="operator" style="width: 400px;display: inline-block;">
-          <el-select popper-class="config-dropdown" v-model="editAlertRule.operator" placeholder=""  size="small">
+          <el-select popper-class="config-dropdown" v-model="editAlertRule.operator" placeholder=""  size="small" id="alert-box-input-operator">
             <el-option :id="'operator-'+item.key" v-for="item in operators" :key="item.value" :label="item.label" :value="item.value"></el-option>
           </el-select>
         </el-form-item>
         <!--threshold-->
         <el-form-item :label="$t('alert.config.threshold')" prop="threshold" style="width: 415px;display: inline-block;">
-          <el-input type="text" placeholder="" v-model="editAlertRule.threshold" size="small" >
+          <el-input type="text" placeholder="" v-model="editAlertRule.threshold" size="small" id="alert-box-input-threshold">
           </el-input>
         </el-form-item>
         <!--unit-->
         <el-form-item :label="$t('alert.config.unit')" prop="unit">
-          <el-cascader filterable placeholder="" popper-class="no-style-class unit-popper-class" size="small" style="width: 100%"
+          <el-cascader filterable placeholder="" popper-class="no-style-class unit-popper-class" size="small" style="width: 100%" id="alert-box-input-unit"
                        :options="unitOptions"
                        :props="{ expandTrigger: 'click',emitPath:false }"
                        :show-all-levels="false"
@@ -52,13 +53,13 @@
         </el-form-item>
         <!--last-->
         <el-form-item :label="$t('alert.config.for')" prop="last">
-          <el-input type="text" placeholder="" v-model.number="editAlertRule.last" size="small">
+          <el-input type="text" placeholder="" v-model.number="editAlertRule.last" size="small" id="alert-box-input-last">
             <template slot="append">{{$t('alert.config.second')}}</template>
           </el-input>
         </el-form-item>
         <!--severity-->
         <el-form-item :label="$t('alert.severity')" prop="severity">
-          <el-select popper-class="config-dropdown" v-model="editAlertRule.severity" placeholder=""  size="small">
+          <el-select popper-class="config-dropdown" v-model="editAlertRule.severity" placeholder=""  size="small" id="alert-box-input-severity">
             <el-option :id="'alert-severity-'+item.value" v-for="item in $CONSTANTS.alertMessage.severityData" :key="item.value" :label="item.label" :value="item.value">
               <template v-if="!item.isEdit">{{item.label}}</template>
               <span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop>
@@ -78,6 +79,7 @@
         <!--receiver-->
         <el-form-item :label="$t('config.account.receiver')" prop="receiver">
           <el-select
+            id="alert-box-input-receiver"
             v-model.trim="editAlertRule.receiverShow"
             placeholder=""
             multiple
@@ -96,11 +98,11 @@
         </el-form-item>
         <!--summary-->
         <el-form-item :label="$t('alert.summary')" prop="summary">
-          <el-input maxlength="512" rows="3" type="textarea" show-word-limit placeholder="" v-model="editAlertRule.summary" size="small"></el-input>
+          <el-input maxlength="512" rows="3" type="textarea" show-word-limit placeholder="" v-model="editAlertRule.summary" size="small" id="alert-box-input-summary"></el-input>
         </el-form-item>
         <!--description-->
         <el-form-item :label="$t('alert.description')" prop="description">
-          <el-input maxlength="512" rows="4" show-word-limit type="textarea" placeholder="" v-model="editAlertRule.description" size="small"></el-input>
+          <el-input maxlength="512" rows="4" show-word-limit type="textarea" placeholder="" v-model="editAlertRule.description" size="small" id="alert-box-input-description"></el-input>
         </el-form-item>
       </el-form>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/assetBox.vue b/nezha-fronted/src/components/common/rightBox/assetBox.vue
index 0b04ab97c..69c09075b 100644
--- a/nezha-fronted/src/components/common/rightBox/assetBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/assetBox.vue
@@ -36,7 +36,7 @@
         <div class="right-box-line"></div>
         <!------------------------------------------资产类型---------------------------------------------->
         <el-form-item :label="$t('asset.assetType')" class="right-box-form-content" prop="model.type.code">
-          <el-select popper-class="asset-dropdown" size="small" v-model="editAsset.model.type.code" @change="getVendorAndModelOptionData(editAsset.model.type.code,$event)">
+          <el-select popper-class="asset-dropdown" size="small" v-model="editAsset.model.type.code" @change="getVendorAndModelOptionData(editAsset.model.type.code,$event)" id="alert-box-input-model-type">
             <el-option
               :id="'asset-edit-type-op-'+item.id"
               v-for="item in assetTypeData"
@@ -50,6 +50,7 @@
         <!------------------------------------------厂商/型号---------------------------------------------->
         <el-form-item :label="$t('asset.vendorModel')" class="right-box-form-content" prop="modelId">
           <el-cascader
+            id="alert-box-input-model-id"
             :options="vendorAndModelOptionData"
             :props="{emitPath: false}"
             :disabled="editAsset.model.type.code ? false : true"
@@ -61,11 +62,12 @@
             @change="modelChange"
           >
           </el-cascader>
-          <span @click="addVendor(editAsset.model.type.code)"  class="right-box-form-add" style="vertical-align: middle" v-has="'asset_vendor_toAdd'"><i class="nz-icon nz-icon-plus"></i></span>
+          <span id="asset-box-add-vendor" @click="addVendor(editAsset.model.type.code)"  class="right-box-form-add" style="vertical-align: middle" v-has="'asset_vendor_toAdd'"><i class="nz-icon nz-icon-plus"></i></span>
         </el-form-item>
         <el-form-item :label="$t('asset.purchaseDate')">
           <div class="select-style">
             <el-date-picker
+              id="asset-box-input-parchase-date"
               size="small"
               v-model="editAsset.purchaseDate"
               value-format="yyyy-MM-dd"
@@ -99,7 +101,7 @@
               <div>Value</div>
               <div>Action</div>
             </div>
-            <div style="height: calc(100% - 32px); overflow: auto">
+            <div style="height: calc(100% - 32px); overflow: auto" id="asset-box-tags">
               <div class="tag-edit-box-body" v-for="(item, index) in editAsset.tags">
                 <el-form-item class="tag-edit tag-edit-tag" :rules="{required: true, message: $t('validate.required'), trigger: 'change'}" :prop="'tags.' + index + '.tag'">
                   <el-autocomplete placeholder="tag" size="mini" v-model="item.tag" :fetch-suggestions="filterKey" @blur="loadValues(item)" @select="loadValues" popper-class="no-style-class"></el-autocomplete>
@@ -123,7 +125,7 @@
               <span><i class="nz-icon nz-icon-create-square"></i></span>
             </button>
             <ul class="el-select-dropdown__list">
-              <li @click="addAccount(type)" v-for="(type, index) in selectableAccountTypes" :key="index" class="el-select-dropdown__item"><span>{{type}}</span></li>
+              <li @click="addAccount(type)" v-for="(type, index) in selectableAccountTypes" :key="index" class="el-select-dropdown__item" :id="'asset-box-acount-'+type"><span>{{type}}</span></li>
             </ul>
           </el-popover>
         </div>
@@ -143,7 +145,7 @@
 
         <template v-if="accountType == 'SSH' && !editAsset.id">
           <el-form-item :label="$t('asset.exporter')" class="exporter-label" style="margin-left: 66px">
-            <el-switch class="exporter-switch" v-model="editAsset.exporter" active-color="#ee9d3f" active-value="1" inactive-value="0" :show="!exporterDisableSwitch"></el-switch>
+            <el-switch class="exporter-switch" v-model="editAsset.exporter" active-color="#ee9d3f" active-value="1" inactive-value="0" :show="!exporterDisableSwitch" id="account-box-input-exporter"></el-switch>
           </el-form-item>
         </template>
       </el-form>
diff --git a/nezha-fronted/src/components/common/rightBox/batchEditAsset.vue b/nezha-fronted/src/components/common/rightBox/batchEditAsset.vue
index 84f40d400..8479ee06e 100644
--- a/nezha-fronted/src/components/common/rightBox/batchEditAsset.vue
+++ b/nezha-fronted/src/components/common/rightBox/batchEditAsset.vue
@@ -33,7 +33,7 @@
                     <i v-if="!assetSearch.dropdownShow" class="nz-icon nz-icon-caret-bottom"></i>
                   </span>
                 </button>
-                <el-input style="width: 100px;" @keydown.enter.native="searchAssetKeydown"
+                <el-input style="width: 100px;" @keydown.enter.native="searchAssetKeydown" id="batch-edit-search-input"
                           class="input-x-mini-24 nz-input-group-middle" placeholder=""
                           v-model="assetSearch.text"></el-input>
                 <button
@@ -45,7 +45,7 @@
                   <div @click="dropdownSelect('Host')" class="endpoint-asset-search-dropdown-item" id="search-asset-ip">
                     Host
                   </div>
-                  <div @click="dropdownSelect('SN')" class="endpoint-asset-search-dropdown-item" id="search-asset-sn">
+                  <div @click="dropdownSelect('SN')" class="endpoint-asset-search-dropdown-item" id="search-asset-sn" >
                     SN
                   </div>
                 </div>
@@ -57,7 +57,7 @@
             <div class="endpoint-sub-table">
               <div class="endpoint-sub-table-head">
                 <div class="endpoint-sub-table-col" style="width: 15px;">
-                  <el-checkbox v-model="assetListAll" :indeterminate="assetListHalf"
+                  <el-checkbox v-model="assetListAll" :indeterminate="assetListHalf" id="batch-edit-select-all"
                                @change="assetListSelAll"></el-checkbox>
                 </div>
                 <div class="endpoint-sub-table-col">Host</div>
@@ -69,7 +69,7 @@
                   <div :data="item.id" v-for="item,index in assetList" class="endpoint-sub-table-row"
                        :id="'select-asset-'+item.id">
                     <div class="endpoint-sub-table-col" style="width: 15px;">
-                      <el-checkbox v-model="item.sel" @change="selectAsset"></el-checkbox>
+                      <el-checkbox v-model="item.sel" @change="selectAsset" id="batch-edit-select-one"></el-checkbox>
                     </div>
                     <div class="endpoint-sub-table-col" style="width: 50%">{{item.host}}</div>
                     <el-popover trigger="hover" placement="right-start" :content="item.sn">
@@ -82,7 +82,7 @@
             </div>
             <div class="line-100" style="border-color:#dcdfe6"></div>
             <div>
-              <button type="button" @click="addToEndpointList"
+              <button type="button" @click="addToEndpointList" id="batch-edit-add-list"
                       class="nz-btn nz-btn-size-small-new nz-btn-style-light-new endpoints-clear-btn"
               style="margin-top: 3px;">
                 {{$t('overall.addAssetList')}}
@@ -182,7 +182,7 @@
               <div>Value</div>
               <div>Action</div>
             </div>
-            <div ref="tagEditBoxScrollbar" style="height: calc(100% - 32px); overflow: auto;">
+            <div ref="tagEditBoxScrollbar" style="height: calc(100% - 32px); overflow: auto;" id="batch-edit-tags-box">
               <div class="tag-edit-box-body" v-for="(item, index) in editAsset.tags">
                 <el-form-item class="tag-edit tag-edit-tag"
                               :rules="{required: true, message: $t('validate.required'), trigger: 'change'}"
@@ -215,8 +215,8 @@
                     :class="{'nz-btn-disabled': editAsset.accounts.length == 3}">
               <span><i class="nz-icon nz-icon-create-square"></i></span>
             </button>
-            <ul class="el-select-dropdown__list">
-              <li @click="addAccount(type)" v-for="(type, index) in selectableAccountTypes" :key="index"
+            <ul class="el-select-dropdown__list" >
+              <li @click="addAccount(type)" v-for="(type, index) in selectableAccountTypes" :key="index" :id="'batch-edit-account-'+type"
                   class="el-select-dropdown__item"><span>{{type}}</span></li>
             </ul>
           </el-popover>
diff --git a/nezha-fronted/src/components/common/rightBox/cabinetBox.vue b/nezha-fronted/src/components/common/rightBox/cabinetBox.vue
index 21d9d623f..5c7e1810d 100644
--- a/nezha-fronted/src/components/common/rightBox/cabinetBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/cabinetBox.vue
@@ -17,16 +17,16 @@
     <div class="right-box-form-box">
       <el-form class="right-box-form right-box-form-left" label-width="120px" label-position="right" :model="editCabinet" ref="cabinetForm" :rules="rules">
         <el-form-item :label="$t('overall.name')" prop="name">
-          <el-input size='mini' v-model="editCabinet.name"/>
+          <el-input size='mini' v-model="editCabinet.name" id="cabinet-box-input-name"/>
         </el-form-item>
         <el-form-item :label="$t('config.dc.dc')" prop="idcId">
-          <el-input size='mini' v-model="currentDc.name" disabled/>
+          <el-input size='mini' v-model="currentDc.name" disabled id="cabinet-box-input-dc"/>
         </el-form-item>
         <el-form-item :label="$t('asset.uSize')" prop="uSize">
-          <el-input v-model.number="editCabinet.uSize" :max="47" ></el-input>
+          <el-input v-model.number="editCabinet.uSize" :max="47" id="cabinet-box-input-uSize"></el-input>
         </el-form-item>
         <el-form-item :label="$t('config.dc.remark')">
-          <el-input size='mini' v-model="editCabinet.remark" type="textarea" :rows="2"/>
+          <el-input size='mini' v-model="editCabinet.remark" type="textarea" :rows="2" id="cabinet-box-input-remark"/>
         </el-form-item>
       </el-form>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/dcBox.vue b/nezha-fronted/src/components/common/rightBox/dcBox.vue
index 8c38bbe71..917a2ff92 100644
--- a/nezha-fronted/src/components/common/rightBox/dcBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/dcBox.vue
@@ -17,16 +17,16 @@
       <div class="right-box-form-box">
         <el-form class="right-box-form right-box-form-left" label-width="120px" :model="editDc" label-position="right" :rules="rules" ref="dcForm">
           <el-form-item :label='$t("overall.name")' prop="name">
-            <el-input placeholder="" maxlength="64" show-word-limit v-model="editDc.name" size="small"></el-input>
+            <el-input placeholder="" maxlength="64" show-word-limit v-model="editDc.name" size="small" id="dc-box-input-name"></el-input>
           </el-form-item>
           <el-form-item :label='$t("asset.location")' prop="location">
-            <el-input placeholder="" v-model="editDc.location" size="small"></el-input>
+            <el-input placeholder="" v-model="editDc.location" size="small" id="dc-box-input-location"></el-input>
           </el-form-item>
           <el-form-item :label='$t("asset.tel")' prop="tel">
-            <el-input placeholder="" v-model="editDc.tel" size="small"></el-input>
+            <el-input placeholder="" v-model="editDc.tel" size="small" id="dc-box-input-tel"></el-input>
           </el-form-item>
           <el-form-item :label='$t("asset.principal")' prop="principal">
-            <el-select value-key="id" popper-class="config-dropdown" v-model="editDc.principal" placeholder="" size="small">
+            <el-select value-key="id" popper-class="config-dropdown" v-model="editDc.principal" placeholder="" size="small" id="dc-box-input-principal">
               <el-option @click.native="" v-for="item in userData" :key="item.userId" :label="item.username" :value="item.userId" :id="'dc-principal-op-'+item.userId">
                 <span>{{item.username}}</span>
               </el-option>
@@ -41,6 +41,7 @@
           <!--</el-form-item>-->
           <el-form-item :label='$t("config.dc.state")' prop="state">
             <el-switch
+              id="dc-box-input-name"
               v-model="editDc.state"
               active-value="ON"
               inactive-value="OFF"
@@ -50,6 +51,7 @@
           </el-form-item>
           <el-form-item :label='$t("config.dc.longitude")' prop="longitude" :rules="[{required:coordinateFlag,trigger:'blur'}]">
             <el-input-number
+              id="dc-box-input-longitude"
               placeholder=""
               v-model="editDc.longitude"
               size="small"
@@ -63,6 +65,7 @@
           </el-form-item>
           <el-form-item :label='$t("config.dc.latitude")' prop="latitude"  :rules="[{required:coordinateFlag,trigger:'blur'}]">
             <el-input-number
+              id="dc-box-input-latitude"
               placeholder=""
               v-model="editDc.latitude"
               size="small"
diff --git a/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue b/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue
index 74b263a0b..0cff51cb7 100644
--- a/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/editEndpointBox.vue
@@ -18,19 +18,20 @@
       <el-form class="right-box-form  right-box-form-left" :model="editEndpoint" label-position="right" label-width="120px" :rules="rules" ref="endpointForm">
         <!--project-->
         <el-form-item :label="$t('project.project.project')" prop="project.id">
-          <el-select @change="((val) => {changeProject(val);})" value-key="id" popper-class="config-dropdown" v-model="editEndpoint.projectId" placeholder="" size="small">
+          <el-select @change="((val) => {changeProject(val);})" value-key="id" popper-class="config-dropdown" v-model="editEndpoint.projectId" placeholder="" size="small" id="edit-endpoint-input-project">
             <el-option :id="'edit-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option>
           </el-select>
         </el-form-item>
         <!--module-->
         <el-form-item :label="$t('project.module.module')" prop="module.id">
-          <el-select @change="((val) => {changeModule(val);})" value-key="id" popper-class="config-dropdown" v-model="editEndpoint.moduleId" placeholder="" size="small">
+          <el-select @change="((val) => {changeModule(val);})" value-key="id" popper-class="config-dropdown" v-model="editEndpoint.moduleId" placeholder="" size="small" id="edit-endpoint-input-project">
             <el-option :id="'edit-module-'+item.id" v-for="item in moduleList" :key="item.id" :label="item.name" :value="item.id"></el-option>
           </el-select>
         </el-form-item>
         <!--asset-->
         <el-form-item :label="$t('asset.asset')" prop="assetId">
           <el-autocomplete
+            id="edit-endpoint-input-project"
             :fetch-suggestions="assetSuggestion"
             v-model.trim="editEndpoint.asset.host"
             placeholder=""
@@ -46,15 +47,15 @@
         </el-form-item>
         <!--host-->
         <el-form-item :label="$t('project.endpoint.host')" prop="host">
-          <el-input placeholder="" v-model="editEndpoint.host" size="small"></el-input>
+          <el-input placeholder="" v-model="editEndpoint.host" size="small" id="edit-endpoint-input-host"></el-input>
         </el-form-item>
         <!--port-->
         <el-form-item :label="$t('project.endpoint.port')" prop="port">
-          <el-input placeholder="" v-model="editEndpoint.port" size="small"></el-input>
+          <el-input placeholder="" v-model="editEndpoint.port" size="small" id="edit-endpoint-input-port"></el-input>
         </el-form-item>
         <!--path-->
         <el-form-item :label="$t('project.endpoint.path')" prop="path" v-if="editEndpoint.module.type.toLowerCase() == 'http'">
-          <el-input placeholder="" v-model="editEndpoint.path" size="small"></el-input>
+          <el-input placeholder="" v-model="editEndpoint.path" size="small" id="edit-endpoint-input-path"></el-input>
         </el-form-item>
         <!--param-->
         <el-form-item class="right-box-form-param" v-if="editEndpoint.module.type.toLowerCase() == 'http'">
@@ -71,8 +72,8 @@
             </span>
           </div>
           <div class="param-box param-box-module">
-            <div style="height: 100%; overflow: auto">
-              <div class="param-box-row" v-for="(item, index) in editEndpoint.paramObj">
+            <div style="height: 100%; overflow: auto" id="edit-endpoint-params">
+              <div class="param-box-row" v-for="(item, index) in editEndpoint.paramObj" >
                 <el-form-item class="param-box-row-key" :rules="{required: true, message: $t('validate.required'), trigger: 'blur'}" :prop="'paramObj.' + index + '.key'">
                   <el-input placeholder="key" size="mini" v-model="item.key"></el-input>
                 </el-form-item>
@@ -99,8 +100,8 @@
           </div>
 
           <div class="param-box param-box-module">
-            <div ref="labelBoxScrollbar" style="height: 100%; overflow: auto;">
-              <div class="param-box-row" v-for="(item, index) in editEndpoint.labelModule">
+            <div ref="labelBoxScrollbar" style="height: 100%; overflow: auto;" id="edit-endpoint-labels">
+              <div class="param-box-row" v-for="(item, index) in editEndpoint.labelModule" >
                 <el-form-item class="param-box-row-key" :rules="[{required: true, message: $t('validate.required'), trigger: 'blur'},{ pattern: /[a-zA-Z_:][a-zA-Z0-9_:]*/, message: $t('validate.key') ,trigger: 'blur'}]" :prop="'labelModule.' + index + '.key'">
                   <el-input placeholder="key" size="mini" v-model="item.key"></el-input>
                 </el-form-item>
@@ -115,7 +116,7 @@
         </el-form-item>
         <!--enable-->
         <el-form-item :label="$t('config.account.enable')">
-          <el-switch v-model.number="editEndpoint.enabled" active-color="#ee9d3f" :active-value="1" :inactive-value="0"></el-switch>
+          <el-switch v-model.number="editEndpoint.enabled" active-color="#ee9d3f" :active-value="1" :inactive-value="0" id="edit-endpoint-input-enabled"></el-switch>
         </el-form-item>
       </el-form>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/menuBox.vue b/nezha-fronted/src/components/common/rightBox/menuBox.vue
index 81de3b9b9..ce9cd1af3 100644
--- a/nezha-fronted/src/components/common/rightBox/menuBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/menuBox.vue
@@ -19,32 +19,32 @@
     <div class="right-box-form-box">
       <el-form :model="editMenu" :rules="rules" class="right-box-form right-box-form-left" label-position="right" label-width="130px" ref="menuForm" size="small">
         <el-form-item :label="$t('config.menus.parent')" prop="parentId">
-          <tree-select :multiple="false" :options="menus" label="id" noChildrenText="" noOptionsText="" placeholder="" v-model="editMenu.parentId"></tree-select>
+          <tree-select :multiple="false" :options="menus" label="id" noChildrenText="" noOptionsText="" placeholder="" v-model="editMenu.parentId" id="menu-box-input-parent"></tree-select>
         </el-form-item>
         <el-form-item :label="$t('config.menus.type')" prop="type">
-          <el-radio-group v-model="editMenu.type">
+          <el-radio-group v-model="editMenu.type" id="menu-box-input-type">
             <el-radio :label="1">{{$t('config.menus.menu')}}</el-radio>
             <el-radio :label="2">{{$t('config.menus.button')}}</el-radio>
           </el-radio-group>
         </el-form-item>
         <!--name-->
         <el-form-item :label="$t('config.menus.name')" prop="name">
-          <el-input  placeholder="" type="text" v-model="editMenu.name" ></el-input>
+          <el-input  placeholder="" type="text" v-model="editMenu.name" id="menu-box-input-name"></el-input>
         </el-form-item>
         <el-form-item :label="$t('config.menus.code')" prop="code">
-          <el-input  placeholder="" type="text" v-model="editMenu.code" ></el-input>
+          <el-input  placeholder="" type="text" v-model="editMenu.code" id="menu-box-input-code"></el-input>
         </el-form-item>
         <el-form-item :label="$t('config.menus.i18n')" prop="i18n">
-          <el-input  placeholder="" type="text" v-model="editMenu.i18n" ></el-input>
+          <el-input  placeholder="" type="text" v-model="editMenu.i18n" id="menu-box-input-i18n"></el-input>
         </el-form-item>
         <el-form-item :label="$t('config.menus.route')" prop="route">
-          <el-input  placeholder="" type="text" v-model="editMenu.route" ></el-input>
+          <el-input  placeholder="" type="text" v-model="editMenu.route" id="menu-box-input-route"></el-input>
         </el-form-item>
         <!--<el-form-item :label="$t('config.menus.perms')" prop="perms">
           <el-input  type="text" placeholder="" v-model="editMenu.perms" ></el-input>
         </el-form-item>-->
         <el-form-item :label="$t('config.menus.orderNum')" prop="orderNum">
-          <el-input-number :max="1000" :min="1" :precision="0" controls-position="right" style="width: 100%;" v-model="editMenu.orderNum" ></el-input-number>
+          <el-input-number :max="1000" :min="1" :precision="0" controls-position="right" style="width: 100%;" v-model="editMenu.orderNum" id="menu-box-input-orderNum"></el-input-number>
         </el-form-item>
 
         <div class="right-box-sub-title">{{$t('config.menus.perms')}}
@@ -54,11 +54,12 @@
         </div>
 
         <div class="right-box-line"></div>
-
-        <el-form-item :key="index" :label="index+1+''" v-for="(permission,index) in editMenu.permissions" >
-          <el-input oninput="this.value = this.value.replace(/[,]/g,'')" placeholder="" style="width: calc(100% - 37px);" type="text" v-model="editMenu.permissions[index].value"></el-input>
-          <span @click="removePermission(index)" style="padding-left: 5px;"><i class="nz-icon nz-icon-shanchu1"></i></span>
-        </el-form-item>
+        <div id="menu-box-permissions">
+          <el-form-item :key="index" :label="index+1+''" v-for="(permission,index) in editMenu.permissions" >
+            <el-input oninput="this.value = this.value.replace(/[,]/g,'')" placeholder="" style="width: calc(100% - 37px);" type="text" v-model="editMenu.permissions[index].value" ></el-input>
+            <span @click="removePermission(index)" style="padding-left: 5px;"><i class="nz-icon nz-icon-shanchu1"></i></span>
+          </el-form-item>
+        </div>
       </el-form>
     </div>
     <!-- end--表单-->
diff --git a/nezha-fronted/src/components/common/rightBox/mibBox.vue b/nezha-fronted/src/components/common/rightBox/mibBox.vue
index 5d8f192fb..c0da3c096 100644
--- a/nezha-fronted/src/components/common/rightBox/mibBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/mibBox.vue
@@ -18,6 +18,7 @@
       <el-form class="right-box-form  right-box-form-left" :model="editMib" label-position="right" label-width="120px" :rules="rules" ref="mibForm">
         <el-form-item :label='$t("config.mib.models")' prop="models" :rules="[{validator:checkModels,trigger:'change'}]" >
           <el-cascader
+            id="mib-input-selected-models"
             :options="modelOptions"
             :props="modelProps"
             :show-all-levels="false"
@@ -31,10 +32,10 @@
             clearable></el-cascader>
         </el-form-item>
         <el-form-item :label="$t('config.mib.remark')" prop="remark">
-          <el-input maxlength="512" rows="4" show-word-limit type="textarea" placeholder="" v-model="editMib.remark" size="small"></el-input>
+          <el-input maxlength="512" rows="4" show-word-limit type="textarea" placeholder="" v-model="editMib.remark" size="small" id="mib-box-input-remark"></el-input>
         </el-form-item>
         <el-form-item :label="$t('config.mib.mibFiles')" prop="file" :rules="[{validator:checkMibFile,trigger:'change'}]" :class="{'add-required':!editMib.id}">
-          <el-upload drag :multiple="false" action="" :file-list="uploadFileList" :on-change="uploadChange" :auto-upload="false" accept="" :on-remove="afterClearFile" ref="mibFileUpload" class="mib-upload right-box-form-row">
+          <el-upload drag :multiple="false" action="" :file-list="uploadFileList" :on-change="uploadChange" :auto-upload="false" accept="" :on-remove="afterClearFile" ref="mibFileUpload" class="mib-upload right-box-form-row" id="mib-box-input-file">
             <div slot="tip" class="el-upload__tip" >
               <span v-if="editMib.fileName">{{editMib.fileName}}</span>
               <span v-if="uploadErrorMsg" style="color: #F56C6C"><br>{{uploadErrorMsg}}</span>
diff --git a/nezha-fronted/src/components/common/rightBox/modelBox.vue b/nezha-fronted/src/components/common/rightBox/modelBox.vue
index 4195a40b2..5b177c6d6 100644
--- a/nezha-fronted/src/components/common/rightBox/modelBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/modelBox.vue
@@ -18,11 +18,12 @@
       <el-form class="right-box-form right-box-form-left" :model="editModel" label-position="right" label-width="120px"  :rules="rules" ref="modelForm">
         <!--model名称-->
         <el-form-item :label='$t("overall.name")' prop="name">
-          <el-input placeholder="" maxlength="64" show-word-limit v-model.trim="editModel.name" size="small"></el-input>
+          <el-input placeholder="" maxlength="64" show-word-limit v-model.trim="editModel.name" size="small" id="model-box-input-name"></el-input>
         </el-form-item>
         <!--设备类型-->
         <el-form-item :label="$t('config.model.type')" prop="type">
           <el-autocomplete
+            id="model-box-input-type"
             :fetch-suggestions="typeSuggestion"
             v-model.trim="editModel.type.value"
             placeholder=""
@@ -46,6 +47,7 @@
         <!--厂商-->
         <el-form-item :label="$t('config.model.vendor')" prop="vendor">
           <el-autocomplete
+            id="model-box-input-vendor"
             :fetch-suggestions="vendorSuggestion"
             v-model.trim="editModel.vendor.value"
             placeholder=""
@@ -66,7 +68,7 @@
           </el-autocomplete>
         </el-form-item>
         <el-form-item :label="$t('asset.uSize')" prop="usize">
-          <el-input v-model.number="editModel.usize" :max="47" size="small"></el-input>
+          <el-input v-model.number="editModel.usize" :max="47" size="small" id="model-box-input-usize"></el-input>
         </el-form-item>
       </el-form>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/moduleBox.vue b/nezha-fronted/src/components/common/rightBox/moduleBox.vue
index 7922d51b6..eaa96523b 100644
--- a/nezha-fronted/src/components/common/rightBox/moduleBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/moduleBox.vue
@@ -17,12 +17,12 @@
     <div class="right-box-form-box" ref="scrollbar">
       <el-form class="right-box-form right-box-form-left" :model="editModule" label-position="right" label-width="120px" :rules="rules" ref="moduleForm">
         <el-form-item :label='$t("project.project.project")' prop="project">
-          <el-select value-key="id" popper-class="config-dropdown" v-model="editModule.project" placeholder="" size="small">
+          <el-select value-key="id" popper-class="config-dropdown" v-model="editModule.project" placeholder="" size="small" id="module-box-input-project">
             <el-option :id="'module-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item"></el-option>
           </el-select>
         </el-form-item>
         <el-form-item :label='$t("project.module.moduleName")' prop="name" label-width="180px" style="width: calc(100% - 8px);margin-left: 8px;">
-          <el-input placeholder="" maxlength="64" show-word-limit v-model="editModule.name" size="small"></el-input>
+          <el-input placeholder="" maxlength="64" show-word-limit v-model="editModule.name" size="small" id="module-box-input-name"></el-input>
         </el-form-item>
 
         <div class="nz-tab module-box-type" style="margin-bottom: 15px;">
@@ -74,7 +74,7 @@
             </el-col>
             <el-col :span="18">
               <el-form-item prop="version">
-                <el-radio-group v-model.number="editModule.version" size="small">
+                <el-radio-group v-model.number="editModule.version" size="small" id="module-box-input-version">
                   <el-radio-button :label="2"></el-radio-button>
                   <el-radio-button :label="3"></el-radio-button>
                 </el-radio-group>
@@ -88,7 +88,7 @@
             </el-col>
             <el-col :span="18">
               <el-form-item prop="max_repetitions">
-                <el-input v-model.number="editModule.max_repetitions" size="small"></el-input>
+                <el-input v-model.number="editModule.max_repetitions" size="small" id="module-box-input-max_repetitions"></el-input>
               </el-form-item>
             </el-col>
           </el-row>
@@ -99,7 +99,7 @@
             </el-col>
             <el-col :span="18">
               <el-form-item prop="retries">
-                <el-input v-model.number="editModule.retries" size="small"></el-input>
+                <el-input v-model.number="editModule.retries" size="small" id="module-box-input-retries"></el-input>
               </el-form-item>
             </el-col>
           </el-row>
@@ -110,7 +110,7 @@
             </el-col>
             <el-col :span="18">
               <el-form-item prop="timeout">
-                <el-input v-model.number="editModule.timeout" size="small">
+                <el-input v-model.number="editModule.timeout" size="small" id="module-box-input-timeout">
                   <template slot="append">second</template>
                 </el-input>
               </el-form-item>
@@ -130,7 +130,7 @@
             </el-col>
             <el-col :span="18">
               <el-form-item prop="community">
-                <el-input v-model.trim="editModule.community" maxlength="64" show-word-limit size="small"></el-input>
+                <el-input v-model.trim="editModule.community" maxlength="64" show-word-limit size="small" id="module-box-input-community"></el-input>
               </el-form-item>
             </el-col>
           </el-row>
@@ -143,7 +143,7 @@
               </el-col>
               <el-col :span="18">
                 <el-form-item prop="username">
-                  <el-input v-model.trim="editModule.username" maxlength="64" show-word-limit size="small"></el-input>
+                  <el-input v-model.trim="editModule.username" maxlength="64" show-word-limit size="small" id="module-box-input-username"></el-input>
                 </el-form-item>
               </el-col>
             </el-row>
@@ -154,7 +154,7 @@
               </el-col>
               <el-col :span="18">
                 <el-form-item prop="security_level">
-                  <el-radio-group size="small" v-model="editModule.security_level">
+                  <el-radio-group size="small" v-model="editModule.security_level" id="module-box-input-security_level">
                     <el-radio-button label="noAuthNoPriv"></el-radio-button>
                     <el-radio-button label="authNoPriv"></el-radio-button>
                     <el-radio-button label="authPriv"></el-radio-button>
@@ -169,7 +169,7 @@
               </el-col>
               <el-col :span="18">
                 <el-form-item prop="password">
-                  <el-input v-model.trim="editModule.password" type="password" show-password maxlength="64" show-word-limit size="small"></el-input>
+                  <el-input v-model.trim="editModule.password" type="password" show-password maxlength="64" show-word-limit size="small" id="module-box-input-password"></el-input>
                 </el-form-item>
               </el-col>
             </el-row>
@@ -180,7 +180,7 @@
               </el-col>
               <el-col :span="18">
                 <el-form-item prop="auth_protocol">
-                  <el-radio-group v-model="editModule.auth_protocol" size="small">
+                  <el-radio-group v-model="editModule.auth_protocol" size="small" id="module-box-input-auth_protocol">
                     <el-radio-button label="MD5"></el-radio-button>
                     <el-radio-button label="SHA"></el-radio-button>
                   </el-radio-group>
@@ -194,7 +194,7 @@
               </el-col>
               <el-col :span="18">
                 <el-form-item prop="priv_protocol">
-                  <el-radio-group v-model="editModule.priv_protocol" size="small">
+                  <el-radio-group v-model="editModule.priv_protocol" size="small" id="module-box-input-priv_protocol">
                     <el-radio-button label="DES"></el-radio-button>
                     <el-radio-button label="AES"></el-radio-button>
                   </el-radio-group>
@@ -208,7 +208,7 @@
               </el-col>
               <el-col :span="18">
                 <el-form-item prop="priv_password">
-                  <el-input v-model.trim="editModule.priv_password" type="password" show-password maxlength="64" show-word-limit size="small"></el-input>
+                  <el-input v-model.trim="editModule.priv_password" type="password" show-password maxlength="64" show-word-limit size="small" id="module-box-input-priv_password"></el-input>
                 </el-form-item>
               </el-col>
             </el-row>
@@ -220,7 +220,7 @@
             </el-col>
             <el-col :span="18">
               <el-form-item prop="context_name">
-                <el-input v-model.trim="editModule.context_name" maxlength="64" show-word-limit size="small"></el-input>
+                <el-input v-model.trim="editModule.context_name" maxlength="64" show-word-limit size="small" id="module-box-input-context_name"></el-input>
               </el-form-item>
             </el-col>
           </el-row>
@@ -233,11 +233,11 @@
         </div>
 
         <el-form-item :label='$t("project.endpoint.port")' prop="port" >
-          <el-input placeholder="" v-model.number="editModule.port" size="small"></el-input>
+          <el-input placeholder="" v-model.number="editModule.port" size="small" id="module-box-input-port"></el-input>
         </el-form-item>
 
         <el-form-item v-if="editModule.type && editModule.type.toLowerCase() == 'http'" :label='$t("project.endpoint.path")' prop="path">
-          <el-input placeholder="" v-model="editModule.path" size="small"></el-input>
+          <el-input placeholder="" v-model="editModule.path" size="small" id="module-box-input-path"></el-input>
         </el-form-item>
 
         <el-form-item :label="$t('project.endpoint.param')" class="right-box-form-param" v-if="editModule.type.toLowerCase() == 'http'">
@@ -253,10 +253,10 @@
           </div>
 
           <div class="param-box param-box-module">
-            <div style="height: 100%; overflow: auto;">
+            <div style="height: 100%; overflow: auto;" id="module-box-params">
               <div class="param-box-row" v-for="(item, index) in editModule.paramObj">
                 <el-form-item class="param-box-row-key" :rules="{required: true, message: $t('validate.required'), trigger: 'blur'}" :prop="'paramObj.' + index + '.key'">
-                  <el-input placeholder="key" size="mini" v-model="item.key"></el-input>
+                  <el-input placeholder="key" size="mini" v-model="item.key" ></el-input>
                 </el-form-item>
                 <span class="param-box-row-eq">=</span>
                 <el-form-item class="param-box-row-value" :rules="{required: true, message: $t('validate.required'), trigger: 'blur'}" :prop="'paramObj.' + index + '.value'">
@@ -281,7 +281,7 @@
           </div>
 
           <div class="param-box param-box-module">
-            <div ref="labelBoxScrollbar" style="height: 100%; overflow: auto;">
+            <div ref="labelBoxScrollbar" style="height: 100%; overflow: auto;" id="module-box-labels">
               <div class="param-box-row" v-for="(item, index) in editModule.labelModule">
                 <el-form-item class="param-box-row-key" :rules="[{required: true, message: $t('validate.required'), trigger: 'blur'},{ pattern: /[a-zA-Z_:][a-zA-Z0-9_:]*/, message: $t('validate.key') ,trigger: 'blur'}]" :prop="'labelModule.' + index + '.key'">
                   <el-input placeholder="key" size="mini" v-model="item.key"></el-input>
@@ -297,7 +297,7 @@
         </el-form-item>
 
         <el-form-item :label='$t("project.module.description")' prop="remark">
-          <el-input type="textarea" placeholder="" maxlength="1024" show-word-limit v-model="editModule.remark" size="small"></el-input>
+          <el-input type="textarea" placeholder="" maxlength="1024" show-word-limit v-model="editModule.remark" size="small" id="module-box-input-project"></el-input>
         </el-form-item>
 
       </el-form>
diff --git a/nezha-fronted/src/components/common/rightBox/panelBox.vue b/nezha-fronted/src/components/common/rightBox/panelBox.vue
index c34f47345..fa0ff0438 100644
--- a/nezha-fronted/src/components/common/rightBox/panelBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/panelBox.vue
@@ -18,7 +18,7 @@
       <div class="right-box-form-box">
         <el-form class="right-box-form right-box-form-left" label-width="120px"  :model="panel" label-position="right" ref="panelForm">
           <el-form-item :label='$t("overall.name")' prop="name" :rules="{required: true, message: $t('validate.required'), trigger: 'blur'}">
-            <el-input placeholder="" maxlength="64" show-word-limit v-model="panel.name" size="small" ></el-input>
+            <el-input placeholder="" maxlength="64" show-word-limit v-model="panel.name" size="small" id="panel-box-input-name"></el-input>
           </el-form-item>
         </el-form>
       </div>
@@ -26,10 +26,10 @@
 
       <!-- begin--底部按钮-->
       <div class="right-box-bottom-btns">
-        <button v-cancel="{obj:panel,func:esc}" id="module-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+        <button v-cancel="{obj:panel,func:esc}" id="panel-box-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
           <span>{{$t('overall.cancel')}}</span>
         </button>
-        <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="module-box-save">
+        <button :class="{'nz-btn-disabled':prevent_opt.save}" :disabled="prevent_opt.save" @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="panel-box-save">
           <span>{{$t('overall.save')}}</span>
         </button>
       </div>
diff --git a/nezha-fronted/src/components/common/rightBox/projectBox.vue b/nezha-fronted/src/components/common/rightBox/projectBox.vue
index 7fdc2d419..ca15dbfbf 100644
--- a/nezha-fronted/src/components/common/rightBox/projectBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/projectBox.vue
@@ -15,10 +15,10 @@
     <div class="right-box-form-box">
       <el-form class="right-box-form right-box-form-left" :model="editProject" label-position="right" label-width="120px" :rules="rules" ref="projectForm">
         <el-form-item :label='$t("project.project.projectName")' prop="name">
-          <el-input size="mini" maxlength="64" show-word-limit v-model="editProject.name"></el-input>
+          <el-input size="mini" maxlength="64" show-word-limit v-model="editProject.name" id="project-box-input-name"></el-input>
         </el-form-item>
         <el-form-item :label='$t("project.project.description")'>
-          <el-input size="mini" type="textarea" maxlength="1024" show-word-limit v-model="editProject.remark"></el-input>
+          <el-input size="mini" type="textarea" maxlength="1024" show-word-limit v-model="editProject.remark" id="project-box-input-remark"></el-input>
         </el-form-item>
       </el-form>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/promServerBox.vue b/nezha-fronted/src/components/common/rightBox/promServerBox.vue
index 45627f976..e040ef97b 100644
--- a/nezha-fronted/src/components/common/rightBox/promServerBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/promServerBox.vue
@@ -21,7 +21,7 @@
         <!--DC-->
         <el-form-item :label="$t('config.dc.dc')" prop="idc.name">
           <div class="right-box-form-content">
-            <el-select value-key="id" popper-class="config-dropdown" v-model="editPromServer.idc" placeholder="" size="small">
+            <el-select value-key="id" popper-class="config-dropdown" v-model="editPromServer.idc" placeholder="" size="small" id="prom-box-input-idc">
               <el-option v-for="item in dcData" :key="item.id" :label="item.name" :value="item" :id="'prom-edit-idc-op-'+item.id">
                 <span class="config-dropdown-label-txt">{{item.name}}</span>
               </el-option>
@@ -31,15 +31,16 @@
 
         <!--host-->
         <el-form-item label="Host" prop="host">
-          <el-input type="text" placeholder="" v-model="editPromServer.host" size="small"></el-input>
+          <el-input type="text" placeholder="" v-model="editPromServer.host" size="small" id="prom-box-input-host"></el-input>
         </el-form-item>
         <!--Port-->
         <el-form-item label="Port" prop="port">
-          <el-input type="text" placeholder="" v-model.number="editPromServer.port" size="small"></el-input>
+          <el-input type="text" placeholder="" v-model.number="editPromServer.port" size="small" id="prom-box-input-port"></el-input>
         </el-form-item>
         <!--type-->
         <el-form-item :label="$t('config.promServer.type')" prop="type">
           <el-cascader
+            id="prom-box-input-type"
             style="width: 100%"
             v-model="editPromServer.type"
             placeholder=""
diff --git a/nezha-fronted/src/components/common/rightBox/roleBox.vue b/nezha-fronted/src/components/common/rightBox/roleBox.vue
index 26a7858f1..7468e70f2 100644
--- a/nezha-fronted/src/components/common/rightBox/roleBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/roleBox.vue
@@ -20,11 +20,11 @@
       <el-form :disabled="detail" :model="editRole" :rules="rules" class="right-box-form right-box-form-left" label-position="right" label-width="120px" ref="roleForm">
         <!--name-->
         <el-form-item :label="$t('config.roles.name')" prop="name">
-          <el-input  maxlength="64" placeholder=""
+          <el-input  maxlength="64" placeholder="" id="role-box-input-name"
                     show-word-limit size="small" type="text" v-model="editRole.name"></el-input>
         </el-form-item>
         <el-form-item :label="$t('config.roles.remark')">
-          <el-input :rows="2" size='mini' type="textarea" v-model="editRole.remark"/>
+          <el-input :rows="2" size='mini' type="textarea" v-model="editRole.remark" id="role-box-input-remark"/>
         </el-form-item>
 
         <el-form-item :label="$t('config.roles.permission')">
@@ -32,7 +32,7 @@
             <button type="button" class="nz-btn nz-btn-size-small-new nz-btn-style-light-new option-btn" style="margin-left: 0px;" @click="expandAllOrNone" :class="{'btn-active':expandAllFlag}">展开/收缩</button>
             <button type="button" class="nz-btn nz-btn-size-small-new nz-btn-style-light-new option-btn" @click="selectAllOrNone" :class="{'btn-active':selectAllFlag}"><span ><i class="nz-icon nz-icon-delete"></i></span></button>
           </div>-->
-          <el-tree :data="menus" :default-expand-all="expandAllFlag" :props="{label:labelFormatter}"  @check-change="selectChange" class="tree-border" node-key="id" ref="menuTree" show-checkbox>
+          <el-tree :data="menus" :default-expand-all="expandAllFlag" :props="{label:labelFormatter}"  @check-change="selectChange" class="tree-border" node-key="id" ref="menuTree" show-checkbox id="role-box-input-menus">
             <div slot-scope="{node, data}" >
               <span>
                 <i class="el-icon-menu" v-if="data.type == '1'"></i>
diff --git a/nezha-fronted/src/components/common/rightBox/trafficSetting/subBox.vue b/nezha-fronted/src/components/common/rightBox/trafficSetting/subBox.vue
index 8c327c553..09591030f 100644
--- a/nezha-fronted/src/components/common/rightBox/trafficSetting/subBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/trafficSetting/subBox.vue
@@ -3,7 +3,7 @@
     <div class="right-sub-box sub-box" v-if="editTagsBox.show" :style="'top: ' + editTagsBox.top + 'px; left: ' + editTagsBox.left + 'px;'" >
       <div class="param-box" style="height: calc(100% - 25px)">
         <div style="height: 100%; overflow: auto;">
-          <div class="param-box-row" v-for="(item, index) in tempTagsObj" :key="index">
+          <div class="param-box-row" v-for="(item, index) in tempTagsObj" :key="index" id="traffic-setting-tags">
             <el-input placeholder="key" class="param-box-row-key input-x-mini-22" v-model="item.key" @input="validateInput(item.key,index)" :class="{'input-error':inputKeyErr[index]}"></el-input>
             <span class="param-box-row-eq">=</span>
             <el-input placeholder="value" class="param-box-row-value input-x-mini-22" v-model="item.value"></el-input>
diff --git a/nezha-fronted/src/components/common/rightBox/trafficSetting/trafficSettingBox.vue b/nezha-fronted/src/components/common/rightBox/trafficSetting/trafficSettingBox.vue
index e80d23dc7..f15cfafe4 100644
--- a/nezha-fronted/src/components/common/rightBox/trafficSetting/trafficSettingBox.vue
+++ b/nezha-fronted/src/components/common/rightBox/trafficSetting/trafficSettingBox.vue
@@ -7,19 +7,19 @@
     <div class="right-box-form-box">
       <el-form class="right-box-form" :model="traffic" label-width="100px" label-position="left" ref="trafficForm">
         <el-form-item :label="$t('config.dc.dc')" size="small">
-          <el-input :disabled="true" v-model="dc.name"></el-input>
+          <el-input :disabled="true" v-model="dc.name" id="traffic-setting-name"></el-input>
         </el-form-item>
         <traffic-setting-tab ref="trafficSetting" :post-asset-list="assetList" v-for="(item,index) in traffic.setting" :index="index" :asset-setting="item" :key="uuids[index]" :id="uuids[index]" @delSelf="delAssetSetting" :validate-repeat-func="valiateRepeatFunc"></traffic-setting-tab>
-        <button type="button" @click="addAssetSetting" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" style="margin:5px 1px 5px 70px">{{$t('config.dc.traffic.add')}}</button>
+        <button type="button" @click="addAssetSetting" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" style="margin:5px 1px 5px 70px" id="traffic-setting-add">{{$t('config.dc.traffic.add')}}</button>
       </el-form>
     </div>
 
     <!--底部按钮-->
     <div class="right-box-bottom-btns">
-      <button type="button" v-cancel="{obj:traffic,func:esc}" id="project-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
+      <button type="button" v-cancel="{obj:traffic,func:esc}" id="traffic-setting-esc" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
         <span>{{$t('overall.cancel')}}</span>
       </button>
-      <button @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="project-save" type="button" v-has="'dc_trafficSetting_save'">
+      <button @click="save" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" id="traffic-setting-save" type="button" v-has="'dc_trafficSetting_save'">
         <span>{{$t('overall.save')}}</span>
       </button>
     </div>
diff --git a/nezha-fronted/src/components/common/rightBox/trafficSetting/trafficSettingTab.vue b/nezha-fronted/src/components/common/rightBox/trafficSetting/trafficSettingTab.vue
index e2ad70532..73ad937ca 100644
--- a/nezha-fronted/src/components/common/rightBox/trafficSetting/trafficSettingTab.vue
+++ b/nezha-fronted/src/components/common/rightBox/trafficSetting/trafficSettingTab.vue
@@ -5,6 +5,7 @@
           <el-option v-for="(item,index) in assetList" :label="item.host" :disabled="item.isOccupy" :value="item.id" :key="item.host+'-'+item.id"></el-option>
         </el-select>-->
         <el-autocomplete
+          id="traffic-setting-asset"
           clearable
           :class="{'input-error':hostInvalid || hostRepeat}"
           class="asset-input right-box-row-with-btn"
@@ -23,19 +24,19 @@
             <el-row class="mib-browser-ad-search-item">
               <el-col :span="6"><div class="mib-browser-ad-search-label">{{$t("project.endpoint.port")}}</div></el-col>
               <el-col :span="17">
-                <el-input class="input-x-mini-24" v-model.number="assetSetting.port"></el-input>
+                <el-input class="input-x-mini-24" v-model.number="assetSetting.port" id="traffic-setting-port"></el-input>
               </el-col>
             </el-row>
             <el-row class="mib-browser-ad-search-item">
               <el-col :span="6"><div class="mib-browser-ad-search-label">{{$t('project.module.community')}}</div></el-col>
               <el-col :span="17">
-                <el-input class="input-x-mini-24" v-model="assetSetting.community"></el-input>
+                <el-input class="input-x-mini-24" v-model="assetSetting.community" id="traffic-setting-community"></el-input>
               </el-col>
             </el-row>
             <el-row class="mib-browser-ad-search-item">
               <el-col :span="6"><div class="mib-browser-ad-search-label">{{$t('project.module.version')}}</div></el-col>
               <el-col :span="17">
-                <el-radio-group v-model.number="assetSetting.version" >
+                <el-radio-group v-model.number="assetSetting.version" id="traffic-setting-version">
                   <el-radio-button :label="2"></el-radio-button>
                   <el-radio-button :label="3"></el-radio-button>
                 </el-radio-group>
@@ -48,7 +49,7 @@
                   <div class="mib-browser-ad-search-label">{{$t('login.username')}}</div>
                 </el-col>
                 <el-col :span="17">
-                  <el-input class="input-x-mini-24" v-model.trim="assetSetting.auth.username"></el-input>
+                  <el-input class="input-x-mini-24" v-model.trim="assetSetting.auth.username" id="traffic-setting-username"></el-input>
                 </el-col>
               </el-row>
 
@@ -57,7 +58,7 @@
                   <div class="mib-browser-ad-search-label">{{$t('project.module.securityLevel')}}</div>
                 </el-col>
                 <el-col :span="17">
-                  <el-radio-group v-model="assetSetting.auth.securityLevel" size="small">
+                  <el-radio-group v-model="assetSetting.auth.securityLevel" size="small" id="traffic-setting-securityLevel">
                     <el-radio-button label="noAuthNoPriv"></el-radio-button>
                     <el-radio-button label="authNoPriv"></el-radio-button>
                     <el-radio-button label="authPriv"></el-radio-button>
@@ -70,7 +71,7 @@
                   <div class="mib-browser-ad-search-label">{{$t('login.password')}}</div>
                 </el-col>
                 <el-col :span="17">
-                  <el-input class="input-x-mini-24" v-model.trim="assetSetting.auth.password"></el-input>
+                  <el-input class="input-x-mini-24" v-model.trim="assetSetting.auth.password" id="traffic-setting-password"></el-input>
                 </el-col>
               </el-row>
 
@@ -79,7 +80,7 @@
                   <div class="mib-browser-ad-search-label">{{$t('project.module.authProtocol')}}</div>
                 </el-col>
                 <el-col :span="17">
-                  <el-radio-group v-model="assetSetting.auth.authProtocol">
+                  <el-radio-group v-model="assetSetting.auth.authProtocol" id="traffic-setting-authProtocol">
                     <el-radio-button label="MD5"></el-radio-button>
                     <el-radio-button label="SHA"></el-radio-button>
                   </el-radio-group>
@@ -91,7 +92,7 @@
                   <div class="mib-browser-ad-search-label">{{$t('project.module.privProtocol')}}</div>
                 </el-col>
                 <el-col :span="17">
-                  <el-radio-group v-model="assetSetting.auth.privProtocol">
+                  <el-radio-group v-model="assetSetting.auth.privProtocol" id="traffic-setting-privProtocol">
                     <el-radio-button label="DES"></el-radio-button>
                     <el-radio-button label="AES"></el-radio-button>
                   </el-radio-group>
@@ -103,7 +104,7 @@
                   <div class="mib-browser-ad-search-label">{{$t('project.module.privPassword')}}</div>
                 </el-col>
                 <el-col :span="17">
-                  <el-input class="input-x-mini-24" v-model.trim="assetSetting.auth.privPassword"></el-input>
+                  <el-input class="input-x-mini-24" v-model.trim="assetSetting.auth.privPassword" id="traffic-setting-privPassword"></el-input>
                 </el-col>
               </el-row>
             </template>
@@ -112,7 +113,7 @@
             <i class="el-icon-more"></i>
           </button>
         </el-popover>
-        <span @click="delSelf" class="right-box-form-minus-box"
+        <span @click="delSelf" class="right-box-form-minus-box" id="traffic-setting-delself"
               style="vertical-align: middle;right: 0;
                       position: absolute;
                       line-height: 21px;
@@ -136,6 +137,7 @@
                   @row-click="validateRows"
                   class="taffic-setting-tab"
                   v-if="refreshTab"
+                  :id="'traffic-setting-option-table-'+index"
                   style="width: 100%;">
           <el-table-column
             label-class-name="traffic-set-table-title"
@@ -153,7 +155,7 @@
             </template>
             <template slot-scope="scope" :column="item">
               <template v-if="item.prop == 'tags'">
-                <div class="tab-tags" @click="showEditTagsBox(true,scope.$index,scope.row,$event)">
+                <div class="tab-tags" @click="showEditTagsBox(true,scope.$index,scope.row,$event)" id="traffic-setting-show-tags">
                   <!--<el-scrollbar style="height: 100%;">
                     <el-tag
                       v-for="(value, key, index) in scope.row[item.prop]"
diff --git a/nezha-fronted/src/components/page/alert/config.vue b/nezha-fronted/src/components/page/alert/config.vue
index 2172c78e7..26ec837e4 100644
--- a/nezha-fronted/src/components/page/alert/config.vue
+++ b/nezha-fronted/src/components/page/alert/config.vue
@@ -34,6 +34,7 @@
             <search-input :searchMsg="searchMsg" @search="search" :inTransform="bottomBox.inTransform"></search-input>
           </div>
           <export-excel
+            id="alert-rule"
             export-file-name="AlertRule"
             export-url="/alert/rule/export"
             import-url="/alert/rule/import"
@@ -48,13 +49,14 @@
               </button>
             </template>
           </export-excel>
-          <delete-button :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true" api="alert/rule" v-has="'rule_delete'"></delete-button>
+          <delete-button :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true" api="alert/rule" v-has="'rule_delete'" id="alert-rule-batch-delete"></delete-button>
         </div>
         <div class="pagination-top pagination-top-hide display-none"></div>
       </div>
       <!-- 自定义table列 -->
       <transition name="el-zoom-in-top">
         <element-set
+          id="alert-rule-element-set"
           v-if="tools.showCustomTableTitle"
           @close="tools.showCustomTableTitle = false"
           :custom-table-title.sync="tools.customTableTitle"
@@ -63,6 +65,7 @@
         ></element-set>
       </transition>
       <el-table
+        id="alert-rule-table"
         class="nz-table"
         :data="tableData"
         border
@@ -129,7 +132,7 @@
           </template>
         </el-table-column>
       </el-table>
-      <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn && bottomBox.mainResizeShow"><i class="nz-icon nz-icon-top"></i></button>
+      <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn && bottomBox.mainResizeShow" id="alert-rule-toTop"><i class="nz-icon nz-icon-top"></i></button>
       <div class="pagination-bottom" v-show="!bottomBox.showSubList">
         <Pagination :tableId="tableId" :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
       </div>
diff --git a/nezha-fronted/src/components/page/alert/list.vue b/nezha-fronted/src/components/page/alert/list.vue
index d1682fbd6..55ef7ca09 100644
--- a/nezha-fronted/src/components/page/alert/list.vue
+++ b/nezha-fronted/src/components/page/alert/list.vue
@@ -29,11 +29,12 @@
                   class="nz-btn nz-btn-size-normal nz-btn-style-light" id="alert-list-export">
             <i class="nz-icon nz-icon-download1"></i>
           </button>
-          <delete-button :clickFunction="openDelMessageBox" :delete-objs="batchDeleteObjs" @after="getAlertList" api="alert/message" v-has="'message_delete'"></delete-button>
+          <delete-button :clickFunction="openDelMessageBox" :delete-objs="batchDeleteObjs" @after="getAlertList" api="alert/message" v-has="'message_delete'" id="alert-msg-batch-delete"></delete-button>
         </div>
         <div class="pagination-top pagination-top-hide display-none"></div>
       </div>
       <alertMessageTable
+        projectAlertId="alert-msg-table"
         ref="alertMessageTable"
         :tableData="tableData"
         :loading="tools.loading"
@@ -54,10 +55,10 @@
     <div class="export-xlsx">
       <el-dialog :visible.sync="importBox.show" :title="importBox.title" :modal-append-to-body='false' :show-close="true" width="300px" @close="closeDialog" class="nz-dialog">
         <div class="upload-body">
-          <button @click="exportCur" class="el-button el-button--default el-button--small">
+          <button @click="exportCur" class="el-button el-button--default el-button--small" id="alert-msg-exportcur">
             <span>{{$t('overall.exportCur')}}</span>
           </button>
-          <button @click="exportAll" class="el-button el-button--default el-button--small">
+          <button @click="exportAll" class="el-button el-button--default el-button--small" id="alert-msg-exportall">
             <span>{{$t('overall.exportAll')}}</span>
           </button>
         </div>
diff --git a/nezha-fronted/src/components/page/asset/accountConfig.vue b/nezha-fronted/src/components/page/asset/accountConfig.vue
index 0a30979b4..29393774e 100644
--- a/nezha-fronted/src/components/page/asset/accountConfig.vue
+++ b/nezha-fronted/src/components/page/asset/accountConfig.vue
@@ -2,59 +2,59 @@
   <el-form label-width="120px" :model="account" :rules="rules" ref="accountForm" style="margin-top: 20px;margin-left: 66px">
     <template v-if="account.protocol == 'SSH'">
       <el-form-item :label="$t('asset.account')" prop="params.username">
-        <el-input autocomplete="new-password" size="small" v-model="account.params.username"/>
+        <el-input autocomplete="new-password" size="small" v-model="account.params.username" id="ssh-account-username"/>
       </el-form-item>
       <el-form-item :label="$t('asset.loginType')" prop="params.method">
-        <el-radio-group v-model="account.params.method" size="small">
+        <el-radio-group v-model="account.params.method" size="small" id="ssh-account-method">
           <el-radio-button label="password">{{$t('asset.password')}}</el-radio-button>
           <el-radio-button label="key">{{$t('asset.ssh')}}</el-radio-button>
         </el-radio-group>
       </el-form-item>
       <el-form-item :label="$t('asset.password')" v-if="account.params.method == 'password'">
-        <el-input autocomplete="new-password" size="small" type="password" v-model="account.params.password"/>
+        <el-input autocomplete="new-password" size="small" type="password" v-model="account.params.password" id="ssh-account-password"/>
       </el-form-item>
       <el-form-item :label="$t('asset.ssh')" v-if="account.params.method == 'key'" prop="file">
-        <el-input rows="4" type="textarea" placeholder="" v-model="account.params.key" size="small"></el-input>
+        <el-input rows="4" type="textarea" placeholder="" v-model="account.params.key" size="small" id="ssh-account-key"></el-input>
       </el-form-item>
       <el-form-item :label="$t('asset.password')" v-if="account.params.method == 'key'">
-        <el-input autocomplete="new-password" size="small" type="password" v-model="account.params.keyPassword"/>
+        <el-input autocomplete="new-password" size="small" type="password" v-model="account.params.keyPassword" id="ssh-account-keyPassword"/>
       </el-form-item>
       <el-form-item :label="$t('asset.port')" prop="port" style="display: inline-block">
-        <el-input size="small" v-model.number="account.port"/>
+        <el-input size="small" v-model.number="account.port" id="ssh-account-port"/>
       </el-form-item>
     </template>
     <template v-if="account.protocol == 'TELNET'">
       <el-form-item :label="$t('asset.account')" prop="params.username">
-        <el-input autocomplete="new-password" size="small" v-model="account.params.username"/>
+        <el-input autocomplete="new-password" size="small" v-model="account.params.username" id="telnet-account-username"/>
       </el-form-item>
       <el-form-item :label="$t('asset.userTip')" prop="userTip">
-        <el-input autocomplete="new-password" size="small" v-model="account.params.userTip"/>
+        <el-input autocomplete="new-password" size="small" v-model="account.params.userTip" id="telnet-account-userTip"/>
       </el-form-item>
       <el-form-item :label="$t('asset.password')">
-        <el-input autocomplete="new-password" size="small" type="password" v-model="account.params.password"/>
+        <el-input autocomplete="new-password" size="small" type="password" v-model="account.params.password" id="telnet-account-password"/>
       </el-form-item>
       <el-form-item :label="this.$t('asset.passwordTip')">
-        <el-input size="small" v-model="account.params.passwordTip"/>
+        <el-input size="small" v-model="account.params.passwordTip" id="telnet-account-passwordTip"/>
       </el-form-item>
       <el-form-item :label="$t('asset.reloginPasswordTip')" prop="reloginTip">
-        <el-input size="small" v-model="account.params.reloginTip"/>
+        <el-input size="small" v-model="account.params.reloginTip" id="telnet-account-reloginTip"/>
       </el-form-item>
       <el-form-item :label="$t('asset.port')" prop="port" style="display: inline-block">
-        <el-input size="small" v-model.number="account.port"/>
+        <el-input size="small" v-model.number="account.port" id="telnet-account-port"/>
       </el-form-item>
     </template>
     <template v-if="account.protocol == 'SNMP'">
       <el-form-item :label="$t('asset.port')" prop="port">
-        <el-input size="small" v-model.number="account.port"/>
+        <el-input size="small" v-model.number="account.port" id="snmp-account-port"/>
       </el-form-item>
       <el-form-item :label="$t('project.module.community')" prop="params.community">
-        <el-input size="small" v-model="account.params.community"/>
+        <el-input size="small" v-model="account.params.community" id="snmp-account-community"/>
       </el-form-item>
       <el-form-item :label="$t('project.module.contextName')" prop="params.contextName">
-        <el-input size="small" v-model="account.params.contextName"/>
+        <el-input size="small" v-model="account.params.contextName" id="snmp-account-contextName"/>
       </el-form-item>
       <el-form-item :label="$t('project.module.version')" prop="params.version">
-        <el-radio-group v-model.number="account.params.version" size="small">
+        <el-radio-group v-model.number="account.params.version" size="small" id="snmp-account-version">
           <el-radio-button :label="2"></el-radio-button>
           <el-radio-button :label="3"></el-radio-button>
         </el-radio-group>
@@ -62,32 +62,32 @@
       <!--SNMP V3 setting-->
       <template v-if="account.params.version == 3">
         <el-form-item :label="$t('asset.account')" prop="params.username">
-          <el-input size="small" v-model="account.params.username"/>
+          <el-input size="small" v-model="account.params.username" id="snmp-account-username"/>
         </el-form-item>
         <el-form-item :label="$t('project.module.securityLevel')" prop="params.securityLevel">
-          <el-radio-group v-model="account.params.securityLevel" size="small">
+          <el-radio-group v-model="account.params.securityLevel" size="small" id="snmp-account-securityLevel">
             <el-radio-button label="noAuthNoPriv"></el-radio-button>
             <el-radio-button label="authNoPriv"></el-radio-button>
             <el-radio-button label="authPriv"></el-radio-button>
           </el-radio-group>
         </el-form-item>
         <el-form-item :label="$t('login.password')" prop="params.password" v-if="account.params.securityLevel == 'authNoPriv' || account.params.securityLevel == 'authPriv'">
-          <el-input autocomplete="new-password" size="small" type="password" v-model="account.params.password"/>
+          <el-input autocomplete="new-password" size="small" type="password" v-model="account.params.password" id="snmp-account-password"/>
         </el-form-item>
         <el-form-item :label="$t('project.module.authProtocol')" prop="params.authProtocol" v-if="account.params.securityLevel == 'authNoPriv' || account.params.securityLevel == 'authPriv'">
-          <el-radio-group v-model="account.params.authProtocol" size="small">
+          <el-radio-group v-model="account.params.authProtocol" size="small" id="snmp-account-authProtocol">
             <el-radio-button label="MD5"></el-radio-button>
             <el-radio-button label="SHA"></el-radio-button>
           </el-radio-group>
         </el-form-item>
         <el-form-item :label="$t('project.module.privProtocol')" prop="params.privProtocol" v-if="account.params.securityLevel == 'authPriv'">
-          <el-radio-group v-model="account.params.privProtocol" size="small">
+          <el-radio-group v-model="account.params.privProtocol" size="small" id="snmp-account-privProtocol">
             <el-radio-button label="DES"></el-radio-button>
             <el-radio-button label="AES"></el-radio-button>
           </el-radio-group>
         </el-form-item>
         <el-form-item :label="$t('project.module.privPassword')" prop="params.privPassword" v-if="account.params.securityLevel == 'authPriv'">
-          <el-input autocomplete="new-password" size="small" type="password" v-model="account.params.privPassword"/>
+          <el-input autocomplete="new-password" size="small" type="password" v-model="account.params.privPassword" id="snmp-account-privPassword"/>
         </el-form-item>
       </template>
     </template>
diff --git a/nezha-fronted/src/components/page/asset/asset.vue b/nezha-fronted/src/components/page/asset/asset.vue
index 63b7058f1..3bc312602 100644
--- a/nezha-fronted/src/components/page/asset/asset.vue
+++ b/nezha-fronted/src/components/page/asset/asset.vue
@@ -6,6 +6,7 @@
         <div class="top-tool-main-right" :class="{'top-tool-main-right-to-left': bottomBox.showSubList}">
           <div class="top-tool-search margin-r-20"><search-input :searchMsg="searchMsg" @search="search" :inTransform="bottomBox.inTransform"></search-input></div>
           <export-excel
+            id="asset-list"
             export-file-name="asset"
             export-url="/asset/export"
             import-url="/asset/import"
@@ -21,13 +22,14 @@
           <button :title="$t('overall.batchEdit')" @click.stop="batchEdit" class="nz-btn nz-btn-size-normal nz-btn-style-light" id="asset-batch-asset" style="margin-left: 15px" v-has="'asset_toBatchEdit'">
             <i class="nz-icon nz-icon-batch-edit"></i>
           </button>
-          <delete-button :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true" api="asset" v-has="'asset_delete'"></delete-button>
+          <delete-button :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true" api="asset" v-has="'asset_delete'" id="asset-list-batch-delete"></delete-button>
         </div>
         <div class="pagination-top pagination-top-hide display-none"></div>
       </div>
       <!-- 自定义table列 -->
       <transition name="el-zoom-in-top">
         <element-set
+          id="asset-list"
           v-if="tools.showCustomTableTitle"
           @close="tools.showCustomTableTitle = false"
           :custom-table-title.sync="tools.customTableTitle"
@@ -36,6 +38,7 @@
         ></element-set>
       </transition>
       <el-table
+        id="asset-list-table"
         class="nz-table"
         :height="mainTableHeight"
         style="width: 100%;position: relative;z-index: 99"
diff --git a/nezha-fronted/src/components/page/config/account.vue b/nezha-fronted/src/components/page/config/account.vue
index c58c3219b..b476b1681 100644
--- a/nezha-fronted/src/components/page/config/account.vue
+++ b/nezha-fronted/src/components/page/config/account.vue
@@ -31,7 +31,7 @@
                   class="nz-btn nz-btn-size-normal nz-btn-style-light margin-l-20" id="account-add">
             <i class="nz-icon-create-square nz-icon"></i>
           </button>
-          <delete-button :delete-objs="batchDeleteObjs" :filter-function="(arr)=>{return '?userIds='+arr.map(t=>t.userId).join(',')}" @after="getTableData" api="sys/user/delete" v-has="'account_delete'" @before="delFlag=true"></delete-button>
+          <delete-button :delete-objs="batchDeleteObjs" :filter-function="(arr)=>{return '?userIds='+arr.map(t=>t.userId).join(',')}" @after="getTableData" api="sys/user/delete" v-has="'account_delete'" @before="delFlag=true" id="account-list-batch-delete"></delete-button>
         </div>
         <!-- 顶部分页组件，当打开底部上滑框时出现 -->
         <div class="pagination-top pagination-top-hide display-none"></div>
@@ -39,6 +39,7 @@
       <!-- 自定义table列 -->
       <transition name="el-zoom-in-top">
         <element-set
+          id="account-list"
           v-if="tools.showCustomTableTitle"
           @close="tools.showCustomTableTitle = false"
           :custom-table-title.sync="tools.customTableTitle"
@@ -47,6 +48,7 @@
         ></element-set>
       </transition>
       <el-table
+        id="account-list-table"
         class="nz-table"
         :data="tableData"
         border
@@ -127,7 +129,7 @@
           </template>
         </el-table-column>
       </el-table>
-      <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn && bottomBox.mainResizeShow"><i class="nz-icon nz-icon-top"></i></button>
+      <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn && bottomBox.mainResizeShow" id="account-list-totop"><i class="nz-icon nz-icon-top"></i></button>
       <div class="pagination-bottom" v-show="!bottomBox.showSubList">
         <Pagination :tableId="tableId" :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
       </div>
diff --git a/nezha-fronted/src/components/page/config/changePwd.vue b/nezha-fronted/src/components/page/config/changePwd.vue
index a99b36dc9..1c287985b 100644
--- a/nezha-fronted/src/components/page/config/changePwd.vue
+++ b/nezha-fronted/src/components/page/config/changePwd.vue
@@ -3,26 +3,26 @@
     <el-dialog class="nz-dialog" :title="$t('overall.changePwd')" :visible.sync="visible"  @open="dialogOpened"  :modal-append-to-body='false' @closed="dialogClosed" width="600px" :show-close="false" >
       <el-form :model="user" label-position="right" label-width="150px" :rules="rules" ref="changePwdForm" size="mini">
         <el-form-item :label="$t('config.account.account')" prop="username" v-show="curUser != sysUser">
-          <el-input type="text" autocomplete="false" v-model="user.username" disabled></el-input>
+          <el-input type="text" autocomplete="false" v-model="user.username" disabled id="change-pwd-username"></el-input>
         </el-form-item>
         <el-form-item :label="$t('config.account.oldPwd')" prop="pwd">
-          <el-input type="password" autocomplete="false" :show-password="true" v-model="user.pwd" maxlength="20" :placeholder="$t('config.account.inputOldPwd')"></el-input>
+          <el-input type="password" autocomplete="false" :show-password="true" v-model="user.pwd" maxlength="20" :placeholder="$t('config.account.inputOldPwd')" id="change-pwd-pwd"></el-input>
         </el-form-item>
         <el-form-item :label="$t('config.account.newPwd')" prop="newPwd">
-          <el-input type="password" autocomplete="false" :show-password="true" v-model="user.newPwd" maxlength="20" :placeholder="$t('config.account.inputNewPwd')"></el-input>
+          <el-input type="password" autocomplete="false" :show-password="true" v-model="user.newPwd" maxlength="20" :placeholder="$t('config.account.inputNewPwd')" id="change-pwd-newPwd"></el-input>
         </el-form-item>
         <el-form-item :label="$t('config.account.confirmPwd')" prop="confirmPwd">
-          <el-input type="password" autocomplete="false"  :show-password="true" v-model="user.confirmPwd" maxlength="20" :placeholder="$t('config.account.inputConfirmPwd')"></el-input>
+          <el-input type="password" autocomplete="false"  :show-password="true" v-model="user.confirmPwd" maxlength="20" :placeholder="$t('config.account.inputConfirmPwd')" id="change-pwd-confirmPwd"></el-input>
         </el-form-item>
       </el-form>
       <!--底部按钮-->
       <template slot="footer">
         <div class="right-box-bottom-btns" >
-          <button @click="close" id="account-esc"
+          <button @click="close" id="change-pwd-esc"
                   class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new">
             <span>{{$t('overall.cancel')}}</span>
           </button>
-          <button  @click="changePwd" id="account-save"
+          <button  @click="changePwd" id="change-pwd-save"
                    class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new">
             <span>{{$t('overall.save')}}</span>
           </button>
diff --git a/nezha-fronted/src/components/page/config/dc.vue b/nezha-fronted/src/components/page/config/dc.vue
index 75032412f..d5fc5f25f 100644
--- a/nezha-fronted/src/components/page/config/dc.vue
+++ b/nezha-fronted/src/components/page/config/dc.vue
@@ -17,13 +17,14 @@
                   class="nz-btn nz-btn-size-normal nz-btn-style-light margin-l-20" id="dc-add">
             <i class="nz-icon-create-square nz-icon"></i>
           </button>
-          <delete-button :delete-objs="batchDeleteObjs" @before="delFlag=true" @after="getTableData" api="idc" v-has="'dc_delete'"></delete-button>
+          <delete-button :delete-objs="batchDeleteObjs" @before="delFlag=true" @after="getTableData" api="idc" v-has="'dc_delete'" id="dc-list-batch-delete"></delete-button>
         </div>
         <div class="pagination-top pagination-top-hide display-none"></div>
       </div>
       <!-- 自定义table列 -->
       <transition name="el-zoom-in-top">
         <element-set
+          id="dc-list"
           v-if="tools.showCustomTableTitle"
           @close="tools.showCustomTableTitle = false"
           :custom-table-title.sync="tools.customTableTitle"
@@ -32,6 +33,7 @@
         ></element-set>
       </transition>
       <el-table
+        id="dc-list-table"
         class="nz-table"
         :data="tableData"
         border
@@ -124,7 +126,7 @@
           </template>
         </el-table-column>
       </el-table>
-      <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn && bottomBox.mainResizeShow"><i class="nz-icon nz-icon-top"></i></button>
+      <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn && bottomBox.mainResizeShow" id="dc-list-totop"><i class="nz-icon nz-icon-top"></i></button>
       <div class="pagination-bottom" v-show="!bottomBox.showSubList">
         <Pagination :tableId="tableId" :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
       </div>
diff --git a/nezha-fronted/src/components/page/config/menus.vue b/nezha-fronted/src/components/page/config/menus.vue
index 6f617a517..8780477b5 100644
--- a/nezha-fronted/src/components/page/config/menus.vue
+++ b/nezha-fronted/src/components/page/config/menus.vue
@@ -19,7 +19,7 @@
                   id="menus-add" type="button">
             <i class="nz-icon-create-square nz-icon"></i>
           </button>
-          <delete-button :delete-objs="batchDeleteObjs" :filter-function="(arr)=>{return '?ids='+arr.map(t=>t.id).join(',')}" @before="delFlag=true" @after="getTableData" api="sys/menu"></delete-button>
+          <delete-button :delete-objs="batchDeleteObjs" :filter-function="(arr)=>{return '?ids='+arr.map(t=>t.id).join(',')}" @before="delFlag=true" @after="getTableData" api="sys/menu" id="menus-list-batch-delete"></delete-button>
         </div>
         <!-- 顶部分页组件，当打开底部上滑框时出现 -->
         <div class="pagination-top pagination-top-hide display-none"></div>
@@ -27,6 +27,7 @@
       <!-- 自定义table列 -->
       <transition name="el-zoom-in-top">
         <element-set
+          id="menu-list"
           :custom-table-title.sync="tools.customTableTitle"
           :original-table-title="tableTitle"
           @close="tools.showCustomTableTitle = false"
@@ -35,6 +36,7 @@
         ></element-set>
       </transition>
       <el-table
+        id="menu-list-table"
         :data="tableData"
         :height="mainTableHeight"
         :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
@@ -98,7 +100,7 @@
           </template>
         </el-table-column>
       </el-table>
-      <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn "><i class="nz-icon nz-icon-top"></i></button>
+      <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn " id="menu-list-totop"><i class="nz-icon nz-icon-top"></i></button>
     </div>
     <transition name="right-box">
       <menu-box :menu="menu" @close="closeRightBox" v-if="rightBox.show"></menu-box>
diff --git a/nezha-fronted/src/components/page/config/mib.vue b/nezha-fronted/src/components/page/config/mib.vue
index c5ded4cfd..562122784 100644
--- a/nezha-fronted/src/components/page/config/mib.vue
+++ b/nezha-fronted/src/components/page/config/mib.vue
@@ -22,12 +22,13 @@
           <button :title="$t('overall.createMib')" @click="add" class="nz-btn nz-btn-size-normal nz-btn-style-light  margin-l-20" id="mib-add"  type="button" v-has="'snmp_file_toAdd'">
             <i class="nz-icon-create-square nz-icon"></i>
           </button>
-          <delete-button :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true" api="mib" v-has="'snmp_file_delete'"></delete-button>
+          <delete-button :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true" api="mib" v-has="'snmp_file_delete'" id="mib-list-batch-delete"></delete-button>
         </div>
       </div>
       <!-- 自定义table列 -->
       <transition name="el-zoom-in-top">
         <element-set
+          id="mib-list"
           v-if="tools.showCustomTableTitle"
           @close="tools.showCustomTableTitle = false"
           :custom-table-title.sync="tools.customTableTitle"
@@ -35,7 +36,7 @@
           ref="customTableTitle"
         ></element-set>
       </transition>
-      <el-table :data="tableData" :height="$tableHeight.normal" @sort-change="tableDataSort" border class="nz-table mib-table" ref="mibTable" style="width: 100%;" v-loading="tools.loading"
+      <el-table :data="tableData" :height="$tableHeight.normal" @sort-change="tableDataSort" border class="nz-table mib-table" ref="mibTable" style="width: 100%;" v-loading="tools.loading" id="mib-list-table"
                 @selection-change="(selection)=>{this.batchDeleteObjs=selection}"
       >
         <el-table-column
@@ -101,7 +102,7 @@
           </template>
         </el-table-column>
       </el-table>
-      <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn"><i class="nz-icon nz-icon-top"></i></button>
+      <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn" id="mib-list-totop"><i class="nz-icon nz-icon-top"></i></button>
       <Pagination :tableId="tableId" :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
     </template>
     <mib-browser :show-tab="showTab" v-if="showTab == 'browser'" @toFileTab="showTab = 'file'"></mib-browser>
diff --git a/nezha-fronted/src/components/page/config/mibBrowser.vue b/nezha-fronted/src/components/page/config/mibBrowser.vue
index d8ff5b488..347a7695c 100644
--- a/nezha-fronted/src/components/page/config/mibBrowser.vue
+++ b/nezha-fronted/src/components/page/config/mibBrowser.vue
@@ -12,6 +12,7 @@
       <div class="top-tool-main-right">
         <div class="top-tool-search host-input">
           <el-autocomplete
+            id="mib-browser-host"
             v-model="searchParam.host"
             :fetch-suggestions="assetSuggestion"
             placeholder="Host"
@@ -26,30 +27,30 @@
           </el-autocomplete>
         </div>
         <div class="top-tool-search margin-l-20 oid-input">
-          <el-input size="mini" v-model="searchParam.oid" placeholder="OID"></el-input>
+          <el-input size="mini" v-model="searchParam.oid" placeholder="OID" id="mib-browser-oid"></el-input>
         </div>
         <div class="nz-btn-group nz-btn-group-size-normal nz-btn-group-light margin-l-20 mib-browser-btn-group">
           <!--<div class="el-popover mib-browser-ad-tip" v-show="searchParam.version != 2 || searchParam.port != 161 || searchParam.community != 'public'"><i class="el-icon-more"></i></div>-->
-          <el-select class="nz-input-group-left input-x-mini-24 operation" v-model="searchParam.operation">
+          <el-select class="nz-input-group-left input-x-mini-24 operation" v-model="searchParam.operation" id="mib-browser-host">
             <el-option v-for="item in operationData" :key="item" :value="item"></el-option>
           </el-select><el-popover trigger="click" placement="bottom" @show="popShow" @hide="popHide">
             <div class="mib-browser-ad-search">
               <el-row class="mib-browser-ad-search-item">
                 <el-col :span="6"><div class="mib-browser-ad-search-label">{{$t("project.endpoint.port")}}</div></el-col>
                 <el-col :span="17">
-                  <el-input class="input-x-mini-24" v-model.number="searchParamPop.port"></el-input>
+                  <el-input class="input-x-mini-24" v-model.number="searchParamPop.port" id="mib-browser-port"></el-input>
                 </el-col>
               </el-row>
               <el-row class="mib-browser-ad-search-item">
                 <el-col :span="6"><div class="mib-browser-ad-search-label">{{$t('project.module.community')}}</div></el-col>
                 <el-col :span="17">
-                  <el-input class="input-x-mini-24" v-model="searchParamPop.community"></el-input>
+                  <el-input class="input-x-mini-24" v-model="searchParamPop.community" id="mib-browser-community"></el-input>
                 </el-col>
               </el-row>
               <el-row class="mib-browser-ad-search-item">
                 <el-col :span="6"><div class="mib-browser-ad-search-label">{{$t('project.module.version')}}</div></el-col>
                 <el-col :span="17">
-                  <el-radio-group v-model.number="searchParamPop.version">
+                  <el-radio-group v-model.number="searchParamPop.version" id="mib-browser-version">
                     <el-radio-button :label="2"></el-radio-button>
                     <el-radio-button :label="3"></el-radio-button>
                   </el-radio-group>
@@ -62,7 +63,7 @@
                     <div class="mib-browser-ad-search-label">{{$t('login.username')}}</div>
                   </el-col>
                   <el-col :span="17">
-                    <el-input class="input-x-mini-24" v-model.trim="searchParamPop.auth.username"></el-input>
+                    <el-input class="input-x-mini-24" v-model.trim="searchParamPop.auth.username" id="mib-browser-username"></el-input>
                   </el-col>
                 </el-row>
 
@@ -71,7 +72,7 @@
                     <div class="mib-browser-ad-search-label">{{$t('project.module.securityLevel')}}</div>
                   </el-col>
                   <el-col :span="17">
-                    <el-radio-group v-model="searchParamPop.auth.securityLevel" size="small">
+                    <el-radio-group v-model="searchParamPop.auth.securityLevel" size="small" id="mib-browser-securityLevel">
                       <el-radio-button label="noAuthNoPriv"></el-radio-button>
                       <el-radio-button label="authNoPriv"></el-radio-button>
                       <el-radio-button label="authPriv"></el-radio-button>
@@ -84,7 +85,7 @@
                     <div class="mib-browser-ad-search-label">{{$t('login.password')}}</div>
                   </el-col>
                   <el-col :span="17">
-                    <el-input type="password" class="input-x-mini-24" v-model.trim="searchParamPop.auth.password"></el-input>
+                    <el-input type="password" class="input-x-mini-24" v-model.trim="searchParamPop.auth.password" id="mib-browser-password"></el-input>
                   </el-col>
                 </el-row>
 
@@ -93,7 +94,7 @@
                     <div class="mib-browser-ad-search-label">{{$t('project.module.authProtocol')}}</div>
                   </el-col>
                   <el-col :span="17">
-                    <el-radio-group v-model="searchParamPop.auth.authProtocol">
+                    <el-radio-group v-model="searchParamPop.auth.authProtocol" id="mib-browser-authProtocol">
                       <el-radio-button label="MD5"></el-radio-button>
                       <el-radio-button label="SHA"></el-radio-button>
                     </el-radio-group>
@@ -105,7 +106,7 @@
                     <div class="mib-browser-ad-search-label">{{$t('project.module.privProtocol')}}</div>
                   </el-col>
                   <el-col :span="17">
-                    <el-radio-group v-model="searchParamPop.auth.privProtocol">
+                    <el-radio-group v-model="searchParamPop.auth.privProtocol" id="mib-browser-privProtocol">
                       <el-radio-button label="DES"></el-radio-button>
                       <el-radio-button label="AES"></el-radio-button>
                     </el-radio-group>
@@ -117,7 +118,7 @@
                     <div class="mib-browser-ad-search-label">{{$t('project.module.privPassword')}}</div>
                   </el-col>
                   <el-col :span="17">
-                    <el-input type="password" class="input-x-mini-24" v-model.trim="searchParamPop.auth.privPassword"></el-input>
+                    <el-input type="password" class="input-x-mini-24" v-model.trim="searchParamPop.auth.privPassword" id="mib-browser-privPassword"></el-input>
                   </el-col>
                 </el-row>
               </template>
@@ -215,8 +216,8 @@
         <div class="mib-browser-table-title">
           <span>Result table</span>
           <span>
-            <span :class="{'mib-browser-table-op-light': resultData.length == 0}" :title="$t('overall.exportExcel')" @click="exportXlsx" class="mib-browser-table-op" v-has="'snmp_browser_export'"><i class="nz-icon nz-icon-download1"></i></span>
-            <span @click="clearResult" class="mib-browser-table-op" :title="$t('overall.clear')"><i class="nz-icon nz-icon-close"></i></span>
+            <span :class="{'mib-browser-table-op-light': resultData.length == 0}" :title="$t('overall.exportExcel')" @click="exportXlsx" class="mib-browser-table-op" v-has="'snmp_browser_export'" id="mib-browser-export"><i class="nz-icon nz-icon-download1"></i></span>
+            <span @click="clearResult" class="mib-browser-table-op" :title="$t('overall.clear')" id="mib-browser-clear"><i class="nz-icon nz-icon-close"></i></span>
           </span>
         </div>
         <pl-table :row-height="28" use-virtual :datas="resultData" border :empty-text="$t('config.mib.noData')" ref="resultTable"
@@ -251,7 +252,7 @@
       <div slot="footer" class="footer">
         <div class="el-message-box__btns">
           <button @click="snmpSetFormVisible = false" class="el-button el-button--default el-button--small">{{$t("overall.cancel")}}</button>
-          <button @click="search(true)" class="el-button el-button--default el-button--small">{{$t("overall.ok")}}</button>
+          <button @click="search(true)" class="el-button el-button--default el-button--small" id="mib-browser-search">{{$t("overall.ok")}}</button>
         </div>
       </div>
     </el-dialog>
diff --git a/nezha-fronted/src/components/page/config/model.vue b/nezha-fronted/src/components/page/config/model.vue
index 7b7b015c3..b3393a886 100644
--- a/nezha-fronted/src/components/page/config/model.vue
+++ b/nezha-fronted/src/components/page/config/model.vue
@@ -15,13 +15,14 @@
           <button :title="$t('overall.createModel')" @click="add" class="nz-btn nz-btn-size-normal nz-btn-style-light margin-l-20" id="model-add" v-has="'model_toAdd'">
             <i class="nz-icon-create-square nz-icon"></i>
           </button>
-          <delete-button :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true" api="model" v-has="'model_delete'"></delete-button>
+          <delete-button :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true" api="model" v-has="'model_delete'" id="model-list-batch-delete"></delete-button>
         </div>
         <div class="pagination-top pagination-top-hide display-none"></div>
       </div>
       <!-- 自定义table列 -->
       <transition name="el-zoom-in-top">
         <element-set
+          id="model-list"
           v-if="tools.showCustomTableTitle"
           @close="tools.showCustomTableTitle = false"
           :custom-table-title.sync="tools.customTableTitle"
@@ -30,6 +31,7 @@
         ></element-set>
       </transition>
       <el-table :data="tableData"
+                id="model-list-table"
                 border style="width: 100%;"
                 ref="modelTable"
                 class="nz-table"
@@ -88,7 +90,7 @@
           </template>
         </el-table-column>
       </el-table>
-      <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn"><i class="nz-icon nz-icon-top"></i></button>
+      <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn" id="model-list-totop"><i class="nz-icon nz-icon-top"></i></button>
       <div class="pagination-bottom" v-show="!bottomBox.showSubList">
         <Pagination :tableId="tableId" :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
       </div>
diff --git a/nezha-fronted/src/components/page/config/operationlog.vue b/nezha-fronted/src/components/page/config/operationlog.vue
index 25ee3db77..b1ceadd97 100644
--- a/nezha-fronted/src/components/page/config/operationlog.vue
+++ b/nezha-fronted/src/components/page/config/operationlog.vue
@@ -16,6 +16,7 @@
     <!-- 自定义table列 -->
     <transition name="el-zoom-in-top">
       <element-set
+        id="operation-log-list"
         v-if="tools.showCustomTableTitle"
         @close="tools.showCustomTableTitle = false"
         :custom-table-title.sync="tools.customTableTitle"
@@ -24,6 +25,7 @@
       ></element-set>
     </transition>
     <el-table
+      id="operation-log-list-table"
       class="nz-table"
       :data="tableData"
       border
@@ -61,7 +63,7 @@
         </template>
       </el-table-column>
     </el-table>
-    <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn"><i class="nz-icon nz-icon-top"></i></button>
+    <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn" id="operation-log-totop"><i class="nz-icon nz-icon-top"></i></button>
     <Pagination :tableId="tableId" :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
   </div>
 </template>
diff --git a/nezha-fronted/src/components/page/config/promServer.vue b/nezha-fronted/src/components/page/config/promServer.vue
index b1a76d01f..7c6c2e03f 100644
--- a/nezha-fronted/src/components/page/config/promServer.vue
+++ b/nezha-fronted/src/components/page/config/promServer.vue
@@ -16,13 +16,14 @@
                   class="nz-btn nz-btn-size-normal nz-btn-style-light margin-l-20" id="prom-add">
             <i class="nz-icon-create-square nz-icon"></i>
           </button>
-          <delete-button :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true" api="promServer" v-has="'prom_delete'"></delete-button>
+          <delete-button :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true" api="promServer" v-has="'prom_delete'" id="promserver-list-batch-delete"></delete-button>
         </div>
         <div class="pagination-top pagination-top-hide display-none"></div>
       </div>
       <!-- 自定义table列 -->
       <transition name="el-zoom-in-top">
         <element-set
+          id="promserver-list"
           v-if="tools.showCustomTableTitle"
           @close="tools.showCustomTableTitle = false"
           :custom-table-title.sync="tools.customTableTitle"
@@ -82,7 +83,7 @@
           </template>
         </el-table-column>
       </el-table>
-      <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn && bottomBox.mainResizeShow"><i class="nz-icon nz-icon-top"></i></button>
+      <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn && bottomBox.mainResizeShow" id="promserver-list-totop"><i class="nz-icon nz-icon-top"></i></button>
       <div class="pagination-bottom" v-show="!bottomBox.showSubList">
         <Pagination :tableId="tableId" :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
       </div>
diff --git a/nezha-fronted/src/components/page/config/roles.vue b/nezha-fronted/src/components/page/config/roles.vue
index cabb43a46..7ef4dfc40 100644
--- a/nezha-fronted/src/components/page/config/roles.vue
+++ b/nezha-fronted/src/components/page/config/roles.vue
@@ -18,7 +18,7 @@
                   id="roles-add" type="button">
             <i class="nz-icon-create-square nz-icon"></i>
           </button>
-          <delete-button :delete-objs="batchDeleteObjs" :filter-function="(arr)=>{return '?ids='+arr.map(t=>t.id).join(',')}" @after="getTableData" @before="delFlag=true" api="sys/role" v-has="'role_delete'"></delete-button>
+          <delete-button :delete-objs="batchDeleteObjs" :filter-function="(arr)=>{return '?ids='+arr.map(t=>t.id).join(',')}" @after="getTableData" @before="delFlag=true" api="sys/role" v-has="'role_delete'" id="role-list-batch-delete"></delete-button>
         </div>
         <!-- 顶部分页组件，当打开底部上滑框时出现 -->
         <div class="pagination-top pagination-top-hide display-none"></div>
diff --git a/nezha-fronted/src/components/page/config/system.vue b/nezha-fronted/src/components/page/config/system.vue
index ecc99fd93..eda0677b8 100644
--- a/nezha-fronted/src/components/page/config/system.vue
+++ b/nezha-fronted/src/components/page/config/system.vue
@@ -5,49 +5,49 @@
         <div class="system-config-form basicForm">
           <el-form :model="basic"  label-width="180px" size="small" ref="basicForm" :rules="basic.asset_ping_switch == 'on'?basicRules:basicRules2" :validate-on-rule-change="false">
             <el-form-item :label="$t('config.system.basic.systemName')" prop="system_name">
-              <el-input v-model="basic.system_name"></el-input>
+              <el-input v-model="basic.system_name" id="system-baisc-system_name"></el-input>
             </el-form-item>
             <el-form-item :label="$t('config.system.basic.curUrl')" prop="alert_api">
-              <el-input v-model="basic.alert_api"></el-input>
+              <el-input v-model="basic.alert_api"id="system-baisc-alert_api"></el-input>
             </el-form-item>
             <el-form-item :label="$t('config.system.basic.assetPingSwith')" prop="asset_ping_switch">
-              <el-switch v-model.number="basic.asset_ping_switch" active-color="rgb(238, 157, 63)"  active-value='on' inactive-value='off'>
+              <el-switch v-model.number="basic.asset_ping_switch" active-color="rgb(238, 157, 63)"  active-value='on' inactive-value='off'id="system-baisc-asset_ping_switch">
               </el-switch>
             </el-form-item>
             <!--<el-form-item :label="$t('config.system.basic.assetPingInterval')" prop="asset_ping_interval">
               <el-input v-model.number="basic.asset_ping_interval" :disabled="basic.asset_ping_switch == 'off'"></el-input><span class="nz-input-append">s</span>
             </el-form-item>-->
             <el-form-item :label="$t('config.system.basic.defaultCabinetUsize')" prop="default_cabinet_usize">
-              <el-input v-model.number="basic.default_cabinet_usize" ></el-input>
+              <el-input v-model.number="basic.default_cabinet_usize" id="system-baisc-default_cabinet_usize"></el-input>
             </el-form-item>
             <!--<el-form-item :label="$t('config.system.basic.exporterTarget')" prop="node_exporter_target_path">
               <el-input v-model="basic.node_exporter_target_path"></el-input>
             </el-form-item>-->
             <el-form-item :label="$t('config.system.basic.scrapeInterval')" prop="scrape_interval">
-              <el-input v-model.number="basic.scrape_interval" ></el-input><span class="nz-input-append">{{$t('config.system.basic.second')}}</span>
+              <el-input v-model.number="basic.scrape_interval" id="system-baisc-scrape_interval"></el-input><span class="nz-input-append">{{$t('config.system.basic.second')}}</span>
             </el-form-item>
             <el-form-item :label="$t('config.system.basic.storageRetention')" prop="storage_local_retention">
-              <el-input v-model.number="basic.storage_local_retention" ></el-input><span class="nz-input-append">{{$t('config.system.basic.day')}}</span>
+              <el-input v-model.number="basic.storage_local_retention" id="system-baisc-storage_local_retention"></el-input><span class="nz-input-append">{{$t('config.system.basic.day')}}</span>
             </el-form-item>
             <el-form-item :label="$t('config.system.basic.maxSeries')" prop="storage_local_retention">
-              <el-input-number v-model="basic.query_max_series" controls-position="right" :min="-1" :max="1000" :precision="0"></el-input-number>
+              <el-input-number v-model="basic.query_max_series" controls-position="right" :min="-1" :max="1000" :precision="0" id="system-baisc-query_max_series"></el-input-number>
             </el-form-item>
             <el-form-item :label="$t('config.system.basic.timezone')" prop="timezone">
               <!--                <el-input v-model.number="basic.timezone" ></el-input>-->
-              <el-select v-model="basic.timezone">
-                <el-option v-for="(item,index) in timezoneOption" :key="index" :label="item.label" :value="item.value"></el-option>
+              <el-select v-model="basic.timezone" id="system-baisc-timezone" >
+                <el-option v-for="(item,index) in timezoneOption" :key="index" :label="item.label" :value="item.value" ></el-option>
               </el-select>
             </el-form-item>
             <el-form-item :label="$t('config.system.basic.unsaved')" prop="unsaved_change">
-              <el-switch v-model.number="basic.unsaved_change" active-color="rgb(238, 157, 63)"  active-value='on' inactive-value='off'>
+              <el-switch v-model.number="basic.unsaved_change" active-color="rgb(238, 157, 63)"  active-value='on' inactive-value='off' id="system-baisc-unsaved_change">
               </el-switch>
             </el-form-item>
             <el-form-item>
               <button
-                @click="resetForm('basicForm','basic')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button"
+                @click="resetForm('basicForm','basic')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button" id="system-basic-reset"
                 :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}"
               >{{$t('overall.reset')}}</button>
-              <button @click="saveSetInfo('basic','basicForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" type="button" v-has="'system_basic_save'"  :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('overall.submit')}}</button>
+              <button id="system-basic-save" @click="saveSetInfo('basic','basicForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" type="button" v-has="'system_basic_save'"  :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('overall.submit')}}</button>
             </el-form-item>
           </el-form>
         </div>
@@ -56,45 +56,45 @@
         <div class="system-config-form">
           <el-form :model="email"  label-width="180px" size="small" ref="emailForm" :rules="email.email_enable=='on'?emailRules:{}" :validate-on-rule-change="false">
             <el-form-item :label="$t('config.system.email.enable')" prop="email_enable">
-              <el-checkbox v-model="email.email_enable" true-label="on" false-label="off"  @change="switchChange('emailForm')"></el-checkbox>
+              <el-checkbox v-model="email.email_enable" true-label="on" false-label="off"  @change="switchChange('emailForm')" id="system-email-email_enable"></el-checkbox>
             </el-form-item>
             <el-form-item :label="$t('config.system.email.smtpHost')" prop="email_smtp_host">
-              <el-input v-model="email.email_smtp_host" :disabled="email.email_enable == 'off'"></el-input>
+              <el-input v-model="email.email_smtp_host" :disabled="email.email_enable == 'off'" id="system-email-email_smtp_host"></el-input>
             </el-form-item>
             <el-form-item :label="$t('config.system.email.smtpPort')" prop="email_smtp_port">
-              <el-input v-model.number="email.email_smtp_port" :disabled="email.email_enable == 'off'"></el-input>
+              <el-input v-model.number="email.email_smtp_port" :disabled="email.email_enable == 'off'" id="system-email-email_smtp_port"></el-input>
             </el-form-item>
             <el-form-item :label="$t('config.system.email.smtpAccount')" prop="email_smtp_account">
-              <el-input  v-model="email.email_smtp_account" :disabled="email.email_enable == 'off'"> autocomplete="off"</el-input>
+              <el-input  v-model="email.email_smtp_account" :disabled="email.email_enable == 'off'" id="system-email-email_smtp_account"> autocomplete="off"</el-input>
             </el-form-item>
             <el-form-item :label="$t('config.system.email.smtpPwd')" prop="email_smtp_password">
-              <el-input v-model="email.email_smtp_password" type="password" :show-password="false" :disabled="email.email_enable == 'off'"  autocomplete="off"></el-input>
+              <el-input v-model="email.email_smtp_password" type="password" :show-password="false" :disabled="email.email_enable == 'off'"  autocomplete="off" id="system-email-email_smtp_password"></el-input>
               <div><span>{{$t('config.system.email.pwdTip')}}</span></div>
             </el-form-item>
             <el-form-item :label="$t('config.system.email.sendAccount')" prop="email_send_account">
-              <el-input v-model="email.email_send_account" :disabled="email.email_enable == 'off'"></el-input>
+              <el-input v-model="email.email_send_account" :disabled="email.email_enable == 'off'" id="system-email-email_send_account"></el-input>
               <div><span>{{$t('config.system.email.sendAccountTip')}}</span></div>
             </el-form-item>
             <el-form-item :label="$t('config.system.email.testAccount')" prop="email_test_reciver">
-              <el-input v-model="email.email_test_reciver" :disabled="email.email_enable == 'off'"></el-input>
+              <el-input v-model="email.email_test_reciver" :disabled="email.email_enable == 'off'" id="system-email-email_test_reciver"></el-input>
               <div><span>{{$t('config.system.email.testAccountTip')}}</span></div>
             </el-form-item>
             <el-form-item :label="$t('config.system.email.useSSL')" prop="email_ssl_flag">
               <el-row :gutter="10">
-                <el-col :span="5"><el-checkbox v-model="email.email_ssl_flag" true-label="on" false-label="off" :disabled="email.email_enable == 'off'"></el-checkbox></el-col>
+                <el-col :span="5"><el-checkbox v-model="email.email_ssl_flag" true-label="on" false-label="off" :disabled="email.email_enable == 'off'" id="system-email-email_ssl_flag"></el-checkbox></el-col>
                 <el-col :span="15"><div><span>{{$t('config.system.email.sslTip')}}</span></div></el-col>
               </el-row>
             </el-form-item>
             <el-form-item :label="$t('config.system.email.useTLS')" prop="email_tls_flag">
               <el-row :gutter="10">
-                <el-col :span="5"><el-checkbox v-model="email.email_tls_flag" true-label='on' false-label='off' :disabled="email.email_enable == 'off'"></el-checkbox></el-col>
+                <el-col :span="5"><el-checkbox v-model="email.email_tls_flag" true-label='on' false-label='off' :disabled="email.email_enable == 'off'" id="system-email-email_tls_flag"></el-checkbox></el-col>
                 <el-col :span="16"><span>{{$t('config.system.email.tlsTip')}}</span></el-col>
               </el-row>
             </el-form-item>
             <el-form-item>
-              <button @click="resetForm('emailForm','email')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button">{{$t('overall.reset')}}</button>
-              <button :class="{'nz-btn-disabled':email.email_enable == 'off','nz-btn-disabled':prevent_opt.save}" :disabled="email.email_enable == 'off' || prevent_opt.save" @click="testSetInfo('email','emailForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button">{{$t('config.system.email.testConnection')}}</button>
-              <button @click="saveSetInfo('email','emailForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" type="button" v-has="'system_email_save'" :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('overall.submit')}}</button>
+              <button id="system-email-reset" @click="resetForm('emailForm','email')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button">{{$t('overall.reset')}}</button>
+              <button id="system-email-test" :class="{'nz-btn-disabled':email.email_enable == 'off','nz-btn-disabled':prevent_opt.save}" :disabled="email.email_enable == 'off' || prevent_opt.save" @click="testSetInfo('email','emailForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button">{{$t('config.system.email.testConnection')}}</button>
+              <button id="system-email-save" @click="saveSetInfo('email','emailForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" type="button" v-has="'system_email_save'" :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('overall.submit')}}</button>
             </el-form-item>
           </el-form>
         </div>
@@ -103,7 +103,7 @@
         <div class="system-config-form terminal">
           <el-form :model="terminal"  label-width="180px" size="small" ref="terminalForm" :rules="terminalRules">
             <el-form-item :label="$t('config.system.terminal.terminalNum')" prop="max_terminal_num">
-              <el-input-number v-model="terminal.max_terminal_num" controls-position="right" :min="1" :max="50"></el-input-number>
+              <el-input-number v-model="terminal.max_terminal_num" controls-position="right" :min="1" :max="50" id="system-terminal-max_terminal_num"></el-input-number>
             </el-form-item>
             <el-form-item>
               <button @click="saveSetInfo('terminal','terminalForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" type="button" v-has="'system_terminal_save'" :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('overall.submit')}}</button>
@@ -115,30 +115,30 @@
         <div class="system-config-form">
           <el-form :model="ldap"  label-width="180px" size="small" ref="ldapForm" :rules="ldap.ldap_enable == 'on'?ldapRules:{}" :validate-on-rule-change="false">
             <el-form-item :label="$t('config.system.ldap.active')" prop="ldap_enable">
-              <el-checkbox v-model="ldap.ldap_enable" true-label='on' false-label='off' @change="switchChange('ldapForm')"></el-checkbox>
+              <el-checkbox v-model="ldap.ldap_enable" true-label='on' false-label='off' @change="switchChange('ldapForm')" id="system-ldap-ldap_enable"></el-checkbox>
             </el-form-item>
             <el-form-item :label="$t('config.system.ldap.address')" prop="ldap_address">
-              <el-input v-model="ldap.ldap_address"></el-input>
+              <el-input v-model="ldap.ldap_address" id="system-ldap-ldap_address"></el-input>
             </el-form-item>
             <el-form-item :label="$t('config.system.ldap.dn')" prop="ldap_dn">
-              <el-input v-model="ldap.ldap_dn"></el-input>
+              <el-input v-model="ldap.ldap_dn" id="system-ldap-ldap_dn"></el-input>
             </el-form-item>
             <el-form-item :label="$t('config.system.ldap.pwd')" prop="ldap_password">
-              <el-input v-model="ldap.ldap_password" type="password"></el-input>
+              <el-input v-model="ldap.ldap_password" type="password" id="system-ldap-ldap_password"></el-input>
             </el-form-item>
             <el-form-item :label="$t('config.system.ldap.ou')" prop="ldap_ou">
-              <el-input v-model="ldap.ldap_ou"></el-input>
+              <el-input v-model="ldap.ldap_ou" id="system-ldap-ldap_ou"></el-input>
             </el-form-item>
             <el-form-item :label="$t('config.system.ldap.filter')" prop="ldap_user_filter">
-              <el-input v-model="ldap.ldap_user_filter"></el-input>
+              <el-input v-model="ldap.ldap_user_filter" id="system-ldap-ldap_user_filter"></el-input>
             </el-form-item>
             <el-form-item :label="$t('config.system.ldap.map')" prop="ldap_mapping">
-              <el-input v-model="ldap.ldap_mapping"></el-input>
+              <el-input v-model="ldap.ldap_mapping" id="system-ldap-ldap_mapping"></el-input>
             </el-form-item>
             <el-form-item>
-              <button @click="resetForm('ldapForm','ldap')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button">{{$t('overall.reset')}}</button>
-              <button @click="testSetInfo('ldap','ldapForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button" :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('config.system.email.testConnection')}}</button>
-              <button @click="saveSetInfo('ldap','ldapForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" type="button" v-has="'system_ldap_save'" :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('overall.submit')}}</button>
+              <button id='system-ldap-reset' @click="resetForm('ldapForm','ldap')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button">{{$t('overall.reset')}}</button>
+              <button id='system-ldap-test' @click="testSetInfo('ldap','ldapForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-light-new" type="button" :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('config.system.email.testConnection')}}</button>
+              <button id='system-ldap-save' @click="saveSetInfo('ldap','ldapForm')" class="nz-btn nz-btn-size-normal-new nz-btn-style-normal-new" type="button" v-has="'system_ldap_save'" :disabled="prevent_opt.save" :class="{'nz-btn-disabled':prevent_opt.save}">{{$t('overall.submit')}}</button>
             </el-form-item>
           </el-form>
         </div>
@@ -192,13 +192,13 @@
             <span class="linkTitleHandle"></span>
             <el-form :inline="true"  :model="notificationTemp"  label-width="180px" size="small" ref="notificationTempForm" :rules="notificationRules" :validate-on-rule-change="false" class="reset-form">
               <el-form-item  prop="name">
-                <el-input v-model="notificationTemp.name"  class="linkName"/>
+                <el-input v-model="notificationTemp.name"  class="linkName" id="system-notification-name"/>
               </el-form-item>
               <el-form-item  prop="filePath">
-                <el-input  v-model="notificationTemp.filePath" class="linkUrl"/>
+                <el-input  v-model="notificationTemp.filePath" class="linkUrl" id="system-notification-filepath"/>
               </el-form-item>
               <el-form-item  prop="btn">
-                <i @click="notificationAdd" class="nz-icon-create-square nz-icon" v-has="'system_notification_add'"></i>
+                <i @click="notificationAdd" id="system-notification-add" class="nz-icon-create-square nz-icon" v-has="'system_notification_add'"></i>
               </el-form-item>
             </el-form>
           </div>
@@ -259,13 +259,13 @@
             <span class="linkTitleHandle"></span>
             <el-form :inline="true"  :model="linkTemp"  label-width="180px" size="small" ref="linkTempForm" :rules="linkRules" :validate-on-rule-change="false" class="reset-form">
               <el-form-item  prop="name">
-                <el-input v-model="linkTemp.name"  class="linkName"/>
+                <el-input v-model="linkTemp.name"  class="linkName" id="system-link-name"/>
               </el-form-item>
               <el-form-item  prop="url">
-                <el-input  v-model="linkTemp.url" class="linkUrl"/>
+                <el-input  v-model="linkTemp.url" class="linkUrl"  id="system-link-url"/>
               </el-form-item>
               <el-form-item  prop="btn">
-                <i @click="linkAdd" class="nz-icon-create-square nz-icon" v-has="'system_link_add'"></i>
+                <i @click="linkAdd" class="nz-icon-create-square nz-icon" v-has="'system_link_add'" id="system-link-add"></i>
               </el-form-item>
             </el-form>
           </div>
diff --git a/nezha-fronted/src/components/page/config/terminallog.vue b/nezha-fronted/src/components/page/config/terminallog.vue
index 227e55b24..48eb13e68 100644
--- a/nezha-fronted/src/components/page/config/terminallog.vue
+++ b/nezha-fronted/src/components/page/config/terminallog.vue
@@ -16,6 +16,7 @@
     <!-- 自定义table列 -->
     <transition name="el-zoom-in-top">
       <element-set
+        id="terminal-log"
         v-if="tools.showCustomTableTitle"
         @close="tools.showCustomTableTitle = false"
         :custom-table-title.sync="tools.customTableTitle"
@@ -24,6 +25,7 @@
       ></element-set>
     </transition>
     <el-table
+      id="terminal-log-table"
       class="nz-table"
       :data="tableData"
       border
@@ -64,7 +66,7 @@
         </template>
       </el-table-column>
     </el-table>
-    <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn"><i class="nz-icon nz-icon-top"></i></button>
+    <button :class="{'to-top-is-hover': tools.tableHover}" :style="{top: tools.toTopBtnTop}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn" id="terminal-log-totop"><i class="nz-icon nz-icon-top"></i></button>
     <Pagination :tableId="tableId" :pageObj="pageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
   </div>
 </template>
diff --git a/nezha-fronted/src/components/page/dashboard/alertChartParam.vue b/nezha-fronted/src/components/page/dashboard/alertChartParam.vue
index 2248e1a5a..3982216f1 100644
--- a/nezha-fronted/src/components/page/dashboard/alertChartParam.vue
+++ b/nezha-fronted/src/components/page/dashboard/alertChartParam.vue
@@ -2,6 +2,7 @@
     <el-form :model="parameters" ref="alertChartParam" size="small" label-position="left" label-width="80px" class="alert-chart-param-form">
       <el-form-item :label="$t('dashboard.panel.chartForm.alertParam.select')" >
         <el-cascader
+          id="alert-param-select"
           v-model="parameters.select"
           :options="options"
           :props="props"
@@ -10,17 +11,17 @@
           clearable></el-cascader>
       </el-form-item>
       <el-form-item :label="$t('dashboard.panel.chartForm.alertParam.alertRule')">
-        <el-select class="form-item" size="small" popper-class="alert-form-pop no-style-class" v-model="parameters.alertRule" clearable>
+        <el-select class="form-item" size="small" popper-class="alert-form-pop no-style-class" v-model="parameters.alertRule" clearable id="alert-param-alertrule">
           <el-option v-for="(rule,index) in alertRules" :key="rule.id" :label="rule.alertName" :value="rule.id"></el-option>
         </el-select>
       </el-form-item>
       <el-form-item :label="$t('dashboard.panel.chartForm.alertParam.level')">
-        <el-select class="form-item" size="small" popper-class="alert-form-pop no-style-class" v-model="parameters.level" clearable>
+        <el-select class="form-item" size="small" popper-class="alert-form-pop no-style-class" v-model="parameters.level" clearable id="alert-param-level">
           <el-option v-for="(item,index) in levels" :key="item.value" :label="item.label" :value="item.value"></el-option>
         </el-select>
       </el-form-item>
       <el-form-item :label="$t('dashboard.panel.chartForm.alertParam.state')">
-        <el-select class="form-item" size="small" popper-class="alert-form-pop no-style-class" v-model="parameters.state" clearable>
+        <el-select class="form-item" size="small" popper-class="alert-form-pop no-style-class" v-model="parameters.state" clearable id="alert-param-state">
           <el-option v-for="(item,index) in states" :key="item.value" :label="item.label" :value="item.value"></el-option>
         </el-select>
       </el-form-item>
@@ -28,8 +29,6 @@
 </template>
 
 <script>
-  import i18n from "../../common/i18n";
-
   export default {
     name: "alertChartParam",
     props:{
diff --git a/nezha-fronted/src/components/page/dashboard/chartBox.vue b/nezha-fronted/src/components/page/dashboard/chartBox.vue
index d87ec9288..fdca2a15f 100644
--- a/nezha-fronted/src/components/page/dashboard/chartBox.vue
+++ b/nezha-fronted/src/components/page/dashboard/chartBox.vue
@@ -183,7 +183,7 @@
                           v-if="!editChart.id">
               <template v-slot:header>
                 <div class="panel-select-header">
-                  <el-input :placeholder="$t('overall.search')" clearable size="mini" style="width: 340px; margin-right: 5px;" v-model="filterPanel"></el-input>
+                  <el-input :placeholder="$t('overall.search')" clearable size="mini" style="width: 340px; margin-right: 5px;" v-model="filterPanel" id="chart-box-panelname"></el-input>
                 </div>
               </template>
               <template v-slot:trigger>
@@ -194,7 +194,7 @@
 
           </el-form-item>
           <el-form-item :label='$t("dashboard.panel.chartForm.chartName")' prop="title">
-            <el-input maxlength="64" show-word-limit size="small" v-model="editChart.title"></el-input>
+            <el-input maxlength="64" show-word-limit size="small" v-model="editChart.title" id="chart-box-title"></el-input>
           </el-form-item>
 
           <div class="right-box-sub-title">{{$t('dashboard.panel.chartForm.option')}}</div>
@@ -202,7 +202,7 @@
 
           <!-- type unit start-->
           <el-form-item :label="$t('dashboard.panel.chartForm.type')" class="half-form-item" prop="type">
-            <el-select @change="chartTypeChange" class="right-box-row-with-btn" placeholder="" popper-class="chart-box-dropdown-small" size="mini" v-model="editChart.type" value-key="chartType">
+            <el-select @change="chartTypeChange" class="right-box-row-with-btn" placeholder="" popper-class="chart-box-dropdown-small" size="mini" v-model="editChart.type" value-key="chartType" id="chart-box-type">
               <el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in chartTypeList">
                 <span class="panel-dropdown-label-txt" >{{item.name}}</span>
               </el-option>
@@ -210,7 +210,7 @@
           </el-form-item>
 
           <el-form-item :label="$t('dashboard.panel.chartForm.unit')" class="half-form-item" prop="unit" v-show="editChart.type !='text'">
-            <el-cascader :options="unitOptions" :props="{ expandTrigger: 'hover',emitPath:false }" :show-all-levels="false" @change="unitSelected"  filterable
+            <el-cascader :options="unitOptions" :props="{ expandTrigger: 'hover',emitPath:false }" :show-all-levels="false" @change="unitSelected"  filterable id="chart-box-unit"
                          placeholder=""
                          popper-class="dc-dropdown"
                          size="mini"
@@ -222,7 +222,7 @@
           <!--type unit end-->
 
           <el-form-item :label="$t('dashboard.panel.chartForm.width')" class="half-form-item" prop="span">
-            <el-select class="right-box-row-with-btn"  placeholder="" popper-class="chart-box-dropdown-mini" size="mini" v-model="editChart.span" value-key="chartSpan">
+            <el-select class="right-box-row-with-btn"  placeholder="" popper-class="chart-box-dropdown-mini" size="mini" v-model="editChart.span" value-key="chartSpan" id="chart-box-span">
               <el-option :key="item" :label="'span-' + item" :value="item" v-for="item in spanList">
                 <span class="panel-dropdown-label-txt" > span-{{item}}</span>
               </el-option>
@@ -231,6 +231,7 @@
 
           <el-form-item :label="$t('dashboard.panel.chartForm.high')" class="half-form-item"  prop="hight">
             <el-autocomplete
+              id="chart-box-height"
               :fetch-suggestions="querySearch"
               @select="handleSelect"
               placeholder=""
@@ -245,21 +246,21 @@
           </el-form-item>
 
           <el-form-item :label='$t("dashboard.panel.chartForm.url")' :rules="{ required: true,  message: $t('validate.required'), trigger: 'blur' }" prop="param.url" v-if="isUrl">
-            <el-input maxlength="1024" show-word-limit size="small" type="textarea" v-model="editChart.param.url"></el-input>
+            <el-input maxlength="1024" show-word-limit size="small" type="textarea" v-model="editChart.param.url" id="chart-box-url"></el-input>
           </el-form-item>
 
           <el-form-item  :label='"Null value"' class="half-form-item" prop="nullType"  v-if="editChart.type == 'line' || editChart.type == 'bar' || editChart.type == 'stackArea' || editChart.type == 'table'">
-            <el-select @change="$forceUpdate()"  class="right-box-row-with-btn" placeholder="" popper-class="chart-box-dropdown-small" size="mini" v-model="editChart.param.nullType">
+            <el-select @change="$forceUpdate()"  class="right-box-row-with-btn" placeholder="" popper-class="chart-box-dropdown-small" size="mini" v-model="editChart.param.nullType" id="chart-box-nullType">
               <el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in nullTypeList"></el-option>
             </el-select>
           </el-form-item>
 
           <el-form-item :label='$t("dashboard.panel.chartForm.threshold")' class="half-form-item" prop="param.threshold"  v-if="editChart.type == 'line' || editChart.type == 'bar' || editChart.type == 'stackArea'">
-            <el-input size="mini" type="input" v-model="editChart.param.threshold"></el-input>
+            <el-input size="mini" type="input" v-model="editChart.param.threshold" id="chart-box-threshold"></el-input>
           </el-form-item>
 
           <el-form-item :label="$t('dashboard.panel.chartForm.last')" v-if="editChart.type == 'table'">
-            <el-switch :active-value="1" :inactive-value="0" active-color="#ee9d3f" class="exporter-switch" v-model="editChart.param.last"></el-switch>
+            <el-switch :active-value="1" :inactive-value="0" active-color="#ee9d3f" class="exporter-switch" v-model="editChart.param.last" id="chart-box-last"></el-switch>
           </el-form-item>
 
           <!--<el-form-item :label="$t('dashboard.panel.chartForm.sync')" v-if="showPanel.type && showPanel.type == 'model'">-->
@@ -283,66 +284,67 @@
           <el-row class="element-item" style="width: calc(100% - 108px);margin-left: 108px" v-if="isAlert">
             <alert-chart-param @on-enter-complate="getAlertParam" ref="alertParamBox"></alert-chart-param>
           </el-row>
-
-          <el-row :key="'ele' + index" class="element-item form-row-item" style="" v-for="index of promqlKeys.length" v-if="!isUrl &&!isAlert && editChart.type != 'text'">
-            <promql-input
-              :expression-list="expressions"
-              :id="promqlKeys[index-1]"
-              :index="index-1"
-              :key="promqlKeys[index-1]"
-              :plugins="['metric-selector', 'metric-input', 'remove']"
-              :ref="'promql-'+(index-1)"
-              :showRemove="false"
-              :styleType="2"
-              @change="expressionChange"
-              @removeExpression="removeExpression"
-            ></promql-input>
-            <!--
-                      <promql-input
-                        :ref="'promql-'+(index-1)"
-                        :id="promqlKeys[index-1]"
-                        :key="promqlKeys[index-1]"
-                        :expression-list="expressions"
-                        :metric-options="metricOptions"
-                        :metric-store="metricStore"
-                        :index="index-1"
-                        :styleType="2"
-                        :plugins="['metric-selector', 'metric-input', 'remove']"
-                        @change="expressionChange"
-                        @removeExpression="removeExpression"
-                        :showRemove="false"
-                      ></promql-input>
-            -->
-            <el-row>
-              <template v-if="editChart.type != 'singleStat'">
-                <el-col style="width: 120px; padding-right: 20px; text-align: right; color: #666">
-                  {{$t('dashboard.panel.chartForm.legend')}}&nbsp;
-                  <el-popover placement="top" trigger="hover" width="211">
-                    <div style="word-break:keep-all;">{{$t('dashboard.panel.chartForm.legendTip')}}</div>
-                    <i @mouseover="rz" class="nz-icon nz-icon-info-normal" slot="reference" style="font-size: 14px; -webkit-transform:scale(0.75);display:inline-block;"></i>
-                  </el-popover>
-                </el-col>
-                <el-col style="width: calc(100% - 120px);">
-                  <el-input size="small" type="text" v-model="legends[index-1]"></el-input>
-                </el-col>
-              </template>
-              <template v-else>
-                <el-col class="required-marker" style="width: 120px; padding-right: 20px; text-align: right; color: #666">
-                  <label >{{$t('dashboard.panel.chartForm.statistics')}}</label>&nbsp;
-                </el-col>
-                <el-col style="width: calc(100% - 120px);">
-                  <el-select placeholder="" popper-class="chart-box-dropdown-mini" size="small" v-model="editChart.param.statistics">
-                    <el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in statisticsList">
-                      <span class="panel-dropdown-label-txt" >{{item.label}}</span>
-                    </el-option>
-                  </el-select>
-                </el-col>
-              </template>
-            </el-row>
-            <span class="nz-icon-minus-medium nz-icon-minus-position">
+          <div id="chart-box-expression-box" style="margin-bottom: 20px">
+            <el-row :key="'ele' + index" class="element-item form-row-item" style="" v-for="index of promqlKeys.length" v-if="!isUrl &&!isAlert && editChart.type != 'text'">
+              <promql-input
+                :expression-list="expressions"
+                :id="promqlKeys[index-1]"
+                :index="index-1"
+                :key="promqlKeys[index-1]"
+                :plugins="['metric-selector', 'metric-input', 'remove']"
+                :ref="'promql-'+(index-1)"
+                :showRemove="false"
+                :styleType="2"
+                @change="expressionChange"
+                @removeExpression="removeExpression"
+              ></promql-input>
+              <!--
+                        <promql-input
+                          :ref="'promql-'+(index-1)"
+                          :id="promqlKeys[index-1]"
+                          :key="promqlKeys[index-1]"
+                          :expression-list="expressions"
+                          :metric-options="metricOptions"
+                          :metric-store="metricStore"
+                          :index="index-1"
+                          :styleType="2"
+                          :plugins="['metric-selector', 'metric-input', 'remove']"
+                          @change="expressionChange"
+                          @removeExpression="removeExpression"
+                          :showRemove="false"
+                        ></promql-input>
+              -->
+              <el-row>
+                <template v-if="editChart.type != 'singleStat'">
+                  <el-col style="width: 120px; padding-right: 20px; text-align: right; color: #666">
+                    {{$t('dashboard.panel.chartForm.legend')}}&nbsp;
+                    <el-popover placement="top" trigger="hover" width="211">
+                      <div style="word-break:keep-all;">{{$t('dashboard.panel.chartForm.legendTip')}}</div>
+                      <i @mouseover="rz" class="nz-icon nz-icon-info-normal" slot="reference" style="font-size: 14px; -webkit-transform:scale(0.75);display:inline-block;"></i>
+                    </el-popover>
+                  </el-col>
+                  <el-col style="width: calc(100% - 120px);">
+                    <el-input size="small" type="text" v-model="legends[index-1]" ></el-input>
+                  </el-col>
+                </template>
+                <template v-else>
+                  <el-col class="required-marker" style="width: 120px; padding-right: 20px; text-align: right; color: #666">
+                    <label >{{$t('dashboard.panel.chartForm.statistics')}}</label>&nbsp;
+                  </el-col>
+                  <el-col style="width: calc(100% - 120px);">
+                    <el-select placeholder="" popper-class="chart-box-dropdown-mini" size="small" v-model="editChart.param.statistics" id="chart-box-panelname">
+                      <el-option :key="item.value" :label="item.label" :value="item.value" v-for="item in statisticsList">
+                        <span class="panel-dropdown-label-txt" >{{item.label}}</span>
+                      </el-option>
+                    </el-select>
+                  </el-col>
+                </template>
+              </el-row>
+              <span class="nz-icon-minus-medium nz-icon-minus-position">
             <i class="nz-icon nz-icon-minus" @click="removeExpression(index - 1)"></i>
           </span>
-        </el-row>
+            </el-row>
+          </div>
         <!--value mapping start-->
         <div  class="right-box-sub-title" v-if="editChart.type == 'singleStat'||editChart.type == 'table'">
           <span>
@@ -356,12 +358,12 @@
         </div>
         <div style="margin-bottom: 20px; width: 100%" v-if="editChart.type == 'singleStat'||editChart.type == 'table'"></div>
         <el-form-item :label="$t('dashboard.panel.chartForm.type')" prop="span" v-if="editChart.type == 'singleStat'||editChart.type == 'table'">
-          <el-radio-group v-model="editChart.param.valueMapping.type" fill="#FA901C" text-color="#FA901C" size="small" class="val-mapping-type"  @change="valueMappingChange">
+          <el-radio-group v-model="editChart.param.valueMapping.type" fill="#FA901C" text-color="#FA901C" size="small" class="val-mapping-type"  @change="valueMappingChange" id="chart-box-change-valuemapping">
             <el-radio-button label="value" border class="no-fill">{{$t('dashboard.panel.chartForm.valMapping.value')}}</el-radio-button>
             <el-radio-button label="range" border class="no-fill">{{$t('dashboard.panel.chartForm.valMapping.range')}}</el-radio-button>
           </el-radio-group>
         </el-form-item>
-        <template v-if="(editChart.type == 'singleStat'||editChart.type == 'table')&&editChart.param.valueMapping.type == 'value'">
+        <template v-if="(editChart.type == 'singleStat'||editChart.type == 'table')&&editChart.param.valueMapping.type == 'value'" id="chart-box-valueMapping-type1">
           <template  v-for="(mapping,index) in editChart.param.valueMapping.mapping">
             <el-form-item :label="$t('dashboard.panel.chartForm.valMapping.value')" prop="span" class="half-form-item-other" >
               <el-input size="mini" type="input" v-model="mapping.value" style="display: inline-block;;"></el-input>
@@ -402,7 +404,7 @@
             </el-form-item>
           </template>
         </template>
-        <template v-if="(editChart.type == 'singleStat'||editChart.type == 'table')&&editChart.param.valueMapping.type == 'range'">
+        <template v-if="(editChart.type == 'singleStat'||editChart.type == 'table')&&editChart.param.valueMapping.type == 'range'" id="chart-box-valueMapping-type2">
           <template  v-for="(mapping,index) in editChart.param.valueMapping.mapping">
             <div class="half-form-item-other" style="display: inline-block;margin-left: 70px">
               <el-form-item :label="$t('dashboard.panel.chartForm.valMapping.from')" prop="span" class="one-third-form-item-left" >
@@ -461,6 +463,7 @@
               <div style="flex: 1">
                 <span style="margin-right: 10px;color:rgb(102, 102, 102)">{{item.label}}</span>
                 <el-switch
+                  :id="'chart-box-legendValue-'+item.label"
                   v-model="editChart.param.legendValue[item.key]"
                   active-value="on"
                   inactive-value="off"
diff --git a/nezha-fronted/src/components/page/dashboard/explore/explore.vue b/nezha-fronted/src/components/page/dashboard/explore/explore.vue
index 5f8f1a44f..da8c032e9 100644
--- a/nezha-fronted/src/components/page/dashboard/explore/explore.vue
+++ b/nezha-fronted/src/components/page/dashboard/explore/explore.vue
@@ -4,10 +4,10 @@
         <!-- 顶部工具栏 -->
         <div class="top-tools" style="z-index: 1">
           <div class="top-tool-main-right">
-            <pick-time :refresh-data-func="expressionChange" v-model="filterTime" @unitChange="chartUnitChange" ref="pickTime">
+            <pick-time :refresh-data-func="expressionChange" v-model="filterTime" @unitChange="chartUnitChange" ref="pickTime" id="explore">
               <template slot="added-text">{{$t('dashboard.metricPreview.runQuery')}}</template>
             </pick-time>
-            <button :disabled="saveDisabled" @click="saveChart" type="button" v-has="'explore_chart_toAdd'"
+            <button :disabled="saveDisabled" @click="saveChart" type="button" v-has="'explore_chart_toAdd'" id="explore-save-chart"
                     class="nz-btn nz-btn-size-large nz-btn-style-normal nz-btn-min-width-120"
                     :class="{'nz-btn-disabled btn-disabled-cursor-not-allowed' : saveDisabled}">
               {{$t('dashboard.metric.saveChart')}}
@@ -16,7 +16,7 @@
         </div>
         <div style="height: calc(100% - 50px);width: 100%;" >
           <div ref="scrollWrap" style="height: 100%; overflow: auto;">
-            <div class="expression-room right-margin" style="padding-top: 5px">
+            <div class="expression-room right-margin" style="padding-top: 5px" id="explore-promql-box">
               <!--坑，这个index居然是从1开始-->
               <promql-input
                 v-for="index of promqlKeys.length"
diff --git a/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue b/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue
index c1ba96f15..4a67e1d9e 100644
--- a/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue
+++ b/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue
@@ -14,7 +14,7 @@
             <div class="input-box" @click="dropDownVisible=false" v-if="plugins.indexOf('metric-input') > -1">
               <!--            <el-autocomplete :placeholder="$t('dashboard.metricPreview.inputTip')" :fetch-suggestions="filterInput" clearable @clear="clearExpression" :trigger-on-focus="false" v-model="expressionList[index]" @blur="expressionChange" style="width: 100%;height:36px"></el-autocomplete>-->
               <!--<editor :styleType="styleType" :metric-list="metricStore" :history-param="historyParam" v-model="expressionList[index]" ref="editor" @on-enter="expressionChange" @on-blur="expressionChange" ></editor>?-->
-              <el-input @keyup.enter.native="expressionChange" v-model="expressionList[index]"></el-input>
+              <el-input @keyup.enter.native="expressionChange" v-model="expressionList[index]" :id="inputId"></el-input>
               <div class="append-msg error" v-if="errorMsg"><span>{{errorMsg}}</span></div>
               <div class="append-msg error" v-if="appendMsg"><span>{{appendMsg}}</span></div>
             </div>
@@ -71,6 +71,7 @@
         showRemove:{type:Boolean,default:true},
         projectRightBox:{type:Boolean,default:false},
         metricOptionsParent:{type:Array},
+        inputId:String,
         //metricOptions: {type: Array},
         //metricStore: {type: Array}
       },
diff --git a/nezha-fronted/src/components/page/dashboard/overview/overview2.vue b/nezha-fronted/src/components/page/dashboard/overview/overview2.vue
index ba6083981..c9889fa69 100644
--- a/nezha-fronted/src/components/page/dashboard/overview/overview2.vue
+++ b/nezha-fronted/src/components/page/dashboard/overview/overview2.vue
@@ -13,8 +13,8 @@
             <div class="week">{{sysWeek}}</div>
             <div class="sys-date">{{sysDate}}</div>
           </div>
-          <pick-time :refresh-data-func="setFreshDataTimer" :showTimePicker="false" :use-chart-unit="false" class="float-right pickTime margin-l-5" ref="pickTime" v-model="searchTime"></pick-time>
-          <div class="operation" @click="switchFullScreen" ><span ><i class="nz-icon screen-icon" :class="{'nz-icon-maxview':!isFullScreen,'nz-icon-exit-full-screen':isFullScreen}"></i></span></div>
+          <pick-time :refresh-data-func="setFreshDataTimer" :showTimePicker="false" :use-chart-unit="false" class="float-right pickTime margin-l-5" ref="pickTime" v-model="searchTime" id="overview-search"></pick-time>
+          <div class="operation" @click="switchFullScreen" id="overview-full-screen"><span ><i class="nz-icon screen-icon" :class="{'nz-icon-maxview':!isFullScreen,'nz-icon-exit-full-screen':isFullScreen}"></i></span></div>
         </div>
       </div>
     </div>
@@ -23,7 +23,7 @@
       <!--第一行-->
       <div class="content-row-box">
         <div class="content-col-box">
-          <div class="content-col-content clickable" v-loading="assetLoading" @click="jumpTo('asset')">
+          <div class="content-col-content clickable" v-loading="assetLoading" @click="jumpTo('asset')" id="overview-to-asset">
             <div class="content-col-content-icon"><i class="nz-icon nz-icon-overview-project"></i></div>
             <div class="content-num-box">
               <el-tooltip :content="assetData ? assetData.totalStat.total  + '' : ''" class="item" effect="light" placement="top">
@@ -84,7 +84,7 @@
           </div>
         </div>
         <div class="content-col-box">
-          <div class="content-col-content clickable" v-loading="alertMessageLoading" @click="jumpTo('alertList')">
+          <div class="content-col-content clickable" v-loading="alertMessageLoading" @click="jumpTo('alertList')" id="overview-to-alertlist" >
             <div class="content-col-content-icon"><i class="nz-icon nz-icon-overview-alert"></i></div>
             <div class="content-num-box">
               <el-tooltip :content="alertMessageData ? alertMessageData.alertMessageTotal + '' : ''" class="item" effect="light" placement="top">
diff --git a/nezha-fronted/src/components/page/dashboard/panel.vue b/nezha-fronted/src/components/page/dashboard/panel.vue
index d08698db5..014b4f875 100644
--- a/nezha-fronted/src/components/page/dashboard/panel.vue
+++ b/nezha-fronted/src/components/page/dashboard/panel.vue
@@ -2,7 +2,7 @@
   <div class="panel">
     <div class="top-tools">
       <div class="top-tool-main-left" v-if="panelData.length == 0" style="margin-left: 10px;">
-        <button @click="toAdd" class="nz-btn nz-btn-style-light nz-btn-size-small"><i class="nz-icon nz-icon-create-square"></i>&nbsp;&nbsp;{{$t("dashboard.panel.createPanelTitleSec")}}</button>
+        <button @click="toAdd" class="nz-btn nz-btn-style-light nz-btn-size-small" id="panel-add-panel"><i class="nz-icon nz-icon-create-square"></i>&nbsp;&nbsp;{{$t("dashboard.panel.createPanelTitleSec")}}</button>
       </div>
       <template v-else>
         <div class="top-tool-main-left">
@@ -10,8 +10,8 @@
                         @deletePanel="del" @editPanel="edit" @selectPanel="panelChange" ref="selectPanel" style="width: 300px;">
             <template v-slot:header>
               <div class="panel-select-header">
-                <el-input :placeholder="$t('overall.search')" clearable size="mini" style="width: 340px; margin-right: 5px;" v-model="filterPanel"></el-input>
-                <span :title='$t("dashboard.panel.createPanelTitleSec")' @click="toAdd" class="panel-select-add" v-has="'panel_toAdd'"><i class="nz-icon nz-icon-plus"></i></span>
+                <el-input :placeholder="$t('overall.search')" clearable size="mini" style="width: 340px; margin-right: 5px;" v-model="filterPanel" id="panel-list-search"></el-input>
+                <span :title='$t("dashboard.panel.createPanelTitleSec")' @click="toAdd" class="panel-select-add" v-has="'panel_toAdd'" id="panel-list-toadd"><i class="nz-icon nz-icon-plus"></i></span>
               </div>
             </template>
             <template v-slot:trigger>
@@ -65,13 +65,14 @@
         </div>
         <div class="top-tool-main-right">
           <div class="top-tool-search relative-position margin-r-20">
-            <el-input ref="queryPanel" @clear="clearInput" id="queryPanel" @focus="focusInput"  @blur="blurInput" v-model="filter.searchName" class="query-input-inactive" size="mini" clearable   >
+            <el-input ref="queryPanel" @clear="clearInput" id="queryPanel" @focus="focusInput"  @blur="blurInput" v-model="filter.searchName" class="query-input-inactive" size="mini" clearable  >
               <i slot="suffix" class="el-input__icon nz-icon nz-icon-search" @click="focusInput" style="float: right"></i>
             </el-input>
           </div>
 
-          <pick-time :refresh-data-func="dateChange" v-model="searchTime" :use-chart-unit="false" ref="pickTime"></pick-time>
+          <pick-time :refresh-data-func="dateChange" v-model="searchTime" :use-chart-unit="false" ref="pickTime" ssh"panel"></pick-time>
           <export-excel
+            id="panel"
             export-file-name="chart"
             export-url="/panel/export"
             import-url="/panel/import"
@@ -85,13 +86,13 @@
           >
             <template slot="optionZone">
               <button :title="$t('overall.createChart')" @click="addChart" v-has="'panel_chart_toAdd'"
-                      class="nz-btn nz-btn-size-normal nz-btn-style-light ">
+                      class="nz-btn nz-btn-size-normal nz-btn-style-light " id="panel-add-chart">
                 <i class="nz-icon-create-square nz-icon"></i>
               </button>
             </template>
           </export-excel>
           <div class="relative-position ">
-            <button @click="panelLock=!panelLock" class="nz-btn nz-btn-size-normal nz-btn-style-light" type="button"><i :class="{'nz-icon nz-icon-lock':panelLock,'nz-icon nz-icon-unlock':!panelLock}"></i></button>
+            <button @click="panelLock=!panelLock" class="nz-btn nz-btn-size-normal nz-btn-style-light" type="button" id="panel-lock"><i :class="{'nz-icon nz-icon-lock':panelLock,'nz-icon nz-icon-unlock':!panelLock}"></i></button>
           </div>
         </div>
       </template>
diff --git a/nezha-fronted/src/components/page/project/project.vue b/nezha-fronted/src/components/page/project/project.vue
index 4e44bb31b..8999daa98 100644
--- a/nezha-fronted/src/components/page/project/project.vue
+++ b/nezha-fronted/src/components/page/project/project.vue
@@ -34,6 +34,7 @@
               <search-input :searchMsg="endpointSearchMsg" @search="endpointSearch" ref="projectSearch"></search-input>
             </div>
             <export-excel
+              id="endpoint-list"
               export-file-name="endpoint"
               export-url="/endpoint/export"
               import-url="/endpoint/import"
@@ -56,6 +57,7 @@
         <!-- 自定义table列 -->
         <transition name="el-zoom-in-top">
           <element-set
+            id="endpoint-list"
             v-if="tools.showCustomTableTitle"
             @close="tools.showCustomTableTitle = false"
             :custom-table-title.sync="tools.customTableTitle"
@@ -64,6 +66,7 @@
           ></element-set>
         </transition>
         <el-table
+          id="endpoint-list-table"
           :data="endpointTableData"
           border
           class="nz-table endpoint-table"
@@ -166,7 +169,7 @@
             </template>
           </el-table-column>
         </el-table>
-        <button class="to-top" :style="{top: tools.toTopBtnTop}"
+        <button class="to-top" :style="{top: tools.toTopBtnTop}" id="endpoint-list-totop"
                 :class="{'to-top-is-hover': tools.tableHover}"
                 @click="toTop(scrollbarWrap)" v-show="tools.showTopBtn && bottomBox.mainResizeShow"><i
           class="nz-icon nz-icon-top"></i></button>