feat: replay report optimize (#559)

* feat: create plan with name * feat: hidden appOwnerConfig modal * fix: arex-request preRequest/test header text * feat: create plan advanced options * feat: planItem table remove State / Time consumed * refactor: report filter * fix: rename retry * feat: deleteReport * fix: skipMock i18n * fix: replayCase table recordId remove link style * fix: replayEndTime i18n * fix: remove caseRange --------- Co-authored-by: onePone <[email protected]>
arextest · Dec 11, 2023 · 8452c53 · 8452c53
1 parent d6483b1
commit 8452c53
Show file tree

Hide file tree

Showing 16 changed files with 223 additions and 269 deletions.
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "arex",
   "private": true,
-  "version": "0.6.9",
+  "version": "0.6.10",
   "description": "",
   "homepage": "https://github.com/arextest/arex",
   "main": "index.js",

diff --git a/packages/arex-request/package.json b/packages/arex-request/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@arextest/arex-request",
-  "version": "0.3.3",
+  "version": "0.3.4",
   "type": "module",
   "main": "dist/arex-request.js",
   "module": "dist/arex-request.js",

diff --git a/packages/arex-request/src/components/Request/PreRequestScript.tsx b/packages/arex-request/src/components/Request/PreRequestScript.tsx
@@ -9,17 +9,6 @@ import { preTestCodeSnippet } from './snippets';
 
 const { Text } = Typography;
 
-export const ResponseTestHeader = styled.div`
-  display: flex;
-  justify-content: space-between;
-  & > span:first-of-type {
-    font-size: 13px;
-    line-height: 32px;
-    font-weight: 500;
-    color: #9d9d9d;
-  }
-`;
-
 export const ResponseTestWrapper = styled.div`
   overflow-y: auto;
   display: flex;
@@ -56,9 +45,8 @@ const PreRequestScript = () => {
         flex-direction: column;
       `}
     >
-      <ResponseTestHeader>
-        <span>{t('preRequest.javascript_code')}</span>
-      </ResponseTestHeader>
+      <Typography.Text type='secondary'>{t('preRequest.javascript_code')}</Typography.Text>
+
       <ResponseTestWrapper>
         <div
           css={css`

diff --git a/packages/arex-request/src/components/Request/RequestTests.tsx b/packages/arex-request/src/components/Request/RequestTests.tsx
@@ -8,27 +8,17 @@ import { useArexRequestStore } from '../../hooks';
 import { testCodeSnippet } from './snippets';
 
 const { Text } = Typography;
-export const RequestTestHeader = styled.div`
-  display: flex;
-  justify-content: space-between;
-  & > span:first-of-type {
-    font-size: 13px;
-    line-height: 32px;
-    font-weight: 500;
-    color: #9d9d9d;
-  }
-`;
 
 export const RequestTestWrapper = styled.div`
   overflow-y: auto;
+  overflow-x: hidden;
   display: flex;
   justify-content: space-between;
   flex: 1;
   & > div:last-of-type {
     width: 35%;
     text-align: left;
-    //border-left: 1px solid #eee;
-    padding-left: 20px;
+    padding-left: 8px;
   }
 `;
 
@@ -66,16 +56,13 @@ const RequestTests = () => {
         flex-direction: column;
       `}
     >
-      <RequestTestHeader>
-        <span>{t('preRequest.javascript_code')}</span>
-      </RequestTestHeader>
+      <Typography.Text type='secondary'>{t('preRequest.javascript_code')}</Typography.Text>
 
       <RequestTestWrapper>
         <div
           css={css`
             min-width: 0;
             flex: 1;
-            //width: 100%;
           `}
         >
           <Editor
