fix(测试计划): 调整执行测试计划中运行配置页面布局

--bug=1015041 --user=刘瑶【测试计划】执行测试计划页面样式优化 https://www.tapd.cn/55049933/s/1211843
2022-07-26 14:32:08 +08:00 · 2022-07-26 14:32:08 +08:00 · 3c86b14de3
parent fa7e599b77
commit 3c86b14de3
8 changed files with 359 additions and 272 deletions
--- a/frontend/src/business/components/api/automation/scenario/EnvGroup.vue
+++ b/frontend/src/business/components/api/automation/scenario/EnvGroup.vue
@ -9,7 +9,7 @@
      <span style="margin-left: 8px;">{{$t('workspace.env_group.name')}}</span>
      <i class="el-icon-view icon-view-btn" @click="viewGroup"></i>
    </div>
-    <el-button type="primary" @click="handleConfirm" size="small" class="env-confirm">{{$t('workspace.env_group.confirm')}}</el-button>
+    <el-button type="primary" @click="handleConfirm" size="small" :style="btnStyle" class="env-confirm">{{$t('workspace.env_group.confirm')}}</el-button>
    <el-dialog :visible="visble" append-to-body :title="$t('workspace.env_group.name')" @close="visble = false" style="height: 800px;">
      <template>
        <environment-group style="overflow-y: auto;"
@ -42,6 +42,12 @@ export default {
      }
    },
    projectIds: Set,
