feat: support to duplicate test suite and case (#455)

* feat: support to duplicate test suite and case

* add e2e testing for the new apis

* fix the e2e testing

---------

Co-authored-by: rick <[email protected]>

Author: LinuxSuRen

Diff for: .editorconfig

@@ -0,0 +1,15 @@
+# EditorConfig is awesome: https://EditorConfig.org
+
+# top-most EditorConfig file
+root = true
+
+# Unix-style newlines with a newline ending every file
+[*]
+end_of_line = lf
+insert_final_newline = true
+charset = utf-8
+
+# 4 space indentation
+[*.{py,proto,go,js,ts,json,vue}]
+indent_style = space
+indent_size = 4

Diff for: .github/workflows/build.yaml

@@ -76,7 +76,7 @@ jobs:
       # - name: Operator
       #   run: cd operator && make build
 
-  BuildImage:
+  E2E:
     runs-on: ubuntu-22.04
     steps:
       - uses: actions/checkout@0ad4b8fadaa221de15dcec353f45205ec38ea70b  # v4.1.4
@@ -95,7 +95,7 @@ jobs:
           fi
           make helm-pkg
       - name: Core Image
-        run: GOPROXY=direct IMG_TOOL=docker make build
+        run: GOPROXY=direct IMG_TOOL=docker TAG=master REGISTRY=ghcr.io make image
       - name: Run e2e
         env:
           GITEE_TOKEN: ${{ secrets.GITEE_TOKEN }}

Diff for: console/atest-ui/src/locales/en.json

@@ -10,11 +10,15 @@
         "delete": "Delete",
         "send": "Send",
         "copy": "Copy",
+        "ok": "OK",
+        "reload": "Reload",
+        "insertSample": "Insert Sample",
         "toolbox": "Tool Box",
         "refresh": "Refresh",
         "newtestcase": "New TestCase",
         "viewYaml":"View YAML",
         "verify": "Verify",
+        "duplicate": "Duplicate",
         "generateCode": "Generate Code",
         "sendWithParam": "Send With Parameter",
         "fullScreen": "Full Screen",

Diff for: console/atest-ui/src/locales/zh.json

@@ -10,11 +10,15 @@
         "delete": "删除",
         "send": "发送",
         "copy": "拷贝",
+        "ok": "确定",
+        "reload": "重新加载",
+        "insertSample": "插入样例",
         "toolbox": "工具箱",
         "refresh": "刷新",
         "newtestcase": "新建测试用例",
-        "viewYaml":"查看 YAML",
+        "viewYaml": "查看 YAML",
         "verify": "检查",
+        "duplicate": "复制",
         "generateCode": "生成代码",
         "sendWithParam": "参数化",
         "fullScreen": "全屏显示",
@@ -57,4 +61,4 @@
         "key": "键",
         "value": "值"
     }
-}
+}

Diff for: console/atest-ui/src/views/MockManager.vue

@@ -2,6 +2,9 @@
 import { ref } from 'vue';
 import { Codemirror } from 'vue-codemirror';
 import { API } from './net';
+import {useI18n} from "vue-i18n";
+
+const { t } = useI18n()
 
 const mockConfig = ref('');
 const link = ref('')
@@ -10,19 +13,37 @@ API.GetMockConfig((d) => {
   link.value = window.location.origin + d.Prefix + "/api.json"
 })
 const tabActive = ref('yaml')
+const insertSample = () => {
+    mockConfig.value = `objects:
+  - name: projects
+    initCount: 3
+    sample: |
+      {
+        "name": "api-testing",
+        "color": "{{ randEnum "blue" "read" "pink" }}"
+      }
+items:
+  - name: base64
+    request:
+      path: /v1/base64
+    response:
+      body: aGVsbG8=
+      encoder: base64`
+}
 </script>
 
 <template>
