From ae0d601c536472d9a88e641f2abd27bdba1a815b Mon Sep 17 00:00:00 2001
From: baiqi <qi.bai@fit2cloud.com>
Date: Tue, 4 Jul 2023 12:11:06 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E6=8E=A5=E5=8F=A3=E6=B5=8B=E8=AF=95):=20?=
 =?UTF-8?q?=E5=A4=A7=E6=95=B0=E6=8D=AE=E9=87=8F=E6=97=B6=E7=9A=84=E6=8E=A5?=
 =?UTF-8?q?=E5=8F=A3=E5=88=97=E8=A1=A8=E8=99=9A=E6=8B=9F=E6=BB=9A=E5=8A=A8?=
 =?UTF-8?q?=E9=AB=98=E5=BA=A6=E8=AE=A1=E7=AE=97=E8=B0=83=E4=BC=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

--bug=1027497 --user=白奇 【接口测试】  github#25304在使用平台做测试时chrome经常出现崩溃问题 https://www.tapd.cn/55049933/s/1389144
---
 api-test/frontend/package.json                |   2 +-
 .../automation/scenario/EditApiScenario.vue   | 232 +++++++++---------
 2 files changed, 116 insertions(+), 118 deletions(-)

diff --git a/api-test/frontend/package.json b/api-test/frontend/package.json
index 0b155de161..77013d1930 100644
--- a/api-test/frontend/package.json
+++ b/api-test/frontend/package.json
@@ -17,7 +17,7 @@
     "@fortawesome/free-regular-svg-icons": "^5.12.0",
     "@fortawesome/free-solid-svg-icons": "^5.12.0",
     "@fortawesome/vue-fontawesome": "^0.1.9",
-    "@ba1q1/vue-easy-tree": "^1.0.4",
+    "@ba1q1/vue-easy-tree": "^1.1.0",
     "axios": "^0.27.2",
     "diffable-html": "^4.0.0",
     "echarts": "^5.0.2",
diff --git a/api-test/frontend/src/business/automation/scenario/EditApiScenario.vue b/api-test/frontend/src/business/automation/scenario/EditApiScenario.vue
index 7f7986f0ef..2336f73c89 100644
--- a/api-test/frontend/src/business/automation/scenario/EditApiScenario.vue
+++ b/api-test/frontend/src/business/automation/scenario/EditApiScenario.vue
@@ -87,26 +87,26 @@
           <div class="debug-header">
             <div class="ms-col-one mt-2">
               <div class="mt-2" v-show="scenarioDefinition.length > 1">
-              <el-tooltip
-                :content="$t('test_track.case.batch_operate')"
-                placement="top"
-                effect="light"
-                v-show="!isBatchProcess">
-                <font-awesome-icon
-                  class="ms-batch-btn"
-                  :icon="['fa', 'bars']"
-                  v-prevent-re-click
-                  @click="batchProcessing" />
-              </el-tooltip>
-              <el-checkbox v-show="isBatchProcess" v-model="isCheckedAll" @change="checkedAll" />
-              <el-tooltip :content="$t('commons.cancel')" placement="top" effect="light" v-show="isBatchProcess">
-                <font-awesome-icon
-                  class="ms-batch-btn"
-                  :icon="['fa', 'times']"
-                  v-prevent-re-click
-                  @click="cancelBatchProcessing" />
-              </el-tooltip>
-            </div>
+                <el-tooltip
+                  :content="$t('test_track.case.batch_operate')"
+                  placement="top"
+                  effect="light"
+                  v-show="!isBatchProcess">
+                  <font-awesome-icon
+                    class="ms-batch-btn"
+                    :icon="['fa', 'bars']"
+                    v-prevent-re-click
+                    @click="batchProcessing" />
+                </el-tooltip>
+                <el-checkbox v-show="isBatchProcess" v-model="isCheckedAll" @change="checkedAll" />
+                <el-tooltip :content="$t('commons.cancel')" placement="top" effect="light" v-show="isBatchProcess">
+                  <font-awesome-icon
+                    class="ms-batch-btn"
+                    :icon="['fa', 'times']"
+                    v-prevent-re-click
+                    @click="cancelBatchProcessing" />
+                </el-tooltip>
+              </div>
               <div class="ml-10">{{ $t('api_test.automation.step_total') }}：{{ scenarioDefinition.length }}</div>
               <div class="ml-10">
                 <el-link class="head" @click="showScenarioParameters"
