diff --git a/frontend/src/business/components/api/report/ApiReportView.vue b/frontend/src/business/components/api/report/ApiReportView.vue index 6bbe3f497f..df1037b4c1 100644 --- a/frontend/src/business/components/api/report/ApiReportView.vue +++ b/frontend/src/business/components/api/report/ApiReportView.vue @@ -10,27 +10,9 @@
- - + @@ -60,6 +42,7 @@ import MsScenarioResult from "./components/ScenarioResult"; import MsMetricChart from "./components/MetricChart"; import MsScenarioResults from "./components/ScenarioResults"; + import {Scenario} from "../test/model/ScenarioModel"; export default { name: "MsApiReportView", @@ -85,6 +68,9 @@ this.content = {}; this.fails = []; }, + handleClick(tab, event) { + this.isRequestResult = false + }, getReport() { this.init(); @@ -134,9 +120,12 @@ } }, requestResult(requestResult) { - this.isRequestResult = true; - this.request = requestResult.request; - this.scenarioName = requestResult.scenarioName; + this.isRequestResult = false; + this.$nextTick(function () { + this.isRequestResult = true; + this.request = requestResult.request; + this.scenarioName = requestResult.scenarioName; + }); } }, diff --git a/frontend/src/business/components/api/report/components/MetricChart.vue b/frontend/src/business/components/api/report/components/MetricChart.vue index 004b882583..ca1001f4c1 100644 --- a/frontend/src/business/components/api/report/components/MetricChart.vue +++ b/frontend/src/business/components/api/report/components/MetricChart.vue @@ -3,9 +3,12 @@
-
-
{{time}}
-
+ +
+
{{time}}
+
+ + diff --git a/frontend/src/business/components/api/report/components/RequestResult.vue b/frontend/src/business/components/api/report/components/RequestResult.vue index 2cd63aab03..f333a6796c 100644 --- a/frontend/src/business/components/api/report/components/RequestResult.vue +++ b/frontend/src/business/components/api/report/components/RequestResult.vue @@ -39,17 +39,18 @@ methods: { active() { this.$emit("requestResult", {request: this.request, scenarioName: this.scenarioName}); + } }, - computed: { - assertion() { - return this.request.passAssertions + " / " + this.request.totalAssertions; - }, - hasSub() { - return this.request.subRequestResults.length > 0; - } - } + /* computed: { + assertion() { + return this.request.passAssertions + " / " + this.request.totalAssertions; + }, + hasSub() { + return this.request.subRequestResults.length > 0; + } + }*/ } diff --git a/frontend/src/business/components/api/report/components/RequestResultTail.vue b/frontend/src/business/components/api/report/components/RequestResultTail.vue index fe2f1aadb2..e287448a59 100644 --- a/frontend/src/business/components/api/report/components/RequestResultTail.vue +++ b/frontend/src/business/components/api/report/components/RequestResultTail.vue @@ -94,7 +94,7 @@ data() { return { - isActive: false, + isActive: true, activeName: "sub", } }, diff --git a/frontend/src/business/components/api/report/components/RequestText.vue b/frontend/src/business/components/api/report/components/RequestText.vue index 60da170d46..5ade3d474d 100644 --- a/frontend/src/business/components/api/report/components/RequestText.vue +++ b/frontend/src/business/components/api/report/components/RequestText.vue @@ -30,7 +30,7 @@ data() { return { - isActive: false, + isActive: true, activeName: "body", } }, diff --git a/frontend/src/business/components/api/report/components/ResponseText.vue b/frontend/src/business/components/api/report/components/ResponseText.vue index 50d49ded36..6dc3c409ac 100644 --- a/frontend/src/business/components/api/report/components/ResponseText.vue +++ b/frontend/src/business/components/api/report/components/ResponseText.vue @@ -48,7 +48,7 @@ data() { return { - isActive: false, + isActive: true, activeName: "body", modes: ['text', 'json', 'xml', 'html'], mode: BODY_FORMAT.TEXT diff --git a/frontend/src/business/components/api/test/components/ApiBody.vue b/frontend/src/business/components/api/test/components/ApiBody.vue index 64dad3d17a..96fb5dcbaa 100644 --- a/frontend/src/business/components/api/test/components/ApiBody.vue +++ b/frontend/src/business/components/api/test/components/ApiBody.vue @@ -11,7 +11,7 @@ - +
@@ -21,24 +21,25 @@ diff --git a/frontend/src/business/components/api/test/components/ApiVariable.vue b/frontend/src/business/components/api/test/components/ApiVariable.vue new file mode 100644 index 0000000000..20877c661d --- /dev/null +++ b/frontend/src/business/components/api/test/components/ApiVariable.vue @@ -0,0 +1,343 @@ + + + + + diff --git a/frontend/src/business/components/api/test/components/request/ApiHttpRequestForm.vue b/frontend/src/business/components/api/test/components/request/ApiHttpRequestForm.vue index c85e6213ce..62e09b6fd7 100644 --- a/frontend/src/business/components/api/test/components/request/ApiHttpRequestForm.vue +++ b/frontend/src/business/components/api/test/components/request/ApiHttpRequestForm.vue @@ -26,9 +26,10 @@ - {{request.environment ? request.environment.name + ': ' : ''}} - {{displayUrl}} - {{$t('api_test.request.please_configure_environment_in_scenario')}} + {{ request.environment ? request.environment.name + ': ' : '' }} + {{ displayUrl }} + {{ $t('api_test.request.please_configure_environment_in_scenario') }} @@ -39,12 +40,15 @@ - {{$t('load_test.save_and_run')}} + {{ $t('load_test.save_and_run') }} + - + @@ -66,16 +70,18 @@ import MsApiKeyValue from "../ApiKeyValue"; import MsApiBody from "../ApiBody"; import MsApiAssertions from "../assertion/ApiAssertions"; -import {HttpRequest, KeyValue} from "../../model/ScenarioModel"; +import {HttpRequest, KeyValue, Scenario} from "../../model/ScenarioModel"; import MsApiExtract from "../extract/ApiExtract"; import ApiRequestMethodSelect from "../collapse/ApiRequestMethodSelect"; import {REQUEST_HEADERS} from "@/common/js/constants"; +import MsApiVariable from "@/business/components/api/test/components/ApiVariable"; export default { name: "MsApiHttpRequestForm", - components: {ApiRequestMethodSelect, MsApiExtract, MsApiAssertions, MsApiBody, MsApiKeyValue}, + components: {MsApiVariable, ApiRequestMethodSelect, MsApiExtract, MsApiAssertions, MsApiBody, MsApiKeyValue}, props: { request: HttpRequest, + scenario: Scenario, isReadOnly: { type: Boolean, default: false @@ -91,109 +97,109 @@ export default { } }; return { - activeName: "parameters", - rules: { - name: [ - {max: 300, message: this.$t('commons.input_limit', [1, 300]), trigger: 'blur'} - ], - url: [ - {max: 500, required: true, message: this.$t('commons.input_limit', [1, 500]), trigger: 'blur'}, - {validator: validateURL, trigger: 'blur'} - ], - path: [ - {max: 500, message: this.$t('commons.input_limit', [0, 500]), trigger: 'blur'}, - ] - }, - headerSuggestions: REQUEST_HEADERS + activeName: "parameters", + rules: { + name: [ + {max: 300, message: this.$t('commons.input_limit', [1, 300]), trigger: 'blur'} + ], + url: [ + {max: 500, required: true, message: this.$t('commons.input_limit', [1, 500]), trigger: 'blur'}, + {validator: validateURL, trigger: 'blur'} + ], + path: [ + {max: 500, message: this.$t('commons.input_limit', [0, 500]), trigger: 'blur'}, + ] + }, + headerSuggestions: REQUEST_HEADERS + } + }, + + methods: { + urlChange() { + if (!this.request.url) return; + let url = this.getURL(this.addProtocol(this.request.url)); + if (url) { + this.request.url = decodeURIComponent(url.origin + url.pathname); } }, - - methods: { - urlChange() { - if (!this.request.url) return; - let url = this.getURL(this.addProtocol(this.request.url)); - if (url) { - this.request.url = decodeURIComponent(url.origin + url.pathname); - } - }, - pathChange() { - if (!this.request.path) return; - let url = this.getURL(this.displayUrl); - let urlStr = url.origin + url.pathname; - let envUrl = this.request.environment.protocol + '://' + this.request.environment.socket; - this.request.path = decodeURIComponent(urlStr.substring(envUrl.length, urlStr.length)); - }, - getURL(urlStr) { - try { - let url = new URL(urlStr); - url.searchParams.forEach((value, key) => { - if (key && value) { - this.request.parameters.splice(0, 0, new KeyValue(key, value)); - } - }); - return url; - } catch (e) { - this.$error(this.$t('api_test.request.url_invalid'), 2000); - } - }, - methodChange(value) { - if (value === 'GET' && this.activeName === 'body') { - this.activeName = 'parameters'; - } - }, - useEnvironmentChange(value) { - if (value && !this.request.environment) { - this.$error(this.$t('api_test.request.please_add_environment_to_scenario'), 2000); - this.request.useEnvironment = false; - } - this.$refs["request"].clearValidate(); - }, - addProtocol(url) { - if (url) { - if (!url.toLowerCase().startsWith("https") && !url.toLowerCase().startsWith("http")) { - return "https://" + url; + pathChange() { + if (!this.request.path) return; + let url = this.getURL(this.displayUrl); + let urlStr = url.origin + url.pathname; + let envUrl = this.request.environment.protocol + '://' + this.request.environment.socket; + this.request.path = decodeURIComponent(urlStr.substring(envUrl.length, urlStr.length)); + }, + getURL(urlStr) { + try { + let url = new URL(urlStr); + url.searchParams.forEach((value, key) => { + if (key && value) { + this.request.parameters.splice(0, 0, new KeyValue(key, value)); } - } + }); return url; - }, - runDebug() { - this.$emit('runDebug'); + } catch (e) { + this.$error(this.$t('api_test.request.url_invalid'), 2000); } }, - - computed: { - isNotGet() { - return this.request.method !== "GET"; - }, - displayUrl() { - return this.request.environment ? this.request.environment.protocol + '://' + this.request.environment.socket + (this.request.path ? this.request.path : '') : ''; + methodChange(value) { + if (value === 'GET' && this.activeName === 'body') { + this.activeName = 'parameters'; } + }, + useEnvironmentChange(value) { + if (value && !this.request.environment) { + this.$error(this.$t('api_test.request.please_add_environment_to_scenario'), 2000); + this.request.useEnvironment = false; + } + this.$refs["request"].clearValidate(); + }, + addProtocol(url) { + if (url) { + if (!url.toLowerCase().startsWith("https") && !url.toLowerCase().startsWith("http")) { + return "https://" + url; + } + } + return url; + }, + runDebug() { + this.$emit('runDebug'); + } + }, + + computed: { + isNotGet() { + return this.request.method !== "GET"; + }, + displayUrl() { + return this.request.environment ? this.request.environment.protocol + '://' + this.request.environment.socket + (this.request.path ? this.request.path : '') : ''; } } +} diff --git a/frontend/src/business/components/api/test/components/request/ApiRequestForm.vue b/frontend/src/business/components/api/test/components/request/ApiRequestForm.vue index 0455d26f69..0172dac219 100644 --- a/frontend/src/business/components/api/test/components/request/ApiRequestForm.vue +++ b/frontend/src/business/components/api/test/components/request/ApiRequestForm.vue @@ -1,27 +1,28 @@