diff --git a/src/main/resources/static/plugins/apitestmanager/app.bundle.js b/src/main/resources/static/plugins/apitestmanager/app.bundle.js index d7be61a..7cb1a00 100644 --- a/src/main/resources/static/plugins/apitestmanager/app.bundle.js +++ b/src/main/resources/static/plugins/apitestmanager/app.bundle.js @@ -543,7 +543,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var monaco_editor__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! monaco-editor */ \"include-loader!./node_modules/monaco-editor/esm/vs/editor/editor.main.js\");\n/* harmony import */ var _APIClient__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./APIClient */ \"./src/APIClient.js\");\n/* harmony import */ var _popperjs_core_lib_popper_lite__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @popperjs/core/lib/popper-lite */ \"./node_modules/@popperjs/core/lib/popper-lite.js\");\n/* harmony import */ var _components_VariableSnippet__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./components/VariableSnippet */ \"./src/components/VariableSnippet.js\");\n/* harmony import */ var _components_HTTPClientView__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./components/HTTPClientView */ \"./src/components/HTTPClientView.js\");\n/* harmony import */ var _components_TCPClientView__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./components/TCPClientView */ \"./src/components/TCPClientView.js\");\n/* harmony import */ var _components_ServerManager__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./components/ServerManager */ \"./src/components/ServerManager.js\");\nfunction ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }\nfunction _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }\nfunction _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\nfunction _typeof(o) { \"@babel/helpers - typeof\"; return _typeof = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && \"function\" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? \"symbol\" : typeof o; }, _typeof(o); }\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }\nfunction _iterableToArrayLimit(r, l) { var t = null == r ? null : \"undefined\" != typeof Symbol && r[Symbol.iterator] || r[\"@@iterator\"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t[\"return\"] && (u = t[\"return\"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\nfunction _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError(\"Cannot call a class as a function\"); } }\nfunction _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if (\"value\" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }\nfunction _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, \"prototype\", { writable: false }); return Constructor; }\nfunction _toPropertyKey(t) { var i = _toPrimitive(t, \"string\"); return \"symbol\" == _typeof(i) ? i : String(i); }\nfunction _toPrimitive(t, r) { if (\"object\" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || \"default\"); if (\"object\" != _typeof(i)) return i; throw new TypeError(\"@@toPrimitive must return a primitive value.\"); } return (\"string\" === r ? String : Number)(t); }\n\n\n\n\n\n\n\nvar APITester = /*#__PURE__*/function () {\n function APITester(contextPath) {\n _classCallCheck(this, APITester);\n this.servers = [];\n this.apiTabTitleTarget = '#apiRequestTabTitle';\n this.apiTabContentTarget = '#apiRequestTabContent';\n this.collectionTarget = '#side_menubar';\n this.currentIndex = 0;\n this.apiRequests = []; //탭 열린 API\n this.collections = []; //API 컬렉션\n this.requestEditors = []; //API request body editor\n this.responseEditors = []; //API response body editor\n this.consoleEditors = []; //API console editor\n this.preRequestEditors = [];\n this.postRequestEditors = [];\n this.apiClient = new _APIClient__WEBPACK_IMPORTED_MODULE_1__[\"default\"]();\n this.popperContent = document.getElementById('popperContent');\n this.popperInstance = null;\n this.contextPath = contextPath || '/';\n }\n _createClass(APITester, [{\n key: \"getCollectionListURL\",\n value: function getCollectionListURL() {\n return this.contextPath + 'mgmt/collections/list.do';\n }\n }, {\n key: \"getCollectionCreateURL\",\n value: function getCollectionCreateURL() {\n return this.contextPath + 'mgmt/collections/create.do';\n }\n }, {\n key: \"getCollectionUpdateURL\",\n value: function getCollectionUpdateURL() {\n return this.contextPath + 'mgmt/collections/update.do';\n }\n }, {\n key: \"getCollectionDeleteURL\",\n value: function getCollectionDeleteURL() {\n return this.contextPath + 'mgmt/collections/delete.do';\n }\n }, {\n key: \"getAPISaveURL\",\n value: function getAPISaveURL(collectionId) {\n return this.contextPath + \"mgmt/collections/\".concat(collectionId, \"/apis/save.do\");\n }\n }, {\n key: \"getAPIDeleteURL\",\n value: function getAPIDeleteURL(collectionId) {\n return this.contextPath + \"mgmt/collections/\".concat(collectionId, \"/apis/delete.do\");\n }\n }, {\n key: \"headerTemplate\",\n value: function headerTemplate(header, index) {\n return \"\\n \\n \\n
\\n \\n
\\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \");\n }\n }, {\n key: \"responseHeaderTemplate\",\n value: function responseHeaderTemplate(key, value) {\n return \"\\n \\n \\n \\n \\n \\n \\n \\n \\n \");\n }\n }, {\n key: \"collectionTemplate\",\n value: function collectionTemplate(collection, index) {\n var _this = this;\n return \"\\n
  • \\n
    \\n \\n
    \\n \\n \\n
    \\n
    \\n
    \\n \\n
    \\n
    • \\n \");\n }\n }, {\n key: \"collectionApiTemplate\",\n value: function collectionApiTemplate(api, apiIndex, collectionId) {\n return \"\\n
  • \\n \").concat(api.name, \"\\n
    \\n \\n \\n
    \\n
    • \\n \");\n }\n }, {\n key: \"init\",\n value: function init(servers) {\n if (servers) {\n this.servers = servers;\n if (this.servers.length === 0) {\n $('.toast-body').text('서버관리에서 서버를 등록해주세요.');\n $('.toast').toast('show');\n }\n }\n this.serverManager = new _components_ServerManager__WEBPACK_IMPORTED_MODULE_5__[\"default\"](this.servers);\n this.bindEvents();\n this.loadCollections();\n }\n }, {\n key: \"bindEvents\",\n value: function bindEvents() {\n var events = [{\n selector: '.btn_add_header',\n action: this.addHeader.bind(this)\n }, {\n selector: '.btn_remove_header',\n action: this.removeHeader.bind(this)\n }, {\n selector: '.send',\n action: this.handleSendAPIRequest.bind(this)\n }, {\n selector: '.save',\n action: this.saveAPIRequest.bind(this)\n }, {\n selector: '.save_collection',\n action: this.addCollection.bind(this)\n }, {\n selector: '#cancel-ajax',\n action: this.cancelAjaxRequest.bind(this)\n }, {\n selector: '#new_collection',\n action: this.showNewCollectionModal.bind(this)\n }, {\n selector: '#new_request',\n action: this.showNewApiRequestModal.bind(this)\n }, {\n selector: '.edit_collection',\n action: this.showCollectionEditModal.bind(this)\n }, {\n selector: '.delete_collection',\n action: this.showCollectionDeleteModal.bind(this)\n }, {\n selector: '.confirm_delete',\n action: this.removeCollection.bind(this)\n }, {\n selector: '.add_new_request',\n action: this.addAPIRequest.bind(this)\n }, {\n selector: '.edit_api_request',\n action: this.showEditNameModal.bind(this)\n }, {\n selector: '.delete_api_request',\n action: this.showDeleteApiRequestModal.bind(this)\n }, {\n selector: '.open_api_request',\n action: this.openApiRequest.bind(this)\n }, {\n selector: '.confirm_delete_api',\n action: this.deleteApiRequest.bind(this)\n }, {\n selector: '.close_tab',\n action: this.closeTab.bind(this)\n }];\n for (var _i = 0, _events = events; _i < _events.length; _i++) {\n var event = _events[_i];\n $(document).on('click', event.selector, event.action);\n }\n $(document).on('change', '.path', this.parseParam.bind(this));\n $(document).on('change', '.request_headers input', this.handleUIUpdate.bind(this));\n $(document).on('change', '.api_request_info select, .api_request_info input', this.handleUIUpdate.bind(this));\n $(document).on('change', '.api_request_info select', this.handleUpdateServer.bind(this));\n window.addEventListener('resize', this.resizeEditor.bind(this));\n }\n }, {\n key: \"resizeEditor\",\n value: function resizeEditor() {\n //FIXME: 창 크기 변경시 자동으로 editor 크기가 조정되지 않아서, 0으로 강제 변경후 다시 layout() 호출\n\n for (var i = 0; i < this.requestEditors.length; i++) {\n this.requestEditors[i].layout({\n width: 0\n });\n }\n for (var _i2 = 0; _i2 < this.responseEditors.length; _i2++) {\n this.responseEditors[_i2].layout({\n width: 0\n });\n }\n for (var _i3 = 0; _i3 < this.preRequestEditors.length; _i3++) {\n this.preRequestEditors[_i3].layout({\n width: 0\n });\n }\n for (var _i4 = 0; _i4 < this.postRequestEditors.length; _i4++) {\n this.postRequestEditors[_i4].layout({\n width: 0\n });\n }\n for (var _i5 = 0; _i5 < this.requestEditors.length; _i5++) {\n this.requestEditors[_i5].layout({});\n }\n for (var _i6 = 0; _i6 < this.responseEditors.length; _i6++) {\n this.responseEditors[_i6].layout({});\n }\n for (var _i7 = 0; _i7 < this.preRequestEditors.length; _i7++) {\n this.preRequestEditors[_i7].layout({});\n }\n for (var _i8 = 0; _i8 < this.postRequestEditors.length; _i8++) {\n this.postRequestEditors[_i8].layout({});\n }\n }\n }, {\n key: \"showCollectionDeleteModal\",\n value: function showCollectionDeleteModal(event) {\n var collectionId = $(event.currentTarget).closest('button').data('collection');\n $('#confirm_delete_modal').find('.confirm_delete').data('id', collectionId);\n $('#confirm_delete_modal').modal('show');\n }\n }, {\n key: \"getApiRequestModel\",\n value: function getApiRequestModel(apiId) {\n var foundApi = null;\n this.collections.forEach(function (collection) {\n collection.apis.forEach(function (api) {\n if (api.id === apiId) {\n foundApi = api;\n }\n });\n });\n return foundApi;\n }\n }, {\n key: \"showCollectionEditModal\",\n value: function showCollectionEditModal(event) {\n var me = this;\n var collectionId = $(event.currentTarget).closest('button').data('collection');\n var collection = this.collections.filter(function (collection) {\n return collection.id === collectionId;\n })[0];\n $('#edit_name_modal').find('input').val('');\n $('#edit_name_modal').modal('show');\n var saveBtn = $('#edit_name_modal').find('button.change_name');\n saveBtn.off('click');\n saveBtn.on('click', function () {\n collection.name = $('#edit_name_modal').find('input').val();\n me.saveCollection(collection.id, collection.name);\n me.renderCollections();\n $('#edit_name_modal').modal('hide');\n });\n }\n }, {\n key: \"showDeleteApiRequestModal\",\n value: function showDeleteApiRequestModal(event) {\n var collectionId = $(event.currentTarget).closest('li').data('collection');\n var apiId = $(event.currentTarget).closest('li').data('id');\n $('#confirm_delete_api_modal').find('.confirm_delete_api').data('id', apiId);\n $('#confirm_delete_api_modal').find('.confirm_delete_api').data('collection', collectionId);\n $('#confirm_delete_api_modal').modal('show');\n }\n }, {\n key: \"showNewApiRequestModal\",\n value: function showNewApiRequestModal(event) {\n if (this.collections.length == 0) {\n $('.toast-body').text('새로운 컬렉션을 추가해 주세요.');\n $('.toast').toast('show');\n return;\n }\n $('#new_api_request_modal').modal('show');\n }\n }, {\n key: \"showNewCollectionModal\",\n value: function showNewCollectionModal(event) {\n $('#new_collection_modal').find('input').val('');\n $('#new_collection_modal').modal('show');\n }\n }, {\n key: \"showEditNameModal\",\n value: function showEditNameModal(event) {\n var me = this;\n var apiId = $(event.currentTarget).closest('li').data('id');\n var collectionId = $(event.currentTarget).closest('li').data('collection');\n var collection = this.collections.filter(function (collection) {\n return collection.id === collectionId;\n })[0];\n var apiRequest = collection.apis.filter(function (api) {\n return api.id === apiId;\n })[0];\n apiRequest.collectionId = collectionId;\n var saveBtn = $('#edit_name_modal').find('button.change_name');\n saveBtn.off('click');\n saveBtn.on('click', function () {\n apiRequest.name = $('#edit_name_modal').find('input').val();\n me.changeAPIName(apiRequest);\n me.renderCollections();\n $('#edit_name_modal').modal('hide');\n\n //탭이 열려 있으면, 닫았다가 다시 열어야 함.\n me.renderTabHeader();\n me.renderTabContent(apiRequest.index);\n });\n $('#edit_name_modal').find('input').val('');\n $('#edit_name_modal').modal('show');\n }\n }, {\n key: \"getFieldValue\",\n value: function getFieldValue(element) {\n if ($(element).is('select') || $(element).is('input[type=\"text\"]')) {\n return $(element).val();\n }\n if ($(element).is('input[type=\"checkbox\"]')) {\n return $(element).is(':checked');\n }\n }\n }, {\n key: \"handleUIUpdate\",\n value: function handleUIUpdate(event) {\n if (event) {\n event.preventDefault();\n var element = event.currentTarget;\n var fieldName = $(element).attr('name');\n var newValue = this.getFieldValue(element);\n var tabIndex = $('#apiRequestTabContent').children().index($(event.currentTarget).closest('.api_request'));\n var model = this.apiRequests[tabIndex];\n if (fieldName !== '') {\n _.set(model, fieldName, newValue);\n }\n }\n }\n }, {\n key: \"handleUpdateServer\",\n value: function handleUpdateServer(event) {\n var tabIndex = $('#apiRequestTabContent').children().index($(event.currentTarget).closest('.api_request'));\n var model = this.apiRequests[tabIndex];\n var target = $('#api_request_' + model.id);\n target.find('input[name=\"basePath\"]').val(this.serverManager.basePath(model.server));\n }\n }, {\n key: \"renderHeaders\",\n value: function renderHeaders(headers) {\n var _this2 = this;\n return headers.map(function (header, index) {\n return _this2.headerTemplate(header, index);\n }).join('');\n }\n }, {\n key: \"renderTabHeader\",\n value: function renderTabHeader() {\n var apiRequestTabTitle = $(this.apiTabTitleTarget);\n apiRequestTabTitle.empty();\n for (var idx = 0; idx < this.apiRequests.length; idx++) {\n var li = \"
  • \\n \\n
    • \");\n apiRequestTabTitle.append(li);\n }\n }\n }, {\n key: \"showPopper\",\n value: function showPopper(element, text) {\n var variable = text.replace(/{{|}}/g, '');\n this.popperContent.style.display = 'block';\n var innerDiv = this.popperContent.querySelector('.variable_popper');\n innerDiv.textContent = '{{' + variable + '}} = ' + (window.globals[variable] === undefined ? '' : window.globals[variable]);\n this.popperInstance = (0,_popperjs_core_lib_popper_lite__WEBPACK_IMPORTED_MODULE_6__.createPopper)(element, this.popperContent, {\n placement: 'bottom',\n // Popper below the element\n modifiers: [{\n name: 'offset',\n options: {\n offset: [0, 8] // Adjust the position if needed\n }\n }]\n });\n }\n }, {\n key: \"hidePopper\",\n value: function hidePopper(element) {\n if (this.popperInstance) {\n this.popperInstance.destroy();\n this.popperInstance = null;\n }\n this.popperContent.style.display = 'none';\n }\n }, {\n key: \"renderTabContent\",\n value: function renderTabContent(index) {\n var me = this;\n var apiRequestTabContent = $(this.apiTabContentTarget);\n var model = this.apiRequests[index];\n document.querySelectorAll('.variable').forEach(function (element) {\n var text = element.innerText;\n element.addEventListener('mouseover', function () {\n return me.showPopper(element, text);\n });\n element.addEventListener('mouseout', function () {\n return me.hidePopper(element);\n });\n });\n var language = model.type === 'HTTP' ? 'json' : 'text';\n var requestBodyEditor = null;\n var target = null;\n if (model.type === 'HTTP') {\n var httpClientView = new _components_HTTPClientView__WEBPACK_IMPORTED_MODULE_3__[\"default\"](me, this.serverManager, apiRequestTabContent, model);\n httpClientView.init();\n target = this.openTab(model.id);\n requestBodyEditor = monaco_editor__WEBPACK_IMPORTED_MODULE_0__.editor.create(target.find('.request_body')[0], {\n value: model.requestBody,\n language: 'json',\n automaticLayout: true\n });\n }\n if (model.type === 'TCP') {\n var tcpClientView = new _components_TCPClientView__WEBPACK_IMPORTED_MODULE_4__[\"default\"](me, this.serverManager, apiRequestTabContent, model);\n tcpClientView.init();\n target = this.openTab(model.id);\n requestBodyEditor = monaco_editor__WEBPACK_IMPORTED_MODULE_0__.editor.create(target.find('.request_body')[0], {\n value: model.requestBody,\n language: 'text',\n automaticLayout: true\n });\n tcpClientView.requestBodyEditor = requestBodyEditor;\n }\n requestBodyEditor.onMouseMove(function (e) {\n var position = e.target.position;\n if (position) {\n var _model = requestBodyEditor.getModel();\n var word = _model.getWordAtPosition(position);\n var lineContent = _model.getLineContent(position.lineNumber);\n if (word) {\n if (lineContent.indexOf('{{' + word.word + '}}') > -1) {\n me.showPopper(e.target.element, word.word);\n }\n } else {\n me.hidePopper(e.target.element);\n }\n }\n });\n me.requestEditors.push(requestBodyEditor);\n target.find('.request_body_tab')[0].addEventListener('shown.bs.tab', function () {\n me.requestEditors[index].layout();\n });\n me.requestEditors[index].onDidChangeModelContent(function (e) {\n model.requestBody = requestBodyEditor.getValue();\n });\n target.find('.request_body_type').on('change', function () {\n var model = requestBodyEditor.getModel();\n monaco_editor__WEBPACK_IMPORTED_MODULE_0__.editor.setModelLanguage(model, $(this).val());\n });\n var responseBodyEditor = monaco_editor__WEBPACK_IMPORTED_MODULE_0__.editor.create(target.find('.response_body')[0], {\n value: '',\n language: language,\n automaticLayout: true,\n quickSuggestions: false\n });\n me.responseEditors.push(responseBodyEditor);\n var consoleEditor = monaco_editor__WEBPACK_IMPORTED_MODULE_0__.editor.create(target.find('.console')[0], {\n value: '',\n automaticLayout: true,\n quickSuggestions: false\n });\n me.consoleEditors.push(consoleEditor);\n var preRequestEditor = monaco_editor__WEBPACK_IMPORTED_MODULE_0__.editor.create(target.find('.pre-request')[0], {\n value: model.preRequestScript,\n language: 'javascript',\n automaticLayout: true,\n quickSuggestions: false\n });\n var snippet1 = new _components_VariableSnippet__WEBPACK_IMPORTED_MODULE_2__[\"default\"]();\n snippet1.init(target.find('.pre-request-variable')[0], preRequestEditor);\n me.preRequestEditors.push(preRequestEditor);\n target.find('.pre-request')[0].addEventListener('shown.bs.tab', function () {\n me.preRequestEditors[index].layout();\n });\n me.preRequestEditors[index].onDidChangeModelContent(function (e) {\n model.preRequestScript = preRequestEditor.getValue();\n });\n var postRequestEditor = monaco_editor__WEBPACK_IMPORTED_MODULE_0__.editor.create(target.find('.post-request')[0], {\n value: model.postRequestScript,\n language: 'javascript',\n automaticLayout: true,\n quickSuggestions: false\n });\n var snippet2 = new _components_VariableSnippet__WEBPACK_IMPORTED_MODULE_2__[\"default\"]();\n snippet2.init(target.find('.post-request-variable')[0], postRequestEditor);\n me.postRequestEditors.push(postRequestEditor);\n target.find('.post-request')[0].addEventListener('shown.bs.tab', function () {\n me.postRequestEditors[index].layout();\n });\n me.postRequestEditors[index].onDidChangeModelContent(function (e) {\n model.postRequestScript = postRequestEditor.getValue();\n });\n }\n }, {\n key: \"renderResponse\",\n value: function renderResponse(tabIndex) {\n var _this3 = this;\n var model = this.apiRequests[tabIndex];\n var target = $('#api_request_' + model.id);\n target.find('.response_headers').empty();\n target.find('.response_status').empty();\n try {\n var parsedJson = JSON.parse(model.responseModel.body);\n var formattedJson = JSON.stringify(parsedJson, null, 2);\n this.responseEditors[tabIndex].setValue(formattedJson);\n } catch (e) {\n this.responseEditors[tabIndex].setValue(model.responseModel.body);\n }\n if (model.responseModel && model.responseModel.headers) {\n var headers = model.responseModel.headers;\n Object.entries(headers).forEach(function (_ref) {\n var _ref2 = _slicedToArray(_ref, 2),\n key = _ref2[0],\n value = _ref2[1];\n target.find('.response_headers').append(_this3.responseHeaderTemplate(key, value));\n });\n }\n target.find('.response_status').text('status: ' + model.responseModel.status);\n target.find('.response_time').text('time: ' + model.responseModel.time + 'ms');\n target.find('.response_size').text('size: ' + model.responseModel.size + 'bytes');\n }\n }, {\n key: \"customHelper\",\n value: function customHelper(event) {\n // Create and return the custom helper element\n var name = $(event.target).closest('.api_request_sortable').find('.open_api_request').text().trim();\n var apiId = $(event.target).closest('.api_request_sortable').data('id');\n return \"
    \\n
    \").concat(name, \"
    \\n
    \");\n }\n }, {\n key: \"renderCollections\",\n value: function renderCollections() {\n var select = $('#modal_collection');\n var sidemenu = $(this.collectionTarget);\n select.empty();\n sidemenu.empty();\n for (var i = 0; i < this.collections.length; i++) {\n sidemenu.append(this.renderCollection(this.collections[i], i));\n var option = $('