fix(接口测试): 修复断言步骤内容不支持鼠标滑动全选问题

--bug=1013062 --user=赵勇 [接口测试] github#12290断言文字不能全选 https://www.tapd.cn/55049933/s/1156233
This commit is contained in:
fit2-zhao 2022-05-11 18:40:46 +08:00 committed by jianxing
parent 9e34204462
commit eb1107def1
2 changed files with 155 additions and 152 deletions

View File

@ -1,5 +1,5 @@
<template> <template>
<el-card> <el-card :draggable="true">
<el-row> <el-row>
<span>{{ $t('api_test.request.assertions.description') }}</span> <span>{{ $t('api_test.request.assertions.description') }}</span>
<span style="float: right"> <span style="float: right">
@ -14,7 +14,8 @@
<div class="assertion-add" :draggable="draggable"> <div class="assertion-add" :draggable="draggable">
<el-row :gutter="10"> <el-row :gutter="10">
<el-col :span="4"> <el-col :span="4">
<el-select :disabled="isReadOnly" class="assertion-item" v-model="type" :placeholder="$t('api_test.request.assertions.select_type')" size="small"> <el-select :disabled="isReadOnly" class="assertion-item" v-model="type"
:placeholder="$t('api_test.request.assertions.select_type')" size="small">
<el-option :label="$t('api_test.request.assertions.text')" :value="options.TEXT"/> <el-option :label="$t('api_test.request.assertions.text')" :value="options.TEXT"/>
<el-option :label="$t('api_test.request.assertions.regex')" :value="options.REGEX"/> <el-option :label="$t('api_test.request.assertions.regex')" :value="options.REGEX"/>
<el-option :label="'JSONPath'" :value="options.JSON_PATH"/> <el-option :label="'JSONPath'" :value="options.JSON_PATH"/>
@ -94,171 +95,171 @@
</template> </template>
<script> <script>
import MsApiAssertionText from "./ApiAssertionText"; import MsApiAssertionText from "./ApiAssertionText";
import MsApiAssertionRegex from "./ApiAssertionRegex"; import MsApiAssertionRegex from "./ApiAssertionRegex";
import MsApiAssertionDuration from "./ApiAssertionDuration"; import MsApiAssertionDuration from "./ApiAssertionDuration";
import {ASSERTION_TYPE, JSONPath} from "../../model/ApiTestModel"; import {ASSERTION_TYPE, JSONPath} from "../../model/ApiTestModel";
import MsApiAssertionsEdit from "./ApiAssertionsEdit"; import MsApiAssertionsEdit from "./ApiAssertionsEdit";
import MsApiAssertionJsonPath from "./ApiAssertionJsonPath"; import MsApiAssertionJsonPath from "./ApiAssertionJsonPath";
import MsApiAssertionJsr223 from "./ApiAssertionJsr223"; import MsApiAssertionJsr223 from "./ApiAssertionJsr223";
import MsApiJsonpathSuggestList from "./ApiJsonpathSuggestList"; import MsApiJsonpathSuggestList from "./ApiJsonpathSuggestList";
import MsApiAssertionXPath2 from "./ApiAssertionXPath2"; import MsApiAssertionXPath2 from "./ApiAssertionXPath2";
import {getUUID} from "@/common/js/utils"; import {getUUID} from "@/common/js/utils";
import ApiJsonPathSuggestButton from "./ApiJsonPathSuggestButton"; import ApiJsonPathSuggestButton from "./ApiJsonPathSuggestButton";
import MsApiJsonpathSuggest from "./ApiJsonpathSuggest"; import MsApiJsonpathSuggest from "./ApiJsonpathSuggest";
import ApiBaseComponent from "../../../automation/scenario/common/ApiBaseComponent"; import ApiBaseComponent from "../../../automation/scenario/common/ApiBaseComponent";
import MsApiAssertionDocument from "./document/DocumentHeader"; import MsApiAssertionDocument from "./document/DocumentHeader";
export default { export default {
name: "MsApiAssertions", name: "MsApiAssertions",
components: { components: {
ApiBaseComponent, ApiBaseComponent,
MsApiJsonpathSuggest, MsApiJsonpathSuggest,
ApiJsonPathSuggestButton, ApiJsonPathSuggestButton,
MsApiAssertionXPath2, MsApiAssertionXPath2,
MsApiAssertionJsr223, MsApiAssertionJsr223,
MsApiJsonpathSuggestList, MsApiJsonpathSuggestList,
MsApiAssertionJsonPath, MsApiAssertionJsonPath,
MsApiAssertionsEdit, MsApiAssertionsEdit,
MsApiAssertionDuration, MsApiAssertionDuration,
MsApiAssertionRegex, MsApiAssertionRegex,
MsApiAssertionText, MsApiAssertionText,
MsApiAssertionDocument, MsApiAssertionDocument,
},
props: {
draggable: {
type: Boolean,
default: false,
}, },
isMax: { props: {
type: Boolean, draggable: {
default: false, type: Boolean,
}, default: false,
showBtn: {
type: Boolean,
default: true,
},
showVersion: {
type: Boolean,
default: true,
},
assertions: {},
node: {},
request: {},
apiId: String,
response: {},
customizeStyle: {
type: String,
default: "margin-top: 10px"
},
isReadOnly: {
type: Boolean,
default: false
}
},
data() {
return {
options: ASSERTION_TYPE,
time: "",
type: "",
loading: false,
reloadData: "",
}
},
watch: {
assertions: {
handler(v) {
this.computeStep();
}, },
deep: true isMax: {
}, type: Boolean,
}, default: false,
methods: { },
computeStep() { showBtn: {
let ruleSize = 0; type: Boolean,
ruleSize = (this.assertions.jsonPath.length + this.assertions.jsr223.length + this.assertions.regex.length + this.assertions.xpath2.length); default: true,
if (this.assertions && this.assertions.document.data && (this.assertions.document.data.json.length > 0 || this.assertions.document.data.xml.length > 0)) { },
ruleSize++; showVersion: {
type: Boolean,
default: true,
},
assertions: {},
node: {},
request: {},
apiId: String,
response: {},
customizeStyle: {
type: String,
default: "margin-top: 10px"
},
isReadOnly: {
type: Boolean,
default: false
} }
if (this.assertions.duration && this.assertions.duration.value > 0) { },
ruleSize++; data() {
return {
options: ASSERTION_TYPE,
time: "",
type: "",
loading: false,
reloadData: "",
} }
ruleSize += this.assertions.text ? this.assertions.text.length : 0;
this.request.ruleSize = ruleSize;
this.$emit('reload');
}, },
watch: {
after() { assertions: {
this.type = ""; handler(v) {
this.reloadData = getUUID().substring(0, 8); this.computeStep();
this.reload(); },
deep: true
},
}, },
copyRow() { methods: {
this.$emit('copyRow', this.assertions, this.node); computeStep() {
}, let ruleSize = 0;
suggestJsonOpen() { ruleSize = (this.assertions.jsonPath.length + this.assertions.jsr223.length + this.assertions.regex.length + this.assertions.xpath2.length);
this.$emit('suggestClick'); if (this.assertions && this.assertions.document.data && (this.assertions.document.data.json.length > 0 || this.assertions.document.data.xml.length > 0)) {
this.$nextTick(() => { ruleSize++;
if (!this.response || !this.response.responseResult || !this.response.responseResult.body) {
this.$message(this.$t('api_test.request.assertions.debug_first'));
return;
} }
this.$refs.jsonpathSuggest.open(this.response.responseResult.body); if (this.assertions.duration && this.assertions.duration.value > 0) {
}) ruleSize++;
}, }
reload() { ruleSize += this.assertions.text ? this.assertions.text.length : 0;
this.loading = true this.request.ruleSize = ruleSize;
this.$nextTick(() => { this.$emit('reload');
this.loading = false },
})
}, after() {
active() { this.type = "";
this.assertions.active = !this.assertions.active; this.reloadData = getUUID().substring(0, 8);
this.reload(); this.reload();
}, },
remove() { copyRow() {
this.$emit('remove', this.assertions, this.node); this.$emit('copyRow', this.assertions, this.node);
}, },
addJsonPathSuggest(data) { suggestJsonOpen() {
let jsonItem = new JSONPath(); this.$emit('suggestClick');
jsonItem.expression = data.path; this.$nextTick(() => {
jsonItem.expect = data.value; if (!this.response || !this.response.responseResult || !this.response.responseResult.body) {
jsonItem.setJSONPathDescription(); this.$message(this.$t('api_test.request.assertions.debug_first'));
let expect = jsonItem.expect; return;
if (expect) { }
expect = expect.replaceAll('\\', "\\\\").replaceAll('(', "\\(").replaceAll(')', "\\)") this.$refs.jsonpathSuggest.open(this.response.responseResult.body);
.replaceAll('+', "\\+").replaceAll('[', "\\[").replaceAll(']', "\\]") })
.replaceAll('?', "\\?").replaceAll('/', "\\/").replaceAll('*', "\\*") },
.replaceAll('^', "\\^").replaceAll('{', "\\{").replaceAll('}', "\\}").replaceAll('$', "\\$"); reload() {
this.loading = true
this.$nextTick(() => {
this.loading = false
})
},
active() {
this.assertions.active = !this.assertions.active;
this.reload();
},
remove() {
this.$emit('remove', this.assertions, this.node);
},
addJsonPathSuggest(data) {
let jsonItem = new JSONPath();
jsonItem.expression = data.path;
jsonItem.expect = data.value;
jsonItem.setJSONPathDescription();
let expect = jsonItem.expect;
if (expect) {
expect = expect.replaceAll('\\', "\\\\").replaceAll('(', "\\(").replaceAll(')', "\\)")
.replaceAll('+', "\\+").replaceAll('[', "\\[").replaceAll(']', "\\]")
.replaceAll('?', "\\?").replaceAll('/', "\\/").replaceAll('*', "\\*")
.replaceAll('^', "\\^").replaceAll('{', "\\{").replaceAll('}', "\\}").replaceAll('$', "\\$");
}
jsonItem.expect = expect;
jsonItem.enable = true;
this.assertions.jsonPath.push(jsonItem);
},
clearJson() {
this.assertions.jsonPath = [];
} }
jsonItem.expect = expect;
jsonItem.enable = true;
this.assertions.jsonPath.push(jsonItem);
},
clearJson() {
this.assertions.jsonPath = [];
} }
} }
}
</script> </script>
<style scoped> <style scoped>
.assertion-item { .assertion-item {
width: 100%; width: 100%;
} }
.assertion-add { .assertion-add {
padding: 10px; padding: 10px;
margin: 5px 0; margin: 5px 0;
border-radius: 5px; border-radius: 5px;
border: #DCDFE6 solid 1px; border: #DCDFE6 solid 1px;
} }
.icon.is-active { .icon.is-active {
transform: rotate(90deg); transform: rotate(90deg);
} }
/deep/ .el-card__body { /deep/ .el-card__body {
padding: 6px 10px; padding: 6px 10px;
} }
</style> </style>

View File

@ -89,6 +89,7 @@
:response="response" :response="response"
:is-read-only="data.disabled" :is-read-only="data.disabled"
:extract="data" :extract="data"
:draggable="true"
@copyRow="copyRow" @copyRow="copyRow"
@remove="remove" @remove="remove"
v-if="data.type==='Extract'" v-if="data.type==='Extract'"
@ -104,6 +105,7 @@
:response="response" :response="response"
:request="request" :request="request"
:apiId="apiId" :apiId="apiId"
:draggable="true"
:is-read-only="data.disabled" :is-read-only="data.disabled"
:assertions="data"/> :assertions="data"/>
</div> </div>