@@ -99,47 +86,31 @@ const RequestTests = () => {
             flex-direction: column;
           `}
         >
-          <Text
-            type={'secondary'}
-            css={css`
-              margin-bottom: 4px;
-            `}
-          >
+          <Text type={'secondary'}>
             Test scripts are written in JavaScript, and are run after the response is received.
           </Text>
-          <div>
-            <a
-              type='text'
-              onClick={() =>
-                window.open('https://learning.postman.com/docs/writing-scripts/test-scripts/')
-              }
-              style={{ marginLeft: '8px' }}
-            >
-              Read documentation
-            </a>
-          </div>
-          <Text
-            type={'secondary'}
-            css={css`
-              padding: 16px 0;
-            `}
-          >
-            Snippets
-          </Text>
-          <div
-            css={css`
-              overflow: auto;
-              flex: 1;
-            `}
+          <a
+            type='text'
+            rel='noreferrer'
+            target={'_blank'}
+            href={'https://learning.postman.com/docs/writing-scripts/test-scripts/'}
+            style={{ marginLeft: '8px' }}
           >
-            {codeSnippet.map((e, i) => (
+            Read documentation
+          </a>
+
+          <br />
+
+          <Text type={'secondary'}>Snippets</Text>
+          <div>
+            {codeSnippet.map((snippet, i) => (
               <ThemeColorPrimaryButton
                 key={i}
                 size='small'
                 type='text'
-                onClick={() => addTest(e.text)}
+                onClick={() => addTest(snippet.text)}
               >
-                {e.name}
+                {snippet.name}
               </ThemeColorPrimaryButton>
             ))}
           </div>

diff --git a/packages/arex/package.json b/packages/arex/package.json
@@ -1,7 +1,7 @@
 {
   "name": "arex",
   "private": true,
-  "version": "0.6.9",
+  "version": "0.6.10",
   "author": "arextest",
   "main": "dist-electron/main.js",
   "files": [

diff --git a/packages/arex/src/i18n/locales/cn/common.json b/packages/arex/src/i18n/locales/cn/common.json
@@ -78,5 +78,8 @@
     "quickPick": "快速选择",
     "1d": "近一天"
   },
-  "checkAll": "选择全部"
+  "checkAll": "选择全部",
+  "advancedOptions": "高级选项",
+  "and": "和",
+  "or": "或"
 }
diff --git a/packages/arex/src/i18n/locales/cn/components.json b/packages/arex/src/i18n/locales/cn/components.json
@@ -83,15 +83,18 @@
     "emptyCaseRange": "回放范围不能为空",
     "emptyStartTime": "Case 开始时间不能为空",
     "emptyEndTime": "Case 结束时间不能为空",
+    "planName": "回放名称",
+    "planNamePlaceholder": "可选，默认为应用名称 + 创建时间",
     "paths": "回放路径",
     "pathsTooltip": "选择需要回放的路径。如果不指定，默认情况下，所有路径下的用例都将被回放。",
-    "replayReportName": "任务名称",
+    "pathsPlaceholder": "可选，默认选择所有路径",
     "state": "状态",
     "all": "全部",
     "passed": "成功",
     "failed": "失败",
     "invalid": "无效",
     "blocked": "待执行",
+    "queued": "队列中",
     "executor": "执行人",
     "replayStartTime": "开始时间",
     "report": "报告",
@@ -112,7 +115,7 @@
     "denoise": "对比配置推荐",
     "noDenoiseRecommended": "暂无对比配置推荐",
     "logs": "执行日志",
-    "retry": "重新计算",
+    "retry": "失败重试",
     "rerun": "重新执行",
     "rerunError": "重新执行(仅错误类型)",
     "rerunTip": "确定重新执行该回放?",
@@ -298,6 +301,7 @@
     "maxQPS": "最大QPS",
     "QPSTips": "有效范围 1 - 20",
     "emptyQPS": "请输入最大QPS",
+    "skipMock": "不Mock依赖",
     "sync": "同步",
     "emptyContractTip": "无报文契约，请尝试同步更新契约",
     "contract": "契约",

diff --git a/packages/arex/src/i18n/locales/en/common.json b/packages/arex/src/i18n/locales/en/common.json
@@ -81,5 +81,8 @@
     "quickPick": "Quick Pick",
     "1d": "1d"
   },
-  "checkAll": "Check All"
+  "checkAll": "Check All",
+  "advancedOptions": "Advanced Options",
+  "and": " and",
+  "or": " or"
 }
diff --git a/packages/arex/src/i18n/locales/en/components.json b/packages/arex/src/i18n/locales/en/components.json
@@ -83,23 +83,27 @@
     "emptyCaseRange": "Case range can't be empty",
     "emptyStartTime": "Start Time can't be empty",
     "emptyEndTime": "End Time can't be empty",
+    "planName": "Name",
+    "planNamePlaceholder": "Optional, defaults to app name + creation time",
     "paths": "Paths",
     "pathsTooltip": "Select the paths for which cases will be replayed. If not specified, all paths will be replayed by default.",
-    "replayReportName": "Report",
+    "pathsPlaceholder": "Optional, all paths are selected by default",
+    "replayReportName": " Report Name",
     "state": "State",
     "all": "All",
     "passed": "Passed",
     "failed": "Failed",
     "invalid": "Invalid",
     "blocked": "Blocked",
+    "queued": "Queued",
     "executor": "Executor",
     "replayStartTime": "Replay Start Time",
     "report": "Report",
     "basicInfo": "Basic Information",
     "replayPassRate": "Replay Pass Rate",
     "passRate": "Pass Rate",
     "apiPassRate": "API Pass Rate",
-    "reportName": "Report Name",
+    "reportName": " Report Name",
     "reportId": "Report ID",
     "recordVersion": "Record version",
     "replayVersion": "Replay version",
@@ -177,7 +181,7 @@
     "escExit": "Press Esc to exit",
     "addIgnoreSuccess": "Ignore node successfully",
     "diffMatch": "Diff Match",
-    "replayEndTime": "ReplayEndTime",
+    "replayEndTime": "Replay End Time",
     "operationName": "Operation Name",
     "recordedCaseCount": "Case Count",
     "recordTime": "Record Time",
@@ -299,6 +303,7 @@
     "maxQPS": "Max QPS",
     "QPSTips": "Allowable value range 1 - 20",
     "emptyQPS": "Please input your max QPS",
+    "skipMock": "Skip Mock",
     "sync": "Sync",
     "emptyContractTip": "No contract, please try to synchronize the contract",
     "contract": "Contract",

diff --git a/packages/arex/src/panes/AppSetting/Replay/index.tsx b/packages/arex/src/panes/AppSetting/Replay/index.tsx
@@ -84,22 +84,10 @@ const SettingReplay: React.FC<SettingRecordProps> = ({ appId }) => {
           <InputNumber min={1} max={20} precision={0} />
         </Form.Item>
 
-        <Form.Item
-          label={
-            <HelpTooltip title={t('appSetting.caseRangeTooltip')}>
-              {t('appSetting.caseRange')}
-            </HelpTooltip>
-          }
-          name='offsetDays'
-          rules={[{ required: true, message: t('appSetting.emptyCaseRange') as string }]}
-        >
-          <InputNumber min={1} />
-        </Form.Item>
-
         <Form.Item
           label={
             <HelpTooltip title={t('appSetting.exclusionTooltip')}>
-              {t('appSetting.exclusion')}
+              {t('appSetting.skipMock')}
             </HelpTooltip>
           }
           name='excludeOperationMap'