+    btnStyle: {
+      type: Object,
+      default() {
+        return {width: "360px"}
+      }
+    }
  },
  watch: {
    groupId(val) {
--- a/frontend/src/business/components/api/automation/scenario/EnvPopover.vue
+++ b/frontend/src/business/components/api/automation/scenario/EnvPopover.vue
@ -2,7 +2,7 @@
  <el-popover
    v-model="visible"
    :placement="placement"
-    width="400"
+    :width="width"
    :disabled="isReadOnly"
    @show="showPopover"
    trigger="click">
@ -18,10 +18,11 @@
                @close="visible = false"
                @setProjectEnvMap="setProjectEnvMap"
                v-show="!radio || radio === ENV_TYPE.JSON"
+                :btnStyle="btnStyle"
                ref="envSelect"/>
    <env-group ref="envGroup" v-show="radio === ENV_TYPE.GROUP && !hasOptionGroup" @close="visible = false"
               :project-ids="projectIds"
-               @setEnvGroup="setEnvGroup" :group-id="groupId"></env-group>
+               @setEnvGroup="setEnvGroup" :group-id="groupId" :btnStyle="btnStyle"></env-group>
    <!-- 对环境组选项进行分类 可用｜不可用 -->
    <env-group-with-option ref="envOptionGroup" v-show="radio === ENV_TYPE.GROUP && hasOptionGroup"
                           @close="visible = false"
@ -44,6 +45,10 @@ export default {
  name: "EnvPopover",
  components: {EnvGroup, EnvSelect, EnvGroupWithOption},
  props: {
+    width:{
+      type: String,
+      default: "400"
+    },
    envMap: Map,
    projectIds: Set,
    projectList: Array,
@ -95,6 +100,12 @@ export default {
      default() {
        return false;
      }
+    },
+    btnStyle: {
+      type: Object,
+      default() {
+        return {width: "360px"}
+      }
    }
  },
  data() {
--- a/frontend/src/business/components/api/automation/scenario/EnvSelect.vue
+++ b/frontend/src/business/components/api/automation/scenario/EnvSelect.vue
@ -23,7 +23,7 @@
      </span>
    </div>

-    <el-button type="primary" @click="handleConfirm" size="small" class="env-confirm">{{$t('workspace.env_group.confirm')}}</el-button>
+    <el-button type="primary" @click="handleConfirm" size="small" :style="btnStyle" class="env-confirm">{{$t('workspace.env_group.confirm')}}</el-button>

    <!-- 环境配置 -->
    <api-environment-config ref="environmentConfig" @close="environmentConfigClose"/>
@ -52,6 +52,12 @@ export default {
      default() {
        return {loading: false}
      }
+    },
+    btnStyle: {
+      type: Object,
+      default() {
+        return {width: "360px"}
+      }
    }
  },
  data() {
--- a/frontend/src/business/components/track/plan/common/PlanRunModeWithEnv.vue
+++ b/frontend/src/business/components/track/plan/common/PlanRunModeWithEnv.vue
@ -6,326 +6,387 @@
    @close="close"
    :visible.sync="runModeVisible"
  >
-    <div style="margin-bottom: 10px;">
-      <span class="ms-mode-span">{{ $t("commons.environment") }}：</span>
-      <env-popover :project-ids="projectIds"
-                   :placement="'bottom-start'"
-                   :project-list="projectList"
-                   :project-env-map="projectEnvListMap"
-                   :environment-type.sync="runConfig.environmentType"
-                   :group-id="runConfig.environmentGroupId"
-                   @setEnvGroup="setEnvGroup"
-                   @setProjectEnvMap="setProjectEnvMap"
-                   @showPopover="showPopover"
-                   ref="envPopover" class="env-popover"/>
-    </div>
-
-    <div style="margin-bottom: 10px;" v-if="haveUICase">
-      <span class="ms-mode-span">{{ $t("浏览器") }}：</span>
-      <el-select
-        size="mini"
-        v-model="runConfig.browser"
-        style="margin-right: 30px; width: 100px"
-      >
-        <el-option
-          v-for="b in browsers"
-          :key="b.value"
-          :value="b.value"
-          :label="b.label"
-        ></el-option>
-      </el-select>
-    </div>
-
-    <div>
-      <span class="ms-mode-span">{{ $t("run_mode.title") }}：</span>
-      <el-radio-group v-model="runConfig.mode" @change="changeMode">
-        <el-radio label="serial">{{ $t("run_mode.serial") }}</el-radio>
-        <el-radio label="parallel">{{ $t("run_mode.parallel") }}</el-radio>
-      </el-radio-group>
-    </div>
-    <div class="ms-mode-div" v-if="runConfig.mode === 'serial'">
-      <el-row>
-        <el-col :span="6">
-          <span class="ms-mode-pan">{{ $t("run_mode.other_config") }}：</span>
-        </el-col>
-        <el-col :span="18">
-          <div v-if="testType === 'API'">
-            <el-checkbox v-model="runConfig.runWithinResourcePool" style="padding-right: 10px;">
-              {{ $t('run_mode.run_with_resource_pool') }}
+    <div class="env-container">
+      <div class="run-env-row wrap">
+        <div class="title">{{ $t("commons.environment") }}：</div>
+        <div class="content">
+          <env-popover
+            :project-ids="projectIds"
+            :placement="'bottom-start'"
+            :project-list="projectList"
+            :project-env-map="projectEnvListMap"
+            :environment-type.sync="runConfig.environmentType"
+            :group-id="runConfig.environmentGroupId"
+            @setEnvGroup="setEnvGroup"
+            @setProjectEnvMap="setProjectEnvMap"
+            @showPopover="showPopover"
+            width="300"
+            ref="envPopover"
+            :btnStyle="btnStyle"
+            class="env-popover"
+          />
+        </div>
+      </div>
+      <div class="browser-row wrap">
+        <div class="title">{{ $t("ui.browser") }}：</div>
+        <div class="content">
+          <el-select
+            size="mini"
+            v-model="runConfig.browser"
+            style="margin-right: 30px; width: 100%"
+          >
+            <el-option
+              v-for="b in browsers"
+              :key="b.value"
+              :value="b.value"
+              :label="b.label"
+            ></el-option>
+          </el-select>
+        </div>
+      </div>
+      <div class="mode-row wrap">
+        <div class="title">{{ $t("run_mode.title") }}：</div>
+        <div class="content">
+          <el-radio-group
+            v-model="runConfig.mode"
+            @change="changeMode"
+            style="width: 100%"
+          >
+            <el-radio label="serial">{{ $t("run_mode.serial") }}</el-radio>
+            <el-radio label="parallel">{{ $t("run_mode.parallel") }}</el-radio>
+          </el-radio-group>
+        </div>
+      </div>
+      <div class="other-row wrap">
+        <div class="title other-title">{{ $t("run_mode.other_config") }}：</div>
+        <div class="other-content">
+          <!-- 串行 -->
+          <div
+            class="mode-row"
+            v-if="runConfig.mode === 'serial' && testType === 'API'"
+          >
+            <el-checkbox
+              v-model="runConfig.runWithinResourcePool"
+              style="padding-right: 10px"
+            >
+              {{ $t("run_mode.run_with_resource_pool") }}
            </el-checkbox>
-            <el-select :disabled="!runConfig.runWithinResourcePool" v-model="runConfig.resourcePoolId" size="mini">
+            <el-select
+              :disabled="!runConfig.runWithinResourcePool"
+              v-model="runConfig.resourcePoolId"
+              size="mini"
+              style="width: 135px; margin-left: 10px"
+            >
              <el-option
                v-for="item in resourcePools"
                :key="item.id"
                :label="item.name"
-                :value="item.id">
+                :value="item.id"
+              >
              </el-option>
            </el-select>
          </div>
-        </el-col>
-      </el-row>
-    </div>
-    <div class="ms-mode-div" v-if="runConfig.mode === 'parallel'">
-      <el-row>
-        <el-col :span="6">
-          <span class="ms-mode-span">{{ $t("run_mode.other_config") }}：</span>
-        </el-col>
-        <el-col :span="18">
-          <div v-if="testType === 'API'">
-            <el-checkbox v-model="runConfig.runWithinResourcePool" style="padding-right: 10px;">
-              {{ $t('run_mode.run_with_resource_pool') }}
+          <!-- 并行 -->
+          <div
+            class="mode-row"
+            v-if="runConfig.mode === 'parallel' && testType === 'API'"
+          >
+            <el-checkbox
+              v-model="runConfig.runWithinResourcePool"
+              style="padding-right: 10px"
+            >
+              {{ $t("run_mode.run_with_resource_pool") }}
            </el-checkbox>
-            <el-select :disabled="!runConfig.runWithinResourcePool" v-model="runConfig.resourcePoolId" size="mini">
+            <el-select
+              :disabled="!runConfig.runWithinResourcePool"
+              v-model="runConfig.resourcePoolId"
+              size="mini"
+              style="width: 135px; margin-left: 10px"
+            >
              <el-option
                v-for="item in resourcePools"
                :key="item.id"
                :label="item.name"
                :disabled="!item.api"
-                :value="item.id">
+                :value="item.id"
+              >
              </el-option>
            </el-select>
          </div>
-        </el-col>
-      </el-row>
-    </div>
-    <!-- 失败重试 -->
-    <div class="ms-failure-div" v-if="isHasLicense">
-      <el-row>
-        <el-col :span="6">
-          <span class="ms-mode-span">&nbsp;</span>
-        </el-col>
-        <el-col :span="18">
-          <el-checkbox v-model="runConfig.retryEnable" class="ms-failure-div-right">
-            {{ $t('run_mode.retry_on_failure') }}
-          </el-checkbox>
-          <span v-if="runConfig.retryEnable">
-            <el-tooltip placement="top">
-              <div slot="content">{{ $t('run_mode.retry_message') }}</div>
-              <i class="el-icon-question" style="cursor: pointer"/>
-            </el-tooltip>
-            <span>
-              {{ $t('run_mode.retry') }}
-              <el-input-number :value="runConfig.retryNum" v-model="runConfig.retryNum" :min="1" :max="10000000"
-                               size="mini"/>
-              &nbsp;
-              {{ $t('run_mode.retry_frequency') }}
-            </span>
-          </span>
-        </el-col>
-      </el-row>
-    </div>
-    <div class="ms-failure-div" v-if="runConfig.mode === 'serial'">
-      <el-row>
-        <el-col :span="18" :offset="6">
-          <div>
-            <el-checkbox v-model="runConfig.onSampleError">{{ $t("api_test.fail_to_stop") }}</el-checkbox>
-          </div>
-        </el-col>
-      </el-row>
-    </div>

-    <div>
-      <el-row>
-        <el-col :span="18" :offset="6">
-          <div style="margin-top: 10px" v-if="haveUICase">
+          <!-- 失败重试 -->
+          <div class="mode-row" v-if="isHasLicense">
+            <el-checkbox
+              v-model="runConfig.retryEnable"
+              class="ms-failure-div-right"
+            >
+              {{ $t("run_mode.retry_on_failure") }}
+            </el-checkbox>
+            <span v-if="runConfig.retryEnable">
+              <el-tooltip placement="top" style="margin: 0 4px 0 2px">
+                <div slot="content">{{ $t("run_mode.retry_message") }}</div>
+                <i class="el-icon-question" style="cursor: pointer" />
+              </el-tooltip>
+              <span style="margin-left: 10px">
+                {{ $t("run_mode.retry") }}
+                <el-input-number
+                  :value="runConfig.retryNum"
+                  v-model="runConfig.retryNum"
+                  :min="1"
+                  :max="10000000"
+                  size="mini"
+                  style="width: 103px"
+                />
+                &nbsp;
+                {{ $t("run_mode.retry_frequency") }}
+              </span>
+            </span>
+          </div>
+
+          <div class="mode-row" v-if="runConfig.mode === 'serial'">
+            <el-checkbox v-model="runConfig.onSampleError">{{
+              $t("api_test.fail_to_stop")
+            }}</el-checkbox>
+          </div>
+
+          <div class="mode-row" v-if="haveUICase">
            <el-checkbox v-model="runConfig.headlessEnabled">
-              {{ $t("性能模式") }}
+              {{ $t("ui.performance_mode") }}
            </el-checkbox>
          </div>
-        </el-col>
-      </el-row>
+        </div>
+      </div>
    </div>

    <template v-slot:footer>
      <div class="dialog-footer" v-if="showSave">
-        <el-button @click="close">{{ $t('commons.cancel') }}</el-button>
+        <el-button @click="close">{{ $t("commons.cancel") }}</el-button>
        <el-dropdown @command="handleCommand" style="margin-left: 5px">
          <el-button type="primary">
-            {{ $t('load_test.save_and_run') }}<i class="el-icon-arrow-down el-icon--right"></i>
+            {{ $t("load_test.save_and_run")
+            }}<i class="el-icon-arrow-down el-icon--right"></i>
          </el-button>
          <el-dropdown-menu slot="dropdown">
-            <el-dropdown-item command="run">{{ $t('load_test.save_and_run') }}</el-dropdown-item>
-            <el-dropdown-item command="save">{{$t('commons.save')}}</el-dropdown-item>
+            <el-dropdown-item command="run">{{
+              $t("load_test.save_and_run")
+            }}</el-dropdown-item>
+            <el-dropdown-item command="save">{{
+              $t("commons.save")
+            }}</el-dropdown-item>
          </el-dropdown-menu>
        </el-dropdown>
      </div>
-      <ms-dialog-footer v-else @cancel="close" @confirm="handleRunBatch"/>
+      <ms-dialog-footer v-else @cancel="close" @confirm="handleRunBatch" />
    </template>
  </el-dialog>
 </template>

 <script>
-  import MsDialogFooter from "@/business/components/common/components/MsDialogFooter";
-  import EnvPopover from "@/business/components/api/automation/scenario/EnvPopover";
-  import {strMapToObj} from "@/common/js/utils";
-  import {ENV_TYPE} from "@/common/js/constants";
-  import {hasLicense} from "@/common/js/utils";
+import MsDialogFooter from "@/business/components/common/components/MsDialogFooter";
+import EnvPopover from "@/business/components/api/automation/scenario/EnvPopover";
+import { strMapToObj } from "@/common/js/utils";
+import { ENV_TYPE } from "@/common/js/constants";
+import { hasLicense } from "@/common/js/utils";

-  export default {
-    name: "MsPlanRunModeWithEnv",
-    components: {EnvPopover, MsDialogFooter},
-    data() {
-      return {
-        runModeVisible: false,
-        testType: null,
-        resourcePools: [],
-        runConfig: {
-          mode: "serial",
-          reportType: "iddReport",
-          onSampleError: false,
-          runWithinResourcePool: false,
-          resourcePoolId: null,
-          envMap: new Map(),
-          environmentGroupId: "",
-          environmentType: ENV_TYPE.JSON,
-          retryEnable: false,
-          retryNum: 1,
-          browser: "CHROME"
+export default {
+  name: "MsPlanRunModeWithEnv",
+  components: { EnvPopover, MsDialogFooter },
+  data() {
+    return {
+      btnStyle: {
+        width: "260px",
+      },
+      runModeVisible: false,
+      testType: null,
+      resourcePools: [],
+      runConfig: {
+        mode: "serial",
+        reportType: "iddReport",
+        onSampleError: false,
+        runWithinResourcePool: false,
+        resourcePoolId: null,
+        envMap: new Map(),
+        environmentGroupId: "",
+        environmentType: ENV_TYPE.JSON,
+        retryEnable: false,
+        retryNum: 1,
+        browser: "CHROME",
+      },
+      isHasLicense: hasLicense(),
+      projectEnvListMap: {},
+      projectList: [],
+      projectIds: new Set(),
+      options: [
+        {
+          value: "confirmAndRun",
+          label: this.$t("load_test.save_and_run"),
        },
-        isHasLicense: hasLicense(),
-        projectEnvListMap: {},
-        projectList: [],
-        projectIds: new Set(),
-        options: [{
-          value: 'confirmAndRun',
-          label: this.$t('load_test.save_and_run')
-        }, {
-          value: 'save',
-          label: this.$t('commons.save')
-        }],
-        value: 'confirmAndRun',
-        browsers: [
-          {
-            label: this.$t("chrome"),
-            value: "CHROME",
-          },
-          {
-            label: this.$t("firefox"),
-            value: "FIREFOX",
-          }
-        ],
+        {
+          value: "save",
+          label: this.$t("commons.save"),
+        },
+      ],
+      value: "confirmAndRun",
+      browsers: [
+        {
+          label: this.$t("chrome"),
+          value: "CHROME",
+        },
+        {
+          label: this.$t("firefox"),
+          value: "FIREFOX",
+        },
+      ],
+    };
+  },
+  props: {
+    planCaseIds: {
+      type: Array,
+    },
+    type: String,
+    planId: String,
+    showSave: {
+      type: Boolean,
+      default: false,
+    },
+    //是否含有ui场景 有 ui 场景就要展示 浏览器选项，性能模式
+    haveUICase: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  methods: {
+    open(testType) {
+      this.runModeVisible = true;
+      this.testType = testType;
+      this.getResourcePools();
+      this.getWsProjects();
+    },
+    changeMode() {
+      this.runConfig.onSampleError = false;
+      this.runConfig.runWithinResourcePool = false;
+      this.runConfig.resourcePoolId = null;
+    },
+    close() {
+      this.runConfig = {
+        mode: "serial",
+        reportType: "iddReport",
+        onSampleError: false,
+        runWithinResourcePool: false,
+        resourcePoolId: null,
+        envMap: new Map(),
+        environmentGroupId: "",
+        environmentType: ENV_TYPE.JSON,
+        browser: "CHROME",
      };
+      this.runModeVisible = false;
+      this.$emit("close");
    },
-    props: {
-      planCaseIds: {
-        type: Array,
-      },
-      type: String,
-      planId: String,
-      showSave: {
-        type: Boolean,
-        default: false
-      },
-      //是否含有ui场景 有 ui 场景就要展示 浏览器选项，性能模式
-      haveUICase: {
-        type: Boolean,
-        default: false
-      }
+    handleRunBatch() {
+      this.$emit("handleRunBatch", this.runConfig);
+      this.close();
    },
-    methods: {
-      open(testType) {
-        this.runModeVisible = true;
-        this.testType = testType;
-        this.getResourcePools();
-        this.getWsProjects();
-      },
-      changeMode() {
-        this.runConfig.onSampleError = false;
-        this.runConfig.runWithinResourcePool = false;
-        this.runConfig.resourcePoolId = null;
-      },
-      close() {
-        this.runConfig = {
-          mode: "serial",
-          reportType: "iddReport",
-          onSampleError: false,
-          runWithinResourcePool: false,
-          resourcePoolId: null,
-          envMap: new Map(),
-          environmentGroupId: "",
-          environmentType: ENV_TYPE.JSON,
-          browser: "CHROME"
-        };
-        this.runModeVisible = false;
-        this.$emit('close');
-      },
-      handleRunBatch() {
-        this.$emit("handleRunBatch", this.runConfig);
-        this.close();
-      },
-      getResourcePools() {
-        this.result = this.$get('/testresourcepool/list/quota/valid', response => {
+    getResourcePools() {
+      this.result = this.$get(
+        "/testresourcepool/list/quota/valid",
+        (response) => {
          this.resourcePools = response.data;
-        });
-      },
-      setProjectEnvMap(projectEnvMap) {
-        this.runConfig.envMap = strMapToObj(projectEnvMap);
-      },
-      setEnvGroup(id) {
-        this.runConfig.environmentGroupId = id;
-      },
-      getWsProjects() {
-        this.$get("/project/getOwnerProjects", res => {
-          this.projectList = res.data;
-        })
-      },
-      showPopover() {
-        this.projectIds.clear();
-        let param = undefined;
-        let url = "";
-        if (this.type === 'apiCase') {
-          url = '/test/plan/api/case/env';
-          param = this.planCaseIds;
-        } else if (this.type === 'apiScenario') {
-          url = '/test/plan/api/scenario/env';
-          param = this.planCaseIds;
-        } else if (this.type === 'plan') {
-          url = '/test/plan/case/env';
-          param = {id: this.planId};
        }
-        this.$post(url, param, res => {
-          let data = res.data;
-          if (data) {
-            this.projectEnvListMap = data;
-            for (let d in data) {
-              this.projectIds.add(d);
-            }
+      );
+    },
+    setProjectEnvMap(projectEnvMap) {
+      this.runConfig.envMap = strMapToObj(projectEnvMap);
+    },
+    setEnvGroup(id) {
+      this.runConfig.environmentGroupId = id;
+    },
+    getWsProjects() {
+      this.$get("/project/getOwnerProjects", (res) => {
+        this.projectList = res.data;
+      });
+    },
+    showPopover() {
+      this.projectIds.clear();
+      let param = undefined;
+      let url = "";
+      if (this.type === "apiCase") {
+        url = "/test/plan/api/case/env";
+        param = this.planCaseIds;
+      } else if (this.type === "apiScenario") {
+        url = "/test/plan/api/scenario/env";
+        param = this.planCaseIds;
+      } else if (this.type === "plan") {
+        url = "/test/plan/case/env";
+        param = { id: this.planId };
+      }
+      this.$post(url, param, (res) => {
+        let data = res.data;
+        if (data) {
+          this.projectEnvListMap = data;
+          for (let d in data) {
+            this.projectIds.add(d);
          }
-          this.$refs.envPopover.openEnvSelect();
-        });
-      },
-      handleCommand(command) {
-        if (this.runConfig.runWithinResourcePool && this.runConfig.resourcePoolId == null) {
-          this.$warning(this.$t('workspace.env_group.please_select_run_within_resource_pool'));
-          return;
-        }
-        if (command === 'run') {
-          this.runConfig.isRun = true
-          this.handleRunBatch();
-        } else {
-          this.runConfig.isRun = false
-          this.handleRunBatch();
        }
+        this.$refs.envPopover.openEnvSelect();
+      });
+    },
+    handleCommand(command) {
+      if (
+        this.runConfig.runWithinResourcePool &&
+        this.runConfig.resourcePoolId == null
+      ) {
+        this.$warning(
+          this.$t("workspace.env_group.please_select_run_within_resource_pool")
+        );
+        return;
+      }
+      if (command === "run") {
+        this.runConfig.isRun = true;
+        this.handleRunBatch();
+      } else {
+        this.runConfig.isRun = false;
+        this.handleRunBatch();
      }
    },
-  };
+  },
+};
 </script>

 <style scoped>
-  .ms-mode-span {
-    margin-right: 10px;
-  }
+.env-container .title {
+  width: 100px;
+  min-width: 100px;
+  text-align: right;
+  padding-right: 10px;
+}
+.env-container .content {
+  width: 163px;
+}

-  .ms-mode-div {
-    margin-top: 20px;
-  }
+.wrap {
+  display: flex;
+  align-items: center;
+  padding: 5px 10px 5px 10px;
+}

-  .ms-failure-div {
-    margin-top: 10px;
-  }
+/deep/.content .el-popover__reference {
+  width: 100%;
+}

-  .ms-failure-div-right {
-    padding-right: 10px;
-  }
+.mode-row {
+  margin-top: 10px;
+}

+.other-title {
+  height: 100%;
+  margin-top: 25px;
+  align-items: flex-start;
+}
+.other-content {
+  height: 100%;
+}
+
+.other-row {
+  height: 125px;
+}
 </style>
--- a/frontend/src/business/components/xpack
+++ b/frontend/src/business/components/xpack
@ -1 +1 @@
-Subproject commit 298d8ad3fa5f305cb8c70dd01bc26aea01d2f099
+Subproject commit 2e055b3fa8c7f24b2dfa7ec1e3ab39fd4f072007
--- a/frontend/src/i18n/en-US.js
+++ b/frontend/src/i18n/en-US.js
@ -3350,5 +3350,6 @@ export default {
    valiate_fail: "Validate fail",
    check_subitem: 'check subitem',
    pause: 'Pause',
+    browser: "Browser",
  }
 };
--- a/frontend/src/i18n/zh-CN.js
+++ b/frontend/src/i18n/zh-CN.js
@ -3359,5 +3359,6 @@ export default {
    check_element: "请勾选元素",
    check_subitem: '请选择子分类',
    pause: '等待时间',
+    browser: "浏览器",
  }
 };
--- a/frontend/src/i18n/zh-TW.js
+++ b/frontend/src/i18n/zh-TW.js
@ -3336,5 +3336,6 @@ export default {
    cmdExtractElement: "提取元素信息",
    valiate_fail: "校驗失敗，請檢查必填項",
    pause: '等待時間',
+    browser: "瀏覽器",
  }
 };