-  <div>
-    <el-button type="warning" @click="API.ReloadMockServer(mockConfig)">Reload</el-button>
-    <el-divider direction="vertical" />
-    <el-link target="_blank" :href="link">{{ link }}</el-link> <!-- Noncompliant -->
-  </div>
-  <div>
-    <el-tabs v-model="tabActive">
-      <el-tab-pane label="YAML" name="yaml">
-        <Codemirror v-model="mockConfig" />
-      </el-tab-pane>
-    </el-tabs>
-  </div>
+    <div>
+        <el-button type="primary" @click="insertSample">{{t('button.insertSample')}}</el-button>
+        <el-button type="warning" @click="API.ReloadMockServer(mockConfig)">{{t('button.reload')}}</el-button>
+        <el-divider direction="vertical" />
+        <el-link target="_blank" :href="link">{{ link }}</el-link> <!-- Noncompliant -->
+    </div>
+    <div>
+        <el-tabs v-model="tabActive">
+            <el-tab-pane label="YAML" name="yaml">
+                <Codemirror v-model="mockConfig" />
+            </el-tab-pane>
+        </el-tabs>
+    </div>
 </template>

Diff for: console/atest-ui/src/views/TestCase.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { ref, watch } from 'vue'
 import { ElMessage } from 'element-plus'
-import { Edit, Delete, Search } from '@element-plus/icons-vue'
+import { Edit, Delete, Search, CopyDocument } from '@element-plus/icons-vue'
 import JsonViewer from 'vue-json-viewer'
 import type { Pair, TestResult, TestCaseWithSuite } from './types'
 import { NewSuggestedAPIsQuery, CreateFilter, GetHTTPMethods, FlattenObject } from './types'
@@ -433,7 +433,7 @@ function bodyTypeChange(e: number) {
   }
 }
 
-function jsonForamt() {
+function jsonFormat() {
   if (bodyType.value !== 5) {
     return
   }
@@ -500,6 +500,23 @@ const queryHeaderValues = (queryString: string, cb: (arg: any) => void) => {
   })
   cb(results)
 }
+
+const duplicateTestCaseDialog = ref(false)
+const targetTestCaseName = ref('')
+const openDuplicateTestCaseDialog = () => {
+    duplicateTestCaseDialog.value = true
+    targetTestCaseName.value = props.name + '-copy'
+}
+const duplicateTestCase = () => {
+    API.DuplicateTestCase(props.suite, props.suite, props.name, targetTestCaseName.value,(d) => {
+        duplicateTestCaseDialog.value = false
+        ElMessage({
+            message: 'Duplicated.',
+            type: 'success'
+        })
+        emit('updated')
+    })
+}
 </script>
 
 <template>
@@ -513,6 +530,7 @@ const queryHeaderValues = (queryString: string, cb: (arg: any) => void) => {
           v-if="!Cache.GetCurrentStore().readOnly"
           >{{ t('button.save') }}</el-button>
         <el-button type="primary" @click="deleteTestCase" :icon="Delete">{{ t('button.delete') }}</el-button>
+        <el-button type="primary" @click="openDuplicateTestCaseDialog" :icon="CopyDocument">{{ t('button.duplicate') }}</el-button>
         <el-button type="primary" @click="openCodeDialog">{{ t('button.generateCode') }}</el-button>
       </div>
       <div style="display: flex;">
@@ -649,7 +667,7 @@ const queryHeaderValues = (queryString: string, cb: (arg: any) => void) => {
 
           <div style="flex-grow: 1;">
             <Codemirror v-if="bodyType === 3 || bodyType === 5"
-              @change="jsonForamt"
+              @change="jsonFormat"
               v-model="testCaseWithSuite.data.request.body"/>
             <el-table :data="testCaseWithSuite.data.request.form" style="width: 100%" v-if="bodyType === 4">
               <el-table-column label="Key" width="180">
@@ -845,4 +863,13 @@ const queryHeaderValues = (queryString: string, cb: (arg: any) => void) => {
       </el-tabs>
     </el-footer>
   </el-container>
+
+    <el-drawer v-model="duplicateTestCaseDialog">
+        <template #default>
+            New Test Case Name:<el-input v-model="targetTestCaseName" />
+        </template>
+        <template #footer>
+            <el-button type="primary" @click="duplicateTestCase">{{ t('button.ok') }}</el-button>
+        </template>
+    </el-drawer>
 </template>