fix(接口测试): 文档结构根保护处理防止解析错误

--bug=1009952 --user=赵勇 【接口测试】文档结构断言-跟随api定义,接口响应格式错误时会报错 https://www.tapd.cn/55049933/s/1098029
This commit is contained in:
fit2-zhao 2022-01-25 13:59:57 +08:00 committed by 刘瑞斌
parent a3c6f213b6
commit d3b810c062
2 changed files with 340 additions and 329 deletions

View File

@ -17,11 +17,11 @@
</el-col> </el-col>
<el-col :span="4"> <el-col :span="4">
<el-select v-model="pickValue.type" :disabled="disabledType" class="ms-col-type" @change="onChangeType" size="small"> <el-select v-model="pickValue.type" :disabled="disabledType" class="ms-col-type" @change="onChangeType" size="small">
<el-option :key="t" :value="t" :label="t" v-for="t in TYPE_NAME"/> <el-option :key="t" :value="t" :label="t" v-for="t in types"/>
</el-select> </el-select>
</el-col> </el-col>
<el-col :span="4"> <el-col :span="4">
<ms-mock :disabled="pickValue.type==='object' || pickValue.type==='array' || pickValue.type==='null'" :schema="pickValue"/> <ms-mock :disabled="pickKey ==='root' || pickValue.type==='object' || pickValue.type==='array' || pickValue.type==='null'" :schema="pickValue"/>
</el-col> </el-col>
<el-col :span="4"> <el-col :span="4">
<el-input v-model="pickValue.description" class="ms-col-title" :placeholder="$t('schema.description')" size="small"/> <el-input v-model="pickValue.description" class="ms-col-title" :placeholder="$t('schema.description')" size="small"/>
@ -51,28 +51,28 @@
<p class="tip">{{ $t("schema.base_setting") }} </p> <p class="tip">{{ $t("schema.base_setting") }} </p>
<el-form label-position="left" label-width="100px" v-model="advancedValue" class="ms-advanced-search-form"> <el-form label-position="left" label-width="100px" v-model="advancedValue" class="ms-advanced-search-form">
<div :span="8" v-for="(item,key) in advancedValue" :key="key"> <div :span="8" v-for="(item,key) in advancedValue" :key="key">
<el-form-item :label="$t('schema.'+key)"> <el-form-item :label="$t('schema.'+key)">
<el-input-number v-model="advancedValue[key]" v-if="advancedAttr[key].type === 'integer'" style="width:100%" :placeholder="key" size="small"/> <el-input-number v-model="advancedValue[key]" v-if="advancedAttr[key].type === 'integer'" style="width:100%" :placeholder="key" size="small"/>
<el-input-number v-model="advancedValue[key]" v-else-if="advancedAttr[key].type === 'number'" style="width:100%" :placeholder="key" size="small"/> <el-input-number v-model="advancedValue[key]" v-else-if="advancedAttr[key].type === 'number'" style="width:100%" :placeholder="key" size="small"/>
<span v-else-if="advancedAttr[key].type === 'boolean'" style="display:inline-block;width:100%"> <span v-else-if="advancedAttr[key].type === 'boolean'" style="display:inline-block;width:100%">
<el-switch v-model="advancedValue[key]"/> <el-switch v-model="advancedValue[key]"/>
</span> </span>
<el-select v-else-if="advancedAttr[key].type === 'array'" v-model="advancedValue[key]" style="width:100%" size="small"> <el-select v-else-if="advancedAttr[key].type === 'array'" v-model="advancedValue[key]" style="width:100%" size="small">
<el-option value="" :label="$t('schema.nothing')"></el-option> <el-option value="" :label="$t('schema.nothing')"></el-option>
<el-option :key="t" :value="t" :label="t" v-for="t in advancedAttr[key].enums"/> <el-option :key="t" :value="t" :label="t" v-for="t in advancedAttr[key].enums"/>
</el-select> </el-select>
<el-input v-else-if="advancedAttr[key].type === 'textarea'" :placeholder="advancedAttr[key].description" v-model="advancedValue[key]" <el-input v-else-if="advancedAttr[key].type === 'textarea'" :placeholder="advancedAttr[key].description" v-model="advancedValue[key]"
type="textarea" type="textarea"
:autosize="{ minRows: 2, maxRows: 10}" :autosize="{ minRows: 2, maxRows: 10}"
:rows="2"></el-input> :rows="2"></el-input>
<el-input v-model="advancedValue[key]" v-else style="width:100%;" :placeholder="key" size="small"/> <el-input v-model="advancedValue[key]" v-else style="width:100%;" :placeholder="key" size="small"/>
</el-form-item> </el-form-item>
</div> </div>
</el-form> </el-form>
<p class="tip">{{$t('schema.preview')}} </p> <p class="tip">{{ $t('schema.preview') }} </p>
<pre style="width:100%">{{completeNodeValue}}</pre> <pre style="width:100%">{{ completeNodeValue }}</pre>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<ms-dialog-footer <ms-dialog-footer
@ -83,340 +83,342 @@
</div> </div>
</template> </template>
<script> <script>
import {isNull} from './util' import {isNull} from './util'
import {TYPE_NAME, TYPE} from './type/type' import {TYPE_NAME, TYPE, TYPES} from './type/type'
import MsMock from './mock/MockComplete' import MsMock from './mock/MockComplete'
import MsDialogFooter from '../../../components/MsDialogFooter' import MsDialogFooter from '../../../components/MsDialogFooter'
import {getUUID} from "@/common/js/utils"; import {getUUID} from "@/common/js/utils";
export default { export default {
name: 'JsonSchemaEditor', name: 'JsonSchemaEditor',
components: {MsMock, MsDialogFooter}, components: {MsMock, MsDialogFooter},
props: { props: {
value: { value: {
type: Object, type: Object,
required: true required: true
},
disabled: { //namename,name
type: Boolean,
default: false
},
disabledType: { //
type: Boolean,
default: false
},
isItem: { //
type: Boolean,
default: false
},
deep: { // deep=0
type: Number,
default: 0
},
root: { //root
type: Boolean,
default: true
},
parent: { //
type: Object,
default: null
},
custom: { //enable custom properties
type: Boolean,
default: false
},
lang: { // i18n language
type: String,
default: 'zh_CN'
}
}, },
computed: { disabled: { //namename,name
pickValue() { type: Boolean,
return Object.values(this.value)[0] default: false
},
pickKey() {
return Object.keys(this.value)[0]
},
isObject() {
return this.pickValue.type === 'object'
},
isArray() {
return this.pickValue.type === 'array'
},
checked() {
return this.parent && this.parent.required && this.parent.required.indexOf(this.pickKey) >= 0
},
advanced() {
return TYPE[this.pickValue.type]
},
advancedAttr() {
return TYPE[this.pickValue.type].attr
},
advancedNotEmptyValue() {
const jsonNode = Object.assign({}, this.advancedValue);
for (let key in jsonNode) {
isNull(jsonNode[key]) && delete jsonNode[key]
}
return jsonNode
},
completeNodeValue() {
const t = {}
for (const item of this.customProps) {
t[item.key] = item.value
}
return Object.assign({}, this.pickValue, this.advancedNotEmptyValue, t)
}
}, },
data() { disabledType: { //
return { type: Boolean,
TYPE_NAME, default: false
hidden: false,
countAdd: 1,
modalVisible: false,
reloadItemOver: true,
advancedValue: {},
addProp: {},//
customProps: [],
customing: false
}
}, },
methods: { isItem: { //
onInputName(e) { type: Boolean,
const val = e.target.value default: false
const p = {}; },
for (let key in this.parent.properties) { deep: { // deep=0
if (key != this.pickKey) { type: Number,
p[key] = this.parent.properties[key] default: 0
} else { },
p[val] = this.parent.properties[key] root: { //root
delete this.parent.properties[key] type: Boolean,
} default: true
} },
this.$set(this.parent, 'properties', p) parent: { //
}, type: Object,
onChangeType() { default: null
if(this.parent && this.parent.type === 'array'){ },
this.$emit('changeAllItemsType',this.pickValue.type); custom: { //enable custom properties
}else{ type: Boolean,
this.$delete(this.pickValue, 'properties') default: false
this.$delete(this.pickValue, 'items') },
this.$delete(this.pickValue, 'required') lang: { // i18n language
this.$delete(this.pickValue, 'mock') type: String,
if (this.isArray) { default: 'zh_CN'
this.$set(this.pickValue, 'items', [{type: 'string', mock: {mock: ""}}]); }
} },
} computed: {
}, pickValue() {
changeAllItemsType(changeType){ return Object.values(this.value)[0]
if(this.isArray && this.pickValue.items && this.pickValue.items.length > 0){ },
this.pickValue.items.forEach(item => { pickKey() {
item.type = changeType; return Object.keys(this.value)[0]
this.$delete(item, 'properties') },
this.$delete(item, 'items') isObject() {
this.$delete(item, 'required') return this.pickValue.type === 'object'
this.$delete(item, 'mock') },
if (changeType === 'array') { isArray() {
this.$set(item, 'items', [{type: 'string', mock: {mock: ""}}]); return this.pickValue.type === 'array'
} },
}); checked() {
} return this.parent && this.parent.required && this.parent.required.indexOf(this.pickKey) >= 0
}, },
onCheck(e) { advanced() {
this._checked(e.target.checked, this.parent) return TYPE[this.pickValue.type]
}, },
onRootCheck(e) { types(){
const checked = e.target.checked return TYPES(this.pickKey);
this._deepCheck(checked, this.pickValue) },
}, advancedAttr() {
_deepCheck(checked, node) { return TYPE[this.pickValue.type].attr
if (node.type === 'object' && node.properties) { },
checked ? this.$set(node, 'required', Object.keys(node.properties)) : this.$delete(node, 'required') advancedNotEmptyValue() {
Object.keys(node.properties).forEach(key => this._deepCheck(checked, node.properties[key])) const jsonNode = Object.assign({}, this.advancedValue);
} else if (node.type === 'array' && node.items.type === 'object') { for (let key in jsonNode) {
checked ? this.$set(node.items, 'required', Object.keys(node.items.properties)) : this.$delete(node.items, 'required') isNull(jsonNode[key]) && delete jsonNode[key]
Object.keys(node.items.properties).forEach(key => this._deepCheck(checked, node.items.properties[key])) }
} return jsonNode
}, },
_checked(checked, parent) { completeNodeValue() {
let required = parent.required const t = {}
if (checked) { for (const item of this.customProps) {
required || this.$set(this.parent, 'required', []) t[item.key] = item.value
}
required = this.parent.required return Object.assign({}, this.pickValue, this.advancedNotEmptyValue, t)
required.indexOf(this.pickKey) === -1 && required.push(this.pickKey) }
},
data() {
return {
hidden: false,
countAdd: 1,
modalVisible: false,
reloadItemOver: true,
advancedValue: {},
addProp: {},//
customProps: [],
customing: false
}
},
methods: {
onInputName(e) {
const val = e.target.value
const p = {};
for (let key in this.parent.properties) {
if (key != this.pickKey) {
p[key] = this.parent.properties[key]
} else { } else {
p[val] = this.parent.properties[key]
delete this.parent.properties[key]
}
}
this.$set(this.parent, 'properties', p)
},
onChangeType() {
if (this.parent && this.parent.type === 'array') {
this.$emit('changeAllItemsType', this.pickValue.type);
} else {
this.$delete(this.pickValue, 'properties')
this.$delete(this.pickValue, 'items')
this.$delete(this.pickValue, 'required')
this.$delete(this.pickValue, 'mock')
if (this.isArray) {
this.$set(this.pickValue, 'items', [{type: 'string', mock: {mock: ""}}]);
}
}
},
changeAllItemsType(changeType) {
if (this.isArray && this.pickValue.items && this.pickValue.items.length > 0) {
this.pickValue.items.forEach(item => {
item.type = changeType;
this.$delete(item, 'properties')
this.$delete(item, 'items')
this.$delete(item, 'required')
this.$delete(item, 'mock')
if (changeType === 'array') {
this.$set(item, 'items', [{type: 'string', mock: {mock: ""}}]);
}
});
}
},
onCheck(e) {
this._checked(e.target.checked, this.parent)
},
onRootCheck(e) {
const checked = e.target.checked
this._deepCheck(checked, this.pickValue)
},
_deepCheck(checked, node) {
if (node.type === 'object' && node.properties) {
checked ? this.$set(node, 'required', Object.keys(node.properties)) : this.$delete(node, 'required')
Object.keys(node.properties).forEach(key => this._deepCheck(checked, node.properties[key]))
} else if (node.type === 'array' && node.items.type === 'object') {
checked ? this.$set(node.items, 'required', Object.keys(node.items.properties)) : this.$delete(node.items, 'required')
Object.keys(node.items.properties).forEach(key => this._deepCheck(checked, node.items.properties[key]))
}
},
_checked(checked, parent) {
let required = parent.required
if (checked) {
required || this.$set(this.parent, 'required', [])
required = this.parent.required
required.indexOf(this.pickKey) === -1 && required.push(this.pickKey)
} else {
const pos = required.indexOf(this.pickKey)
pos >= 0 && required.splice(pos, 1)
}
required.length === 0 && this.$delete(parent, 'required')
},
addChild() {
const node = this.pickValue;
if (this.isArray) {
let childObj = {type: 'string', mock: {mock: ""}}
if (node.items && node.items.length > 0) {
childObj.type = node.items[0].type;
node.items.push(childObj);
} else {
this.$set(this.pickValue, 'items', [childObj]);
}
} else {
const name = this._joinName()
const type = 'string'
node.properties || this.$set(node, 'properties', {})
const props = node.properties
this.$set(props, name, {type: type, mock: {mock: ""}})
}
},
addCustomNode() {
this.$set(this.addProp, 'key', this._joinName())
this.$set(this.addProp, 'value', '')
this.customing = true
},
confirmAddCustomNode() {
this.customProps.push(this.addProp)
this.addProp = {}
this.customing = false
},
removeNode() {
if (this.parent.type && this.parent.type === 'object') {
const {properties, required} = this.parent
this.$delete(properties, this.pickKey)
if (required) {
const pos = required.indexOf(this.pickKey) const pos = required.indexOf(this.pickKey)
pos >= 0 && required.splice(pos, 1) pos >= 0 && required.splice(pos, 1)
required.length === 0 && this.$delete(this.parent, 'required')
} }
required.length === 0 && this.$delete(parent, 'required') } else if (this.parent.type && this.parent.type === 'array') {
}, const {items, required} = this.parent
addChild() { this.$delete(items, this.pickKey)
const node = this.pickValue; if (required) {
if (this.isArray) { const pos = required.indexOf(this.pickKey)
let childObj = {type: 'string', mock: {mock: ""}} pos >= 0 && required.splice(pos, 1)
if(node.items && node.items.length > 0){ required.length === 0 && this.$delete(this.parent, 'required')
childObj.type = node.items[0].type;
node.items.push(childObj);
}else {
this.$set(this.pickValue, 'items', [childObj]);
}
}else {
const name = this._joinName()
const type = 'string'
node.properties || this.$set(node, 'properties', {})
const props = node.properties
this.$set(props, name, {type: type, mock: {mock: ""}})
} }
},
addCustomNode() {
this.$set(this.addProp, 'key', this._joinName())
this.$set(this.addProp, 'value', '')
this.customing = true
},
confirmAddCustomNode() {
this.customProps.push(this.addProp)
this.addProp = {}
this.customing = false
},
removeNode() {
if(this.parent.type && this.parent.type === 'object'){
const {properties, required} = this.parent
this.$delete(properties, this.pickKey)
if (required) {
const pos = required.indexOf(this.pickKey)
pos >= 0 && required.splice(pos, 1)
required.length === 0 && this.$delete(this.parent, 'required')
}
}else if(this.parent.type && this.parent.type === 'array'){
const {items, required} = this.parent
this.$delete(items, this.pickKey)
if (required) {
const pos = required.indexOf(this.pickKey)
pos >= 0 && required.splice(pos, 1)
required.length === 0 && this.$delete(this.parent, 'required')
}
}
this.parentReloadItems();
},
_joinName() {
return `feild_${this.deep}_${this.countAdd++}_${getUUID().substring(0, 5)}`
},
onSetting() {
this.modalVisible = true;
this.advancedValue = {};
this.advancedValue = this.advanced.value
for (const k in this.advancedValue) {
this.advancedValue[k] = this.pickValue[k]
}
},
handleClose() {
this.modalVisible = false;
},
handleOk() {
this.modalVisible = false
for (const key in this.advancedValue) {
if (isNull(this.advancedValue[key])) {
this.$delete(this.pickValue, key)
} else {
this.$set(this.pickValue, key, this.advancedValue[key])
}
}
for (const item of this.customProps) {
this.$set(this.pickValue, item.key, item.value)
}
},
parentReloadItems(){
this.$emit("reloadItems");
},
reloadItems(){
this.reloadItemOver = false;
this.$nextTick(() => {
this.reloadItemOver = true;
})
} }
this.parentReloadItems();
},
_joinName() {
return `feild_${this.deep}_${this.countAdd++}_${getUUID().substring(0, 5)}`
},
onSetting() {
this.modalVisible = true;
this.advancedValue = {};
this.advancedValue = this.advanced.value
for (const k in this.advancedValue) {
this.advancedValue[k] = this.pickValue[k]
}
},
handleClose() {
this.modalVisible = false;
},
handleOk() {
this.modalVisible = false
for (const key in this.advancedValue) {
if (isNull(this.advancedValue[key])) {
this.$delete(this.pickValue, key)
} else {
this.$set(this.pickValue, key, this.advancedValue[key])
}
}
for (const item of this.customProps) {
this.$set(this.pickValue, item.key, item.value)
}
},
parentReloadItems() {
this.$emit("reloadItems");
},
reloadItems() {
this.reloadItemOver = false;
this.$nextTick(() => {
this.reloadItemOver = true;
})
} }
} }
}
</script> </script>
<style scoped> <style scoped>
.json-schema-editor .row { .json-schema-editor .row {
display: flex; display: flex;
margin: 12px; margin: 12px;
} }
.json-schema-editor .row .ms-col-name { .json-schema-editor .row .ms-col-name {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.json-schema-editor .row .ms-col-name .ms-col-name-c { .json-schema-editor .row .ms-col-name .ms-col-name-c {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.json-schema-editor .row .ms-col-name .ms-col-name-required { .json-schema-editor .row .ms-col-name .ms-col-name-required {
flex: 0 0 30px; flex: 0 0 30px;
text-align: center; text-align: center;
} }
.json-schema-editor .row .ms-col-type { .json-schema-editor .row .ms-col-type {
width: 100%; width: 100%;
} }
.json-schema-editor .row .ms-col-setting { .json-schema-editor .row .ms-col-setting {
display: inline-block; display: inline-block;
} }
.json-schema-editor .row .setting-icon { .json-schema-editor .row .setting-icon {
color: rgba(0, 0, 0, 0.45); color: rgba(0, 0, 0, 0.45);
border: none; border: none;
} }
.json-schema-editor .row .plus-icon { .json-schema-editor .row .plus-icon {
border: none; border: none;
} }
.json-schema-editor .row .close-icon { .json-schema-editor .row .close-icon {
color: #888; color: #888;
border: none; border: none;
} }
.json-schema-editor-advanced-modal { .json-schema-editor-advanced-modal {
color: rgba(0, 0, 0, 0.65); color: rgba(0, 0, 0, 0.65);
min-width: 600px; min-width: 600px;
} }
.json-schema-editor-advanced-modal pre { .json-schema-editor-advanced-modal pre {
font-family: monospace; font-family: monospace;
height: 100%; height: 100%;
overflow-y: auto; overflow-y: auto;
border: 1px solid rgba(0, 0, 0, 0.1); border: 1px solid rgba(0, 0, 0, 0.1);
border-radius: 4px; border-radius: 4px;
padding: 12px; padding: 12px;
width: 50%; width: 50%;
} }
.json-schema-editor-advanced-modal h3 { .json-schema-editor-advanced-modal h3 {
display: block; display: block;
border-left: 3px solid #1890ff; border-left: 3px solid #1890ff;
padding: 0 8px; padding: 0 8px;
} }
.json-schema-editor-advanced-modal .ms-advanced-search-form { .json-schema-editor-advanced-modal .ms-advanced-search-form {
display: flex; display: flex;
} }
.json-schema-editor-advanced-modal .ms-advanced-search-form .ms-form-item .ms-form-item-control-wrapper { .json-schema-editor-advanced-modal .ms-advanced-search-form .ms-form-item .ms-form-item-control-wrapper {
flex: 1; flex: 1;
} }
.col-item-setting { .col-item-setting {
padding-top: 8px; padding-top: 8px;
cursor: pointer; cursor: pointer;
} }
.ms-transform { .ms-transform {
transform: rotate(-180deg); transform: rotate(-180deg);
transition: 0ms; transition: 0ms;
} }
</style> </style>

View File

@ -4,7 +4,9 @@ import _array from './array'
import _boolean from './boolean' import _boolean from './boolean'
import _integer from './integer' import _integer from './integer'
import _number from './number' import _number from './number'
const TYPE_NAME = ['string', 'number', 'integer','object', 'array', 'boolean'] import {LicenseKey} from "@/common/js/constants";
const TYPE_NAME = ['string', 'number', 'integer', 'object', 'array', 'boolean']
const TYPE = { const TYPE = {
'object': _object, 'object': _object,
@ -14,4 +16,11 @@ const TYPE = {
'integer': _integer, 'integer': _integer,
'number': _number 'number': _number
} }
export {TYPE ,TYPE_NAME} export {TYPE, TYPE_NAME}
export function TYPES(key) {
if (key && key === 'root') {
return ['object', 'array'];
}
return TYPE_NAME;
}