@@ -141,8 +141,7 @@
                 @saveRefresh="setDomain"
                 :has-option-group="true"
                 ref="envPopover"
-                class="ml-10"
-              />
+                class="ml-10" />
 
               <el-tooltip class="mt-2 ml-10" v-if="!debugLoading" content="Ctrl + R" placement="top">
                 <el-dropdown
@@ -271,102 +270,98 @@
             </el-row>
             <el-row>
               <!-- 场景步骤内容 -->
-              <div ref="stepInfo" style="height: calc(100vh - 170px);">
-                  <vue-easy-tree
-                    node-key="resourceId"
-                    height="calc(100vh - 170px)"
-                    :minItemSize="43"
-                    :sizeDependencies="['expanded']"
-                    :props="props"
-                    :data="scenarioDefinition"
-                    :buffer="200"
-                    class="ms-tree"
-                    :expand-on-click-node="false"
-                    :allow-drop="allowDrop"
-                    :allow-drag="allowDrag"
-                    :empty-text="$t('api_test.scenario.step_info')"
-                    highlight-current
-                    :show-checkbox="isBatchProcess"
-                    @node-drag-end="nodeDragEnd"
-                    @node-click="nodeClick"
-                    draggable
-                    isDynamic
-                    ref="stepTree"
-                    :key="reloadTree">
-                    <el-row
-                      class="custom-tree-node"
-                      :gutter="10"
-                      type="flex"
-                      align="middle"
-                      slot-scope="{ node, data }"
-                      style="width: 100%">
+              <div ref="stepInfo" style="height: calc(100vh - 170px)">
+                <vue-easy-tree
+                  node-key="id"
+                  height="calc(100vh - 170px)"
+                  :minItemSize="43"
+                  :sizeDependencies="['expanded']"
+                  :props="props"
+                  :data="scenarioDefinition"
+                  :buffer="300"
+                  class="ms-tree"
+                  :expand-on-click-node="false"
+                  :allow-drop="allowDrop"
+                  :allow-drag="allowDrag"
+                  :empty-text="$t('api_test.scenario.step_info')"
+                  highlight-current
+                  :show-checkbox="isBatchProcess"
+                  @node-drag-end="nodeDragEnd"
+                  @node-click="nodeClick"
+                  draggable
+                  isDynamic
+                  ref="stepTree"
+                  :key="reloadTree">
+                  <el-row
+                    class="custom-tree-node"
+                    :gutter="10"
+                    type="flex"
+                    align="middle"
+                    slot-scope="{ node, data }"
+                    style="width: 100%">
+                    <span
+                      class="custom-tree-node-col"
+                      style="padding-left: 0px; padding-right: 0px"
+                      v-show="node && data.hashTree && data.hashTree.length > 0 && !data.isLeaf">
                       <span
-                        class="custom-tree-node-col"
-                        style="padding-left: 0px; padding-right: 0px"
-                        v-show="node && data.hashTree && data.hashTree.length > 0 && !data.isLeaf">
-                        <span
-                          v-show="!node.expanded"
-                          class="el-icon-circle-plus-outline custom-node_e"
-                          @click="openOrClose(node, data)" />
-                        <span
-                          v-show="node.expanded"
-                          class="el-icon-remove-outline custom-node_e"
-                          @click="openOrClose(node, data)" />
-                      </span>
-                      <!-- 批量操作 -->
+                        v-show="!node.expanded"
+                        class="el-icon-circle-plus-outline custom-node_e"
+                        @click="openOrClose(node, data)" />
                       <span
-                        :class="data.checkBox ? 'custom-tree-node-hide' : 'custom-tree-node-col'"
-                        style="padding-left: 0px; padding-right: 0px"
-                        v-show="(data.hashTree && data.hashTree.length === 0) || data.isLeaf">
-                        <show-more-btn
-                          :is-show="node.checked"
-                          :buttons="batchOperators"
-                          v-show="data.checkBox"
-                          :show-size="false"
-                          style="margin-right: 10px" />
-                      </span>
-                      <span style="width: calc(100% - 40px)">
-                        <!-- 步骤组件-->
-                        <ms-component-config
-                          :scenario-definition="scenarioDefinition"
-                          :message="message"
-                          :type="data.type"
-                          :scenario="data"
-                          :response="response"
-                          :currentScenario="currentScenario"
-                          :node="node"
-                          :project-list="projectList"
-                          :env-map="projectEnvMap"
-                          :env-group-id="envGroupId"
-                          :environment-type="environmentType"
-                          @remove="remove"
-                          @copyRow="copyRow"
-                          @suggestClick="suggestClick"
-                          @refReload="refReload"
-                          @runScenario="runDebug"
-                          @stopScenario="stop"
-                          @setDomain="setDomain"
-                          @openScenario="openScenario"
-                          @editScenarioAdvance="editScenarioAdvance"
-                          ref="componentConfig"
-                          v-if="
-                            stepFilter.get('ALlSamplerStep').indexOf(data.type) === -1 ||
-                            !node.parent ||
-                            !node.parent.data ||
-                            stepFilter.get('AllSamplerProxy').indexOf(node.parent.data.type) === -1
-                          " />
-                        <div v-else class="el-tree-node is-hidden is-focusable is-leaf" style="display: none">
-                          {{ hideNode(node) }}
-                        </div>
-                      </span>
-                    </el-row>
-                  </vue-easy-tree>
-                </div>
+                        v-show="node.expanded"
+                        class="el-icon-remove-outline custom-node_e"
+                        @click="openOrClose(node, data)" />
+                    </span>
+                    <!-- 批量操作 -->
+                    <span
+                      :class="data.checkBox ? 'custom-tree-node-hide' : 'custom-tree-node-col'"
+                      style="padding-left: 0px; padding-right: 0px"
+                      v-show="(data.hashTree && data.hashTree.length === 0) || data.isLeaf">
+                      <show-more-btn
+                        :is-show="node.checked"
+                        :buttons="batchOperators"
+                        v-show="data.checkBox"
+                        :show-size="false"
+                        style="margin-right: 10px" />
+                    </span>
+                    <span
+                      v-if="
+                        stepFilter.get('ALlSamplerStep').indexOf(data.type) === -1 ||
+                        !node.parent ||
+                        !node.parent.data ||
+                        stepFilter.get('AllSamplerProxy').indexOf(node.parent.data.type) === -1
+                      "
+                      style="width: calc(100% - 40px)">
+                      <!-- 步骤组件-->
+                      <ms-component-config
+                        :scenario-definition="scenarioDefinition"
+                        :message="message"
+                        :type="data.type"
+                        :scenario="data"
+                        :response="response"
+                        :currentScenario="currentScenario"
+                        :node="node"
+                        :project-list="projectList"
+                        :env-map="projectEnvMap"
+                        :env-group-id="envGroupId"
+                        :environment-type="environmentType"
+                        @remove="remove"
+                        @copyRow="copyRow"
+                        @suggestClick="suggestClick"
+                        @refReload="refReload"
+                        @runScenario="runDebug"
+                        @stopScenario="stop"
+                        @setDomain="setDomain"
+                        @openScenario="openScenario"
+                        @editScenarioAdvance="editScenarioAdvance"
+                        ref="componentConfig" />
+                    </span>
+                  </el-row>
+                </vue-easy-tree>
+              </div>
             </el-row>
             <el-row>
-              <el-col :span="21">
-                
-              </el-col>
+              <el-col :span="21"> </el-col>
               <!-- 按钮列表 -->
               <el-col :span="3">
                 <div
@@ -1182,8 +1177,11 @@ export default {
     },
     margeTransaction(item, console, arr) {
       arr.forEach((sub) => {
-        if (item.data && item.data.id + '_' + item.data.parentIndex === sub.resourceId
-          && item.data.requestResult.length === 0) {
+        if (
+          item.data &&
+          item.data.id + '_' + item.data.parentIndex === sub.resourceId &&
+          item.data.requestResult.length === 0
+        ) {
           sub.responseResult.console = console;
           item.data.requestResult.push(sub);
           // 更新父节点状态
@@ -1767,7 +1765,7 @@ export default {
         this.clearResult(this.scenarioDefinition);
         this.clearNodeStatus(this.$refs.stepTree.root.childNodes);
         runScenario.run = false;
-        this.message = "STOP";
+        this.message = 'STOP';
         return;
       }
       let hasRequest = runScenario && runScenario.hasRequest;