From 8b508694900171cf52e4c956abcd5bb83fe6f9c6 Mon Sep 17 00:00:00 2001
From: fit2-zhao <yong.zhao@fit2cloud.com>
Date: Thu, 16 Sep 2021 18:11:46 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E5=9C=BA=E6=99=AF=E8=87=AA=E5=8A=A8?=
 =?UTF-8?q?=E5=8C=96)=20=E5=A2=9E=E5=8A=A0=E6=95=B0=E7=BB=84=E6=95=B0?=
 =?UTF-8?q?=E6=8D=AE=E5=A4=84=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../request/sampler/MsHTTPSamplerProxy.java   |  79 +--
 .../api/dto/scenario/HttpConfig.java          |  34 +-
 backend/src/main/java/io/metersphere/xpack    |   2 +-
 .../request/http/ApiHttpRequestForm.vue       | 483 +++++++++---------
 4 files changed, 313 insertions(+), 285 deletions(-)

diff --git a/backend/src/main/java/io/metersphere/api/dto/definition/request/sampler/MsHTTPSamplerProxy.java b/backend/src/main/java/io/metersphere/api/dto/definition/request/sampler/MsHTTPSamplerProxy.java
index 64b03f08a4..3a80c1ea8b 100644
--- a/backend/src/main/java/io/metersphere/api/dto/definition/request/sampler/MsHTTPSamplerProxy.java
+++ b/backend/src/main/java/io/metersphere/api/dto/definition/request/sampler/MsHTTPSamplerProxy.java
@@ -126,7 +126,7 @@ public class MsHTTPSamplerProxy extends MsTestElement {
 
     @JSONField(ordinal = 38)
     private String alias;
-  
+
     @JSONField(ordinal = 39)
     private boolean customizeReq;
 
@@ -274,27 +274,8 @@ public class MsHTTPSamplerProxy extends MsTestElement {
         addCertificate(config, httpSamplerTree);
 
         //增加全局前后至脚本
-        MsJSR223PreProcessor preProcessor = httpConfig.getPreProcessor();
-        MsJSR223PostProcessor postProcessor = httpConfig.getPostProcessor();
-        if(preProcessor != null){
-            if (preProcessor.getEnvironmentId() == null) {
-                if (this.getEnvironmentId() == null) {
-                    preProcessor.setEnvironmentId(useEnvironment);
-                } else {
-                    preProcessor.setEnvironmentId(this.getEnvironmentId());
-                }
-            }
-            preProcessor.toHashTree(httpSamplerTree, preProcessor.getHashTree(), config);
-        }
-        if(postProcessor != null){
-            if (postProcessor.getEnvironmentId() == null) {
-                if (this.getEnvironmentId() == null) {
-                    postProcessor.setEnvironmentId(useEnvironment);
-                } else {
-                    postProcessor.setEnvironmentId(this.getEnvironmentId());
-                }
-            }
-            postProcessor.toHashTree(httpSamplerTree, postProcessor.getHashTree(), config);
+        if (httpConfig != null) {
+            this.setScript(httpConfig, httpSamplerTree, config);
         }
         if (CollectionUtils.isNotEmpty(hashTree)) {
             for (MsTestElement el : hashTree) {
@@ -311,21 +292,46 @@ public class MsHTTPSamplerProxy extends MsTestElement {
 
     }
 
+    private void setScript(HttpConfig httpConfig, HashTree httpSamplerTree, ParameterConfig config) {
+        MsJSR223PreProcessor preProcessor = httpConfig.getPreProcessor();
+        MsJSR223PostProcessor postProcessor = httpConfig.getPostProcessor();
+        if (preProcessor != null) {
+            if (preProcessor.getEnvironmentId() == null) {
+                if (this.getEnvironmentId() == null) {
+                    preProcessor.setEnvironmentId(useEnvironment);
+                } else {
+                    preProcessor.setEnvironmentId(this.getEnvironmentId());
+                }
+            }
+            preProcessor.toHashTree(httpSamplerTree, preProcessor.getHashTree(), config);
+        }
+        if (postProcessor != null) {
+            if (postProcessor.getEnvironmentId() == null) {
+                if (this.getEnvironmentId() == null) {
+                    postProcessor.setEnvironmentId(useEnvironment);
+                } else {
+                    postProcessor.setEnvironmentId(this.getEnvironmentId());
+                }
+            }
+            postProcessor.toHashTree(httpSamplerTree, postProcessor.getHashTree(), config);
+        }
+    }
+
     private void initConnectAndResponseTimeout(ParameterConfig config) {
         if (config.isEffective(this.getProjectId())) {
             String useEvnId = config.getConfig().get(this.getProjectId()).getApiEnvironmentid();
             if (StringUtils.isNotEmpty(useEvnId) && !StringUtils.equals(useEvnId, this.getEnvironmentId())) {
                 this.setEnvironmentId(useEvnId);
             }
-            CommonConfig commonConfig  = config.getConfig().get(this.getProjectId()).getCommonConfig();
-            if(commonConfig != null){
-                if(this.getConnectTimeout() == null || StringUtils.equals(this.getConnectTimeout(),"60000")){
-                    if(commonConfig.getRequestTimeout() != 0){
+            CommonConfig commonConfig = config.getConfig().get(this.getProjectId()).getCommonConfig();
+            if (commonConfig != null) {
+                if (this.getConnectTimeout() == null || StringUtils.equals(this.getConnectTimeout(), "60000")) {
+                    if (commonConfig.getRequestTimeout() != 0) {
                         this.setConnectTimeout(String.valueOf(commonConfig.getRequestTimeout()));
                     }
                 }
-                if(this.getResponseTimeout() == null || StringUtils.equals(this.getResponseTimeout(),"60000")){
-                    if(commonConfig.getResponseTimeout() != 0){
+                if (this.getResponseTimeout() == null || StringUtils.equals(this.getResponseTimeout(), "60000")) {
+                    if (commonConfig.getResponseTimeout() != 0) {
                         this.setResponseTimeout(String.valueOf(commonConfig.getResponseTimeout()));
                     }
                 }
@@ -340,15 +346,16 @@ public class MsHTTPSamplerProxy extends MsTestElement {
     private HttpConfig getHttpConfig(ParameterConfig config) {
         if (config.isEffective(this.getProjectId())) {
             EnvironmentConfig environmentConfig = config.getConfig().get(this.getProjectId());
-            if (environmentConfig != null){
+            if (environmentConfig != null) {
                 String useEvnId = environmentConfig.getApiEnvironmentid();
-                if(this.authManager == null && environmentConfig.getAuthManager() != null && environmentConfig.getAuthManager().containsKey("hashTree") ){
+                if (this.authManager == null && environmentConfig.getAuthManager() != null && environmentConfig.getAuthManager().containsKey("hashTree")) {
                     try {
                         JSONArray jsonArray = environmentConfig.getAuthManager().getJSONArray("hashTree");
-                        if(jsonArray.size() > 0){
+                        if (jsonArray.size() > 0) {
                             this.authManager = jsonArray.getJSONObject(0).toJavaObject(MsAuthManager.class);
                         }
-                    }catch (Exception e){}
+                    } catch (Exception e) {
+                    }
                 }
                 if (StringUtils.isNotEmpty(useEvnId) && !StringUtils.equals(useEvnId, this.getEnvironmentId())) {
                     this.setEnvironmentId(useEvnId);
@@ -702,18 +709,18 @@ public class MsHTTPSamplerProxy extends MsTestElement {
         for (KeyValue keyValue : keyValues) {
             boolean hasHead = false;
             //检查是否已经有重名的Head。如果Header重复会导致执行报错
-            if(headerManager.getHeaders() != null){
-                for(int i = 0; i < headerManager.getHeaders().size(); i ++){
+            if (headerManager.getHeaders() != null) {
+                for (int i = 0; i < headerManager.getHeaders().size(); i++) {
                     Header header = headerManager.getHeader(i);
                     String headName = header.getName();
-                    if(StringUtils.equals(headName,keyValue.getName())){
+                    if (StringUtils.equals(headName, keyValue.getName())) {
                         hasHead = true;
                         break;
                     }
                 }
             }
 
-            if(!hasHead){
+            if (!hasHead) {
                 headerManager.add(new Header(keyValue.getName(), ScriptEngineUtils.buildFunctionCallString(keyValue.getValue())));
             }
         }
diff --git a/backend/src/main/java/io/metersphere/api/dto/scenario/HttpConfig.java b/backend/src/main/java/io/metersphere/api/dto/scenario/HttpConfig.java
index dc1dd68fe6..dacc65af7b 100644
--- a/backend/src/main/java/io/metersphere/api/dto/scenario/HttpConfig.java
+++ b/backend/src/main/java/io/metersphere/api/dto/scenario/HttpConfig.java
@@ -63,19 +63,29 @@ public class HttpConfig {
         }
     }
 
-    public HttpConfig getModuleCondition(String moduleId, HttpConfigCondition configCondition) {
-        List<String> moduleIds = new ArrayList<>();
-        if (CollectionUtils.isNotEmpty(configCondition.getDetails())) {
-            if (CollectionUtils.isEmpty(configCondition.getModuleIds())) {
-                for (KeyValue keyValue : configCondition.getDetails()) {
-                    getAllChild(keyValue.getValue(), moduleIds);
-                }
-                configCondition.setModuleIds(moduleIds);
-            } else {
-                moduleIds = configCondition.getModuleIds();
-            }
+//    public HttpConfig getModuleCondition(String moduleId, HttpConfigCondition configCondition) {
+//        List<String> moduleIds = new ArrayList<>();
+//        if (CollectionUtils.isNotEmpty(configCondition.getDetails())) {
+//            if (CollectionUtils.isEmpty(configCondition.getModuleIds())) {
+//                for (KeyValue keyValue : configCondition.getDetails()) {
+//                    getAllChild(keyValue.getValue(), moduleIds);
+//                }
+//                configCondition.setModuleIds(moduleIds);
+//            } else {
+//                moduleIds = configCondition.getModuleIds();
+//            }
+//
+//            if (moduleIds.contains(moduleId)) {
+//                return initHttpConfig(configCondition);
+//            }
+//        }
+//        return null;
+//    }
 
-            if (moduleIds.contains(moduleId)) {
+    public HttpConfig getModuleCondition(String moduleId, HttpConfigCondition configCondition) {
+        if (CollectionUtils.isNotEmpty(configCondition.getDetails())) {
+            List<KeyValue> details = configCondition.getDetails().stream().filter(detail -> StringUtils.contains(detail.getValue(), moduleId)).collect(Collectors.toList());
+            if (CollectionUtils.isNotEmpty(details)) {
                 return initHttpConfig(configCondition);
             }
         }
diff --git a/backend/src/main/java/io/metersphere/xpack b/backend/src/main/java/io/metersphere/xpack
index 6e2b1d3d7d..a6a66f87a5 160000
--- a/backend/src/main/java/io/metersphere/xpack
+++ b/backend/src/main/java/io/metersphere/xpack
@@ -1 +1 @@
-Subproject commit 6e2b1d3d7d79f985e6edf81eb593670b8da87465
+Subproject commit a6a66f87a57346cdd7da22086bac5e82a7e47bdb
diff --git a/frontend/src/business/components/api/definition/components/request/http/ApiHttpRequestForm.vue b/frontend/src/business/components/api/definition/components/request/http/ApiHttpRequestForm.vue
index cea1f3a56b..41fc1d6928 100644
--- a/frontend/src/business/components/api/definition/components/request/http/ApiHttpRequestForm.vue
+++ b/frontend/src/business/components/api/definition/components/request/http/ApiHttpRequestForm.vue
@@ -69,7 +69,7 @@
             </el-tab-pane>
             <el-tab-pane name="create" v-if="hasPermission('PROJECT_API_DEFINITION:READ+CREATE_API') && hasLicense() && definitionTest">
               <template v-slot:label>
-                <el-button size="mini" type="primary" @click.stop @click="generate">{{$t('commons.generate_test_data')}}</el-button>
+                <el-button size="mini" type="primary" @click.stop @click="generate">{{ $t('commons.generate_test_data') }}</el-button>
               </template>
             </el-tab-pane>
           </el-tabs>
@@ -83,246 +83,257 @@
 </template>
 
 <script>
-  import MsApiKeyValue from "../../ApiKeyValue";
-  import MsApiBody from "../../body/ApiBody";
-  import MsApiAuthConfig from "../../auth/ApiAuthConfig";
-  import ApiRequestMethodSelect from "../../collapse/ApiRequestMethodSelect";
-  import {REQUEST_HEADERS} from "@/common/js/constants";
-  import MsApiVariable from "../../ApiVariable";
-  import MsApiAssertions from "../../assertion/ApiAssertions";
-  import MsApiExtract from "../../extract/ApiExtract";
-  import {Body, KeyValue} from "../../../model/ApiTestModel";
-  import {hasLicense, getUUID} from "@/common/js/utils";
-  import BatchAddParameter from "../../basis/BatchAddParameter";
-  import MsApiAdvancedConfig from "./ApiAdvancedConfig";
-  import MsJsr233Processor from "../../../../automation/scenario/component/Jsr233Processor";
-  import ApiDefinitionStepButton from "../components/ApiDefinitionStepButton";
-  import {hasPermission} from '@/common/js/utils';
-  import Convert from "@/business/components/common/json-schema/convert/convert";
-  export default {
-    name: "MsApiHttpRequestForm",
-    components: {
-      ApiDefinitionStepButton,
-      MsJsr233Processor,
-      MsApiAdvancedConfig,
-      BatchAddParameter,
-      MsApiVariable,
-      ApiRequestMethodSelect,
-      MsApiExtract,
-      MsApiAuthConfig,
-      MsApiBody,
-      MsApiKeyValue,
-      MsApiAssertions
-    },
-    props: {
-      method: String,
-      request: {},
-      response: {},
-      definitionTest:{
-        type:Boolean,
-        default() {
-          return false;
-        }
-      },
-      showScript: {
-        type: Boolean,
-        default: true,
-      },
-      headers: {
-        type: Array,
-        default() {
-          return [];
-        }
-      },
-      referenced: {
-        type: Boolean,
-        default: false,
-      },
-      isShowEnable: Boolean,
-      jsonPathList: Array,
-      isReadOnly: {
-        type: Boolean,
-        default: false
-      },
-      type: String,
-    },
-    data() {
-      let validateURL = (rule, value, callback) => {
-        try {
-          new URL(this.addProtocol(this.request.url));
-        } catch (e) {
-          callback(this.$t('api_test.request.url_invalid'));
-        }
-      };
-      return {
-        activeName: this.request.method === "POST" ? "body" : "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'},
-          ]
-        },
-        spanCount: 21,
-        headerSuggestions: REQUEST_HEADERS,
-        isReloadData: false,
-        isBodyShow: true,
-        dialogVisible: false
-      }
-    },
-    created() {
-      if (!this.referenced && this.showScript) {
-        this.spanCount = 21;
-      } else {
-        this.spanCount = 24;
-      }
-      this.init();
-    },
-    methods: {
-      hasPermission,
-      hasLicense,
-      generate() {
-        if (this.request.body && (this.request.body.jsonSchema || this.request.body.raw)) {
-          if (!this.request.body.jsonSchema) {
-            const MsConvert = new Convert();
-            this.request.body.jsonSchema = MsConvert.format(JSON.parse(this.request.body.raw));
-          }
-          this.$post('/api/test/data/generator', this.request.body.jsonSchema, response => {
-            if (response.data) {
-              if (this.request.body.format !== 'JSON-SCHEMA') {
-                this.request.body.raw = response.data;
-              } else {
-                const MsConvert = new Convert();
-                this.request.body.jsonSchema = MsConvert.format(JSON.parse(response.data));
-              }
-              this.reloadBody();
-            }
-          });
-        }
-      },
-      remove(row) {
-        let index = this.request.hashTree.indexOf(row);
-        this.request.hashTree.splice(index, 1);
-        this.reload();
-      },
-      copyRow(row) {
-        let obj = JSON.parse(JSON.stringify(row));
-        obj.id = getUUID();
-        this.request.hashTree.push(obj);
-        this.reload();
-      },
-      reload() {
-        this.isReloadData = true
-        this.$nextTick(() => {
-          this.isReloadData = false
-        })
-      },
-      init() {
-        if (!this.request.body) {
-          this.request.body = new Body();
-        }
-        if (!this.request.body.kvs) {
-          this.request.body.kvs = [];
-        }
-        if (!this.request.rest) {
-          this.request.rest = [];
-        }
-        if (!this.request.arguments) {
-          this.request.arguments = [];
-        }
-      },
-      // 解决修改请求头后 body 显示错位
-      reloadBody() {
-        this.isBodyShow = false;
-        this.$nextTick(() => {
-          this.isBodyShow = true;
-        });
-      },
-      batchAdd() {
-        this.$refs.batchAddParameter.open();
-      },
-      format(array, obj) {
-        if (array) {
-          let isAdd = true;
-          for (let i in array) {
-            let item = array[i];
-            if (item.name === obj.name) {
-              item.value = obj.value;
-              isAdd = false;
-            }
-          }
-          if (isAdd) {
-            this.request.arguments.unshift(obj);
-          }
-        }
-      },
-      batchSave(data) {
-        if (data) {
-          let params = data.split("\n");
-          let keyValues = [];
-          params.forEach(item => {
-            let line = item.split(/：|:/);
-            let required = false;
-            keyValues.unshift(new KeyValue({
-              name: line[0],
-              required: required,
-              value: line[1],
-              description: line[2],
-              type: "text",
-              valid: false,
-              file: false,
-              encode: true,
-              enable: true,
-              contentType: "text/plain"
-            }));
-          })
+import MsApiKeyValue from "../../ApiKeyValue";
+import MsApiBody from "../../body/ApiBody";
+import MsApiAuthConfig from "../../auth/ApiAuthConfig";
+import ApiRequestMethodSelect from "../../collapse/ApiRequestMethodSelect";
+import {REQUEST_HEADERS} from "@/common/js/constants";
+import MsApiVariable from "../../ApiVariable";
+import MsApiAssertions from "../../assertion/ApiAssertions";
+import MsApiExtract from "../../extract/ApiExtract";
+import {Body, KeyValue} from "../../../model/ApiTestModel";
+import {hasLicense, getUUID} from "@/common/js/utils";
+import BatchAddParameter from "../../basis/BatchAddParameter";
+import MsApiAdvancedConfig from "./ApiAdvancedConfig";
+import MsJsr233Processor from "../../../../automation/scenario/component/Jsr233Processor";
+import ApiDefinitionStepButton from "../components/ApiDefinitionStepButton";
+import {hasPermission} from '@/common/js/utils';
+import Convert from "@/business/components/common/json-schema/convert/convert";
 
-          keyValues.forEach(item => {
-            switch (this.activeName) {
-              case "parameters":
-                this.format(this.request.arguments,item);
-                break;
-              case "rest":
-                this.format(this.request.rest,item);
-                break;
-              case "headers":
-                this.format(this.request.headers,item);
-                break;
-              default:
-                break;
-            }
-          })
-        }
+export default {
+  name: "MsApiHttpRequestForm",
+  components: {
+    ApiDefinitionStepButton,
+    MsJsr233Processor,
+    MsApiAdvancedConfig,
+    BatchAddParameter,
+    MsApiVariable,
+    ApiRequestMethodSelect,
+    MsApiExtract,
+    MsApiAuthConfig,
+    MsApiBody,
+    MsApiKeyValue,
+    MsApiAssertions
+  },
+  props: {
+    method: String,
+    request: {},
+    response: {},
+    definitionTest: {
+      type: Boolean,
+      default() {
+        return false;
       }
-
+    },
+    showScript: {
+      type: Boolean,
+      default: true,
+    },
+    headers: {
+      type: Array,
+      default() {
+        return [];
+      }
+    },
+    referenced: {
+      type: Boolean,
+      default: false,
+    },
+    isShowEnable: Boolean,
+    jsonPathList: Array,
+    isReadOnly: {
+      type: Boolean,
+      default: false
+    },
+    type: String,
+  },
+  data() {
+    let validateURL = (rule, value, callback) => {
+      try {
+        new URL(this.addProtocol(this.request.url));
+      } catch (e) {
+        callback(this.$t('api_test.request.url_invalid'));
+      }
+    };
+    return {
+      activeName: this.request.method === "POST" ? "body" : "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'},
+        ]
+      },
+      spanCount: 21,
+      headerSuggestions: REQUEST_HEADERS,
+      isReloadData: false,
+      isBodyShow: true,
+      dialogVisible: false
     }
+  },
+  created() {
+    if (!this.referenced && this.showScript) {
+      this.spanCount = 21;
+    } else {
+      this.spanCount = 24;
+    }
+    this.init();
+  },
+  methods: {
+    hasPermission,
+    hasLicense,
+    generate() {
+      if (this.request.body && (this.request.body.jsonSchema || this.request.body.raw)) {
+        if (!this.request.body.jsonSchema) {
+          const MsConvert = new Convert();
+          this.request.body.jsonSchema = MsConvert.format(JSON.parse(this.request.body.raw));
+        }
+        this.$post('/api/test/data/generator', this.request.body.jsonSchema, response => {
+          if (response.data) {
+            if (this.request.body.format !== 'JSON-SCHEMA') {
+              this.request.body.raw = response.data;
+            } else {
+              const MsConvert = new Convert();
+              this.request.body.jsonSchema = MsConvert.format(JSON.parse(response.data));
+            }
+            this.reloadBody();
+          }
+        });
+      }
+    },
+    remove(row) {
+      let index = this.request.hashTree.indexOf(row);
+      this.request.hashTree.splice(index, 1);
+      this.reload();
+    }
+    ,
+    copyRow(row) {
+      let obj = JSON.parse(JSON.stringify(row));
+      obj.id = getUUID();
+      this.request.hashTree.push(obj);
+      this.reload();
+    }
+    ,
+    reload() {
+      this.isReloadData = true
+      this.$nextTick(() => {
+        this.isReloadData = false
+      })
+    }
+    ,
+    init() {
+      if (!this.request.body) {
+        this.request.body = new Body();
+      }
+      if (!this.request.body.kvs) {
+        this.request.body.kvs = [];
+      }
+      if (!this.request.rest) {
+        this.request.rest = [];
+      }
+      if (!this.request.arguments) {
+        this.request.arguments = [];
+      }
+    }
+    ,
+// 解决修改请求头后 body 显示错位
+    reloadBody() {
+      this.isBodyShow = false;
+      this.$nextTick(() => {
+        this.isBodyShow = true;
+      });
+    }
+    ,
+    batchAdd() {
+      this.$refs.batchAddParameter.open();
+    }
+    ,
+    format(array, obj) {
+      if (array) {
+        let isAdd = true;
+        for (let i in array) {
+          let item = array[i];
+          if (item.name === obj.name) {
+            item.value = obj.value;
+            isAdd = false;
+          }
+        }
+        if (isAdd) {
+          this.request.arguments.unshift(obj);
+        }
+      }
+    }
+    ,
+    batchSave(data) {
+      if (data) {
+        let params = data.split("\n");
+        let keyValues = [];
+        params.forEach(item => {
+          let line = item.split(/：|:/);
+          let required = false;
+          keyValues.unshift(new KeyValue({
+            name: line[0],
+            required: required,
+            value: line[1],
+            description: line[2],
+            type: "text",
+            valid: false,
+            file: false,
+            encode: true,
+            enable: true,
+            contentType: "text/plain"
+          }));
+        })
+
+        keyValues.forEach(item => {
+          switch (this.activeName) {
+            case "parameters":
+              this.format(this.request.arguments, item);
+              break;
+            case "rest":
+              this.format(this.request.rest, item);
+              break;
+            case "headers":
+              this.format(this.request.headers, item);
+              break;
+            default:
+              break;
+          }
+        })
+      }
+    }
+
   }
+}
 </script>
 
 <style scoped>
-  .ms-query {
-    background: #783887;
-    color: white;
-    height: 18px;
-    border-radius: 42%;
-  }
-  .ms-header {
-    background: #783887;
-    color: white;
-    height: 18px;
-    border-radius: 42%;
-  }
-  .request-tabs {
-    margin: 20px;
-    min-height: 200px;
-  }
-  .ms-el-link {
-    float: right;
-    margin-right: 45px;
-  }
+.ms-query {
+  background: #783887;
+  color: white;
+  height: 18px;
+  border-radius: 42%;
+}
+
+.ms-header {
+  background: #783887;
+  color: white;
+  height: 18px;
+  border-radius: 42%;
+}
+
+.request-tabs {
+  margin: 20px;
+  min-height: 200px;
+}
+
+.ms-el-link {
+  float: right;
+  margin-right: 45px;
+}
 </style>