diff --git a/src/main/resources/static/plugins/apitestmanager/app.bundle.js b/src/main/resources/static/plugins/apitestmanager/app.bundle.js index 053e035..e64e5f7 100644 --- a/src/main/resources/static/plugins/apitestmanager/app.bundle.js +++ b/src/main/resources/static/plugins/apitestmanager/app.bundle.js @@ -1,4 +1,4 @@ -/* + /* * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development"). * This devtool is neither made for production nor for readable output files. * It uses "eval()" calls to create a separate source file in the browser devtools. @@ -521,7 +521,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 _APIScenarioExecutor__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./APIScenarioExecutor */ \"./src/APIScenarioExecutor.js\");\n/* harmony import */ var drawflow__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! drawflow */ \"./node_modules/drawflow/dist/drawflow.min.js\");\n/* harmony import */ var drawflow__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(drawflow__WEBPACK_IMPORTED_MODULE_2__);\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 _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// require.config({paths: {'vs': '/plugins/vs'}});\n\n\n\nvar APIScenario = /*#__PURE__*/function () {\n function APIScenario(apiTester, contextPath) {\n _classCallCheck(this, APIScenario);\n this.scenarioList = [];\n this.currentScenario = null;\n this.apiTester = apiTester;\n this.contextPath = contextPath || '/';\n }\n _createClass(APIScenario, [{\n key: \"getAPIScenarioListURL\",\n value: function getAPIScenarioListURL() {\n return this.contextPath + 'mgmt/api_scenario/list.do';\n }\n }, {\n key: \"getAPIScenarioCreateURL\",\n value: function getAPIScenarioCreateURL() {\n return this.contextPath + 'mgmt/api_scenario/create.do';\n }\n }, {\n key: \"getAPIScenarioUpdateURL\",\n value: function getAPIScenarioUpdateURL() {\n return this.contextPath + 'mgmt/api_scenario/update.do';\n }\n }, {\n key: \"getAPIScenarioDeleteURL\",\n value: function getAPIScenarioDeleteURL() {\n return this.contextPath + 'mgmt/api_scenario/delete.do';\n }\n }, {\n key: \"init\",\n value: function init() {\n this.loadScenarioList();\n this.outputEditor = monaco_editor__WEBPACK_IMPORTED_MODULE_0__.editor.create(document.getElementById('output'), {\n value: '',\n automaticLayout: true\n });\n this.bindEvents();\n var id = document.getElementById('drawflow');\n this.editor = new (drawflow__WEBPACK_IMPORTED_MODULE_2___default())(id);\n this.editor.reroute = true;\n this.editor.reroute_fix_curvature = true;\n this.editor.force_first_input = true;\n this.editor.start();\n // this.editor.on('contextmenu', (event) => {\n // let node = this.editor.getNodeFromId(event.target.id);\n // })\n\n this.showOutput = true;\n }\n }, {\n key: \"loadScenarioList\",\n value: function loadScenarioList(callback) {\n var me = this;\n this.currentAjaxRequest = $.ajax({\n url: this.getAPIScenarioListURL(),\n type: 'GET',\n contentType: 'application/json',\n success: function success(data) {\n me.scenarioList = data;\n var drawflowData = {\n drawflow: {\n Home: {\n data: {}\n }\n }\n };\n data.forEach(function (scenario) {\n var scenarioData = null;\n try {\n scenarioData = JSON.parse(scenario.scenario);\n } catch (e) {\n scenarioData = {};\n }\n drawflowData.drawflow[scenario.id] = {\n data: scenarioData\n };\n });\n me.editor[\"import\"](drawflowData);\n me.editor.changeModule('Home');\n },\n error: function error(response, textStatus, errorThrown) {\n me.hideLoadingOverlay();\n $('.toast-body').text(response.responseJSON.error);\n $('.toast').toast('show');\n },\n complete: function complete() {\n me.renderScenarioList();\n if (callback) {\n callback();\n }\n me.hideLoadingOverlay();\n }\n });\n }\n }, {\n key: \"getScenarioList\",\n value: function getScenarioList() {\n return this.scenarioList;\n }\n }, {\n key: \"openScenario\",\n value: function openScenario(event) {\n event.preventDefault();\n var scenarioId = $(event.target).closest('li').data('id');\n this.openScenarioById(scenarioId);\n }\n }, {\n key: \"openScenarioById\",\n value: function openScenarioById(scenarioId) {\n document.querySelectorAll(\".api-scenario-list li\").forEach(function (node) {\n node.classList.remove('selected');\n });\n\n //find li by data-id and add class selected\n document.querySelector(\".api-scenario-list li[data-id=\\\"\".concat(scenarioId, \"\\\"]\")).classList.add('selected');\n this.editor.changeModule(scenarioId);\n this.currentScenario = scenarioId;\n }\n }, {\n key: \"getScenario\",\n value: function getScenario(scenarioId) {\n return this.getScenarioList().find(function (scenario) {\n return scenario.id === scenarioId;\n });\n }\n }, {\n key: \"showLoadingOverlay\",\n value: function showLoadingOverlay() {\n $(\"#loading-overlay\").show();\n }\n }, {\n key: \"hideLoadingOverlay\",\n value: function hideLoadingOverlay() {\n $(\"#loading-overlay\").hide();\n }\n }, {\n key: \"showNewScenarioModal\",\n value: function showNewScenarioModal() {\n $('#new_scenario_modal').find('input').val('');\n $('#new_scenario_modal').modal('show');\n }\n }, {\n key: \"createScenario\",\n value: function createScenario() {\n var name = $('#new_scenario_name').val();\n var me = this;\n me.showLoadingOverlay();\n this.currentAjaxRequest = $.ajax({\n url: this.getAPIScenarioCreateURL(),\n type: 'POST',\n contentType: 'application/json',\n data: JSON.stringify({\n name: name,\n scenario: \"{}\",\n description: \"\"\n }),\n success: function success(data) {\n me.loadScenarioList(function () {\n me.openScenarioById(data.id);\n var start = \"\\n
\\n
Start
\\n
\\n \";\n me.editor.addNode('Start', 0, 1, 100, 100, 'start', {}, start);\n me.saveScenario();\n });\n },\n error: function error(response, textStatus, errorThrown) {\n me.hideLoadingOverlay();\n $('.toast-body').text(response.responseJSON.error);\n $('.toast').toast('show');\n },\n complete: function complete() {\n me.hideLoadingOverlay();\n $('#new_scenario_modal').modal('hide');\n }\n });\n }\n }, {\n key: \"saveScenario\",\n value: function saveScenario() {\n if (this.currentScenario !== null) {\n var data = this.editor[\"export\"]();\n console.log(data.drawflow[this.currentScenario].data);\n var updatedScenario = this.getScenario(this.currentScenario);\n updatedScenario.scenario = JSON.stringify(data.drawflow[this.currentScenario].data);\n var me = this;\n me.showLoadingOverlay();\n this.currentAjaxRequest = $.ajax({\n url: this.getAPIScenarioUpdateURL(),\n type: 'POST',\n contentType: 'application/json',\n data: JSON.stringify(updatedScenario),\n error: function error(response, textStatus, errorThrown) {\n me.hideLoadingOverlay();\n $('.toast-body').text(response.responseJSON.error);\n $('.toast').toast('show');\n },\n complete: function complete() {\n me.hideLoadingOverlay();\n $('.toast-body').text('저장되었습니다.');\n $('.toast').toast('show');\n }\n });\n }\n }\n }, {\n key: \"showDeleteModal\",\n value: function showDeleteModal(event) {\n var id = $(event.currentTarget).closest('li').data('id');\n $('#confirm_delete_scenario_modal').find('.confirm_delete_scenario').data('id', id);\n $('#confirm_delete_scenario_modal').modal('show');\n }\n }, {\n key: \"removeScenario\",\n value: function removeScenario(event) {\n var id = $(event.currentTarget).data('id');\n var me = this;\n me.showLoadingOverlay();\n this.currentAjaxRequest = $.ajax({\n url: this.getAPIScenarioDeleteURL(),\n type: 'POST',\n contentType: 'application/json',\n data: JSON.stringify({\n id: id\n }),\n error: function error(response, textStatus, errorThrown) {\n me.hideLoadingOverlay();\n $('.toast-body').text(response.responseJSON.error);\n $('.toast').toast('show');\n },\n complete: function complete() {\n me.hideLoadingOverlay();\n $('#confirm_delete_scenario_modal').modal('hide');\n $('.toast-body').text('삭제되었습니다.');\n $('.toast').toast('show');\n me.editor.changeModule('Home');\n me.loadScenarioList(function () {\n if (me.getScenarioList().length > 0) me.openScenarioById(me.getScenarioList()[0].id);\n });\n }\n });\n }\n }, {\n key: \"toggleOutput\",\n value: function toggleOutput() {\n // Define your selectors as constants for easy changes and better readability\n var scenarioContentSelector = '.api-scenario-content';\n var scenarioOutputSelector = '.api-scenario-output';\n var scenarioOutputBodySelector = '.api-scenario-output-body';\n var drawflowSelector = '#drawflow';\n var scenarioEditorSelector = '.scenario_editor';\n\n // Ensure parentHeight is a number\n var parentHeight = parseInt($(scenarioContentSelector).css('height'), 10);\n\n // Toggle the showOutput state\n this.showOutput = !this.showOutput;\n if (!this.showOutput) {\n $(scenarioOutputSelector).css('flex', '0');\n $(scenarioOutputBodySelector).hide();\n var editorHeight = $(scenarioEditorSelector).css('height');\n $(drawflowSelector).css('height', editorHeight);\n $(scenarioOutputSelector).removeClass('halfHeight');\n $(drawflowSelector).removeClass('halfHeight');\n } else {\n $(scenarioOutputSelector).css('flex', '1');\n $(scenarioOutputSelector).addClass('halfHeight');\n $(scenarioOutputBodySelector).show();\n $(drawflowSelector).addClass('halfHeight');\n $(drawflowSelector).css('height', parentHeight / 2);\n }\n\n // Adjustments for when parentHeight isn't a valid number\n if (isNaN(parentHeight)) {\n console.error('parentHeight is not a number. Check the height of the api-scenario-content element.');\n // Fallback or additional error handling can be placed here\n }\n }\n }, {\n key: \"resizeEditor\",\n value: function resizeEditor() {\n //FIXME: 창 크기 변경시 자동으로 editor 크기가 조정되지 않아서, 0으로 강제 변경후 다시 layout() 호출\n this.outputEditor.layout({\n width: 0\n });\n this.outputEditor.layout({});\n }\n }, {\n key: \"runScript\",\n value: function runScript() {\n console.log(this.editor[\"export\"]().drawflow);\n var graph = _APIScenarioExecutor__WEBPACK_IMPORTED_MODULE_1__[\"default\"].extractGraphFromStart(this.editor[\"export\"]().drawflow[this.currentScenario].data);\n this.executor = new _APIScenarioExecutor__WEBPACK_IMPORTED_MODULE_1__[\"default\"](graph, this.apiTester, this.outputEditor);\n }\n }, {\n key: \"runScenarioAll\",\n value: function runScenarioAll() {\n if (!this.executor) {\n this.runScript();\n }\n if (!this.executor.isDone) {\n this.executor.executeAll();\n } else {\n this.executor.reset();\n }\n }\n }, {\n key: \"runScenarioStep\",\n value: function runScenarioStep() {\n if (!this.executor) {\n this.runScript();\n }\n if (!this.executor.isDone) {\n this.executor.executeCurrentNode();\n this.executor.moveToNextNode();\n } else {\n this.executor.reset();\n }\n }\n }, {\n key: \"resetScenario\",\n value: function resetScenario() {}\n }, {\n key: \"pauseScenario\",\n value: function pauseScenario() {}\n }, {\n key: \"stopScenario\",\n value: function stopScenario() {\n if (this.executor) this.executor.reset();\n this.outputEditor.setValue('');\n }\n }, {\n key: \"addStart\",\n value: function addStart() {\n var start = \"\\n
\\n
Start
\\n
\\n \";\n this.editor.addNode('Start', 0, 1, 100, 100, 'start', {}, start);\n }\n }, {\n key: \"bindEvents\",\n value: function bindEvents() {\n var events = [{\n type: 'click',\n selector: '.open_scenario',\n action: this.openScenario.bind(this)\n }, {\n type: 'click',\n selector: '.export',\n action: this.runScript.bind(this)\n }, {\n type: 'click',\n selector: '.toggle_output',\n action: this.toggleOutput.bind(this)\n }, {\n type: 'click',\n selector: '.run_scenario_step',\n action: this.runScenarioStep.bind(this)\n }, {\n type: 'click',\n selector: '.run_scenario_all',\n action: this.runScenarioAll.bind(this)\n }, {\n type: 'click',\n selector: '.reset_scenario',\n action: this.resetScenario.bind(this)\n }, {\n type: 'click',\n selector: '.pause_scenario',\n action: this.pauseScenario.bind(this)\n }, {\n type: 'click',\n selector: '.stop_scenario',\n action: this.stopScenario.bind(this)\n }, {\n type: 'click',\n selector: '#new_scenario',\n action: this.showNewScenarioModal.bind(this)\n }, {\n type: 'click',\n selector: '.create_scenario',\n action: this.createScenario.bind(this)\n }, {\n type: 'click',\n selector: '.save_scenario',\n action: this.saveScenario.bind(this)\n },\n // {type: 'click', selector: '.add_start', action: this.addStart.bind(this)},\n {\n type: 'click',\n selector: '.delete_scenario',\n action: this.showDeleteModal.bind(this)\n }, {\n type: 'click',\n selector: '.confirm_delete_scenario',\n action: this.removeScenario.bind(this)\n }, {\n type: 'click',\n selector: '.stop_scenario',\n action: this.stopScenario.bind(this)\n }];\n for (var _i = 0, _events = events; _i < _events.length; _i++) {\n var event = _events[_i];\n $(document).on(event.type, event.selector, event.action);\n }\n window.addEventListener('resize', this.resizeEditor.bind(this));\n var me = this;\n $('#drawflow').droppable({\n drop: function drop(event, ui) {\n var x = ui.offset.left - $(this).offset().left;\n var y = ui.offset.top - $(this).offset().top;\n var dataset = ui.draggable[0].dataset;\n var node = \"
API
\".concat(dataset.name, \"
\");\n me.editor.addNode(dataset.name, 1, 1, x, y, dataset.nodeType, dataset, node);\n }\n });\n }\n }, {\n key: \"scenarioListTemplate\",\n value: function scenarioListTemplate(scenario) {\n return \"\\n
  • \\n \").concat(scenario.name, \"\\n
    \\n \\n \\n
    \\n
    • \\n \");\n }\n }, {\n key: \"renderScenarioList\",\n value: function renderScenarioList() {\n var _this = this;\n var scenarioList = this.getScenarioList();\n var scenarioListHtml = scenarioList.map(function (scenario) {\n return _this.scenarioListTemplate(scenario);\n }).join('');\n $('.api-scenario-list').html(scenarioListHtml);\n var nodes = document.querySelectorAll(\".api-scenario-list li\");\n nodes.forEach(function (node) {\n if ($(node).data('id') === _this.currentScenario) {\n node.classList.add('selected');\n }\n });\n }\n }]);\n return APIScenario;\n}();\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (APIScenario);\n\n//# sourceURL=webpack://APITestManager/./src/APIScenario.js?"); +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 _APIScenarioExecutor__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./APIScenarioExecutor */ \"./src/APIScenarioExecutor.js\");\n/* harmony import */ var drawflow__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! drawflow */ \"./node_modules/drawflow/dist/drawflow.min.js\");\n/* harmony import */ var drawflow__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(drawflow__WEBPACK_IMPORTED_MODULE_2__);\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 _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\nvar APIScenario = /*#__PURE__*/function () {\n function APIScenario(apiTester, contextPath) {\n _classCallCheck(this, APIScenario);\n this.scenarioList = [];\n this.currentScenario = null;\n this.apiTester = apiTester;\n this.contextPath = contextPath || '/';\n }\n _createClass(APIScenario, [{\n key: \"getAPIScenarioListURL\",\n value: function getAPIScenarioListURL() {\n return this.contextPath + 'mgmt/api_scenario/list.do';\n }\n }, {\n key: \"getAPIScenarioCreateURL\",\n value: function getAPIScenarioCreateURL() {\n return this.contextPath + 'mgmt/api_scenario/create.do';\n }\n }, {\n key: \"getAPIScenarioUpdateURL\",\n value: function getAPIScenarioUpdateURL() {\n return this.contextPath + 'mgmt/api_scenario/update.do';\n }\n }, {\n key: \"getAPIScenarioDeleteURL\",\n value: function getAPIScenarioDeleteURL() {\n return this.contextPath + 'mgmt/api_scenario/delete.do';\n }\n }, {\n key: \"init\",\n value: function init() {\n this.loadScenarioList();\n this.outputEditor = monaco_editor__WEBPACK_IMPORTED_MODULE_0__.editor.create(document.getElementById('output'), {\n value: '',\n automaticLayout: true\n });\n this.bindEvents();\n var id = document.getElementById('drawflow');\n this.editor = new (drawflow__WEBPACK_IMPORTED_MODULE_2___default())(id);\n this.editor.reroute = true;\n this.editor.reroute_fix_curvature = true;\n this.editor.force_first_input = true;\n this.editor.start();\n // this.editor.on('contextmenu', (event) => {\n // let node = this.editor.getNodeFromId(event.target.id);\n // })\n\n this.showOutput = true;\n }\n }, {\n key: \"loadScenarioList\",\n value: function loadScenarioList(callback) {\n var me = this;\n this.currentAjaxRequest = $.ajax({\n url: this.getAPIScenarioListURL(),\n type: 'GET',\n contentType: 'application/json',\n success: function success(data) {\n me.scenarioList = data;\n var drawflowData = {\n drawflow: {\n Home: {\n data: {}\n }\n }\n };\n data.forEach(function (scenario) {\n var scenarioData = null;\n try {\n scenarioData = JSON.parse(scenario.scenario);\n } catch (e) {\n scenarioData = {};\n }\n drawflowData.drawflow[scenario.id] = {\n data: scenarioData\n };\n });\n me.editor[\"import\"](drawflowData);\n me.editor.changeModule('Home');\n },\n error: function error(response, textStatus, errorThrown) {\n me.hideLoadingOverlay();\n $('.toast-body').text(response.responseJSON.error);\n $('.toast').toast('show');\n },\n complete: function complete() {\n me.renderScenarioList();\n if (callback) {\n callback();\n }\n me.hideLoadingOverlay();\n }\n });\n }\n }, {\n key: \"getScenarioList\",\n value: function getScenarioList() {\n return this.scenarioList;\n }\n }, {\n key: \"openScenario\",\n value: function openScenario(event) {\n event.preventDefault();\n var scenarioId = $(event.target).closest('li').data('id');\n this.openScenarioById(scenarioId);\n }\n }, {\n key: \"openScenarioById\",\n value: function openScenarioById(scenarioId) {\n document.querySelectorAll('.api-scenario-list li').forEach(function (node) {\n node.classList.remove('selected');\n });\n\n //find li by data-id and add class selected\n document.querySelector(\".api-scenario-list li[data-id=\\\"\".concat(scenarioId, \"\\\"]\")).classList.add('selected');\n this.editor.changeModule(scenarioId);\n this.currentScenario = scenarioId;\n }\n }, {\n key: \"getScenario\",\n value: function getScenario(scenarioId) {\n return this.getScenarioList().find(function (scenario) {\n return scenario.id === scenarioId;\n });\n }\n }, {\n key: \"showLoadingOverlay\",\n value: function showLoadingOverlay() {\n $('#loading-overlay').show();\n }\n }, {\n key: \"hideLoadingOverlay\",\n value: function hideLoadingOverlay() {\n $('#loading-overlay').hide();\n }\n }, {\n key: \"showNewScenarioModal\",\n value: function showNewScenarioModal() {\n $('#new_scenario_modal').find('input').val('');\n $('#new_scenario_modal').modal('show');\n }\n }, {\n key: \"createScenario\",\n value: function createScenario() {\n var name = $('#new_scenario_name').val();\n var me = this;\n me.showLoadingOverlay();\n this.currentAjaxRequest = $.ajax({\n url: this.getAPIScenarioCreateURL(),\n type: 'POST',\n contentType: 'application/json',\n data: JSON.stringify({\n name: name,\n scenario: '{}',\n description: ''\n }),\n success: function success(data) {\n me.loadScenarioList(function () {\n me.openScenarioById(data.id);\n var start = \"\\n
    \\n
    Start
    \\n
    \\n \";\n me.editor.addNode('Start', 0, 1, 100, 100, 'start', {}, start);\n me.saveScenario();\n });\n },\n error: function error(response, textStatus, errorThrown) {\n me.hideLoadingOverlay();\n $('.toast-body').text(response.responseJSON.error);\n $('.toast').toast('show');\n },\n complete: function complete() {\n me.hideLoadingOverlay();\n $('#new_scenario_modal').modal('hide');\n }\n });\n }\n }, {\n key: \"saveScenario\",\n value: function saveScenario() {\n if (this.currentScenario !== null) {\n var data = this.editor[\"export\"]();\n console.log(data.drawflow[this.currentScenario].data);\n var updatedScenario = this.getScenario(this.currentScenario);\n updatedScenario.scenario = JSON.stringify(data.drawflow[this.currentScenario].data);\n var me = this;\n me.showLoadingOverlay();\n this.currentAjaxRequest = $.ajax({\n url: this.getAPIScenarioUpdateURL(),\n type: 'POST',\n contentType: 'application/json',\n data: JSON.stringify(updatedScenario),\n error: function error(response, textStatus, errorThrown) {\n me.hideLoadingOverlay();\n $('.toast-body').text(response.responseJSON.error);\n $('.toast').toast('show');\n },\n complete: function complete() {\n me.hideLoadingOverlay();\n $('.toast-body').text('저장되었습니다.');\n $('.toast').toast('show');\n }\n });\n }\n }\n }, {\n key: \"showDeleteModal\",\n value: function showDeleteModal(event) {\n var id = $(event.currentTarget).closest('li').data('id');\n $('#confirm_delete_scenario_modal').find('.confirm_delete_scenario').data('id', id);\n $('#confirm_delete_scenario_modal').modal('show');\n }\n }, {\n key: \"removeScenario\",\n value: function removeScenario(event) {\n var id = $(event.currentTarget).data('id');\n var me = this;\n me.showLoadingOverlay();\n this.currentAjaxRequest = $.ajax({\n url: this.getAPIScenarioDeleteURL(),\n type: 'POST',\n contentType: 'application/json',\n data: JSON.stringify({\n id: id\n }),\n error: function error(response, textStatus, errorThrown) {\n me.hideLoadingOverlay();\n $('.toast-body').text(response.responseJSON.error);\n $('.toast').toast('show');\n },\n complete: function complete() {\n me.hideLoadingOverlay();\n $('#confirm_delete_scenario_modal').modal('hide');\n $('.toast-body').text('삭제되었습니다.');\n $('.toast').toast('show');\n me.editor.changeModule('Home');\n me.loadScenarioList(function () {\n if (me.getScenarioList().length > 0) {\n me.openScenarioById(me.getScenarioList()[0].id);\n }\n });\n }\n });\n }\n }, {\n key: \"toggleOutput\",\n value: function toggleOutput() {\n // Define your selectors as constants for easy changes and better readability\n var scenarioContentSelector = '.api-scenario-content';\n var scenarioOutputSelector = '.api-scenario-output';\n var scenarioOutputBodySelector = '.api-scenario-output-body';\n var drawflowSelector = '#drawflow';\n var scenarioEditorSelector = '.scenario_editor';\n\n // Ensure parentHeight is a number\n var parentHeight = parseInt($(scenarioContentSelector).css('height'), 10);\n\n // Toggle the showOutput state\n this.showOutput = !this.showOutput;\n if (!this.showOutput) {\n $(scenarioOutputSelector).css('flex', '0');\n $(scenarioOutputBodySelector).hide();\n var editorHeight = $(scenarioEditorSelector).css('height');\n $(drawflowSelector).css('height', editorHeight);\n $(scenarioOutputSelector).removeClass('halfHeight');\n $(drawflowSelector).removeClass('halfHeight');\n } else {\n $(scenarioOutputSelector).css('flex', '1');\n $(scenarioOutputSelector).addClass('halfHeight');\n $(scenarioOutputBodySelector).show();\n $(drawflowSelector).addClass('halfHeight');\n $(drawflowSelector).css('height', parentHeight / 2);\n }\n\n // Adjustments for when parentHeight isn't a valid number\n if (isNaN(parentHeight)) {\n console.error('parentHeight is not a number. Check the height of the api-scenario-content element.');\n // Fallback or additional error handling can be placed here\n }\n }\n }, {\n key: \"resizeEditor\",\n value: function resizeEditor() {\n //FIXME: 창 크기 변경시 자동으로 editor 크기가 조정되지 않아서, 0으로 강제 변경후 다시 layout() 호출\n this.outputEditor.layout({\n width: 0\n });\n this.outputEditor.layout({});\n }\n }, {\n key: \"runScript\",\n value: function runScript() {\n console.log(this.editor[\"export\"]().drawflow);\n var graph = _APIScenarioExecutor__WEBPACK_IMPORTED_MODULE_1__[\"default\"].extractGraphFromStart(this.editor[\"export\"]().drawflow[this.currentScenario].data);\n this.executor = new _APIScenarioExecutor__WEBPACK_IMPORTED_MODULE_1__[\"default\"](graph, this.apiTester, this.outputEditor);\n }\n }, {\n key: \"runScenarioAll\",\n value: function runScenarioAll() {\n if (!this.executor) {\n this.runScript();\n }\n if (!this.executor.isDone) {\n this.executor.executeAll();\n } else {\n this.executor.reset();\n }\n }\n }, {\n key: \"runScenarioStep\",\n value: function runScenarioStep() {\n if (!this.executor) {\n this.runScript();\n }\n if (!this.executor.isDone) {\n this.executor.executeCurrentNode();\n this.executor.moveToNextNode();\n } else {\n this.executor.reset();\n }\n }\n }, {\n key: \"resetScenario\",\n value: function resetScenario() {}\n }, {\n key: \"pauseScenario\",\n value: function pauseScenario() {}\n }, {\n key: \"stopScenario\",\n value: function stopScenario() {\n if (this.executor) {\n this.executor.reset();\n }\n this.outputEditor.setValue('');\n }\n }, {\n key: \"addStart\",\n value: function addStart() {\n var start = \"\\n
    \\n
    Start
    \\n
    \\n \";\n this.editor.addNode('Start', 0, 1, 100, 100, 'start', {}, start);\n }\n }, {\n key: \"bindEvents\",\n value: function bindEvents() {\n var events = [{\n type: 'click',\n selector: '.open_scenario',\n action: this.openScenario.bind(this)\n }, {\n type: 'click',\n selector: '.export',\n action: this.runScript.bind(this)\n }, {\n type: 'click',\n selector: '.toggle_output',\n action: this.toggleOutput.bind(this)\n }, {\n type: 'click',\n selector: '.run_scenario_step',\n action: this.runScenarioStep.bind(this)\n }, {\n type: 'click',\n selector: '.run_scenario_all',\n action: this.runScenarioAll.bind(this)\n }, {\n type: 'click',\n selector: '.reset_scenario',\n action: this.resetScenario.bind(this)\n }, {\n type: 'click',\n selector: '.pause_scenario',\n action: this.pauseScenario.bind(this)\n }, {\n type: 'click',\n selector: '.stop_scenario',\n action: this.stopScenario.bind(this)\n }, {\n type: 'click',\n selector: '#new_scenario',\n action: this.showNewScenarioModal.bind(this)\n }, {\n type: 'click',\n selector: '.create_scenario',\n action: this.createScenario.bind(this)\n }, {\n type: 'click',\n selector: '.save_scenario',\n action: this.saveScenario.bind(this)\n },\n // {type: 'click', selector: '.add_start', action: this.addStart.bind(this)},\n {\n type: 'click',\n selector: '.delete_scenario',\n action: this.showDeleteModal.bind(this)\n }, {\n type: 'click',\n selector: '.confirm_delete_scenario',\n action: this.removeScenario.bind(this)\n }, {\n type: 'click',\n selector: '.stop_scenario',\n action: this.stopScenario.bind(this)\n }];\n for (var _i = 0, _events = events; _i < _events.length; _i++) {\n var event = _events[_i];\n $(document).on(event.type, event.selector, event.action);\n }\n window.addEventListener('resize', this.resizeEditor.bind(this));\n var me = this;\n $('#drawflow').droppable({\n drop: function drop(event, ui) {\n var x = ui.offset.left - $(this).offset().left;\n var y = ui.offset.top - $(this).offset().top;\n var dataset = ui.draggable[0].dataset;\n var node = \"
    API
    \".concat(dataset.name, \"
    \");\n me.editor.addNode(dataset.name, 1, 1, x, y, dataset.nodeType, dataset, node);\n }\n });\n }\n }, {\n key: \"scenarioListTemplate\",\n value: function scenarioListTemplate(scenario) {\n return \"\\n
  • \\n \").concat(scenario.name, \"\\n
    \\n \\n \\n
    \\n
    • \\n \");\n }\n }, {\n key: \"renderScenarioList\",\n value: function renderScenarioList() {\n var _this = this;\n var scenarioList = this.getScenarioList();\n var scenarioListHtml = scenarioList.map(function (scenario) {\n return _this.scenarioListTemplate(scenario);\n }).join('');\n $('.api-scenario-list').html(scenarioListHtml);\n var nodes = document.querySelectorAll('.api-scenario-list li');\n nodes.forEach(function (node) {\n if ($(node).data('id') === _this.currentScenario) {\n node.classList.add('selected');\n }\n });\n }\n }]);\n return APIScenario;\n}();\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (APIScenario);\n\n//# sourceURL=webpack://APITestManager/./src/APIScenario.js?"); /***/ }), @@ -532,7 +532,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\");\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 _regeneratorRuntime() { \"use strict\"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = \"function\" == typeof Symbol ? Symbol : {}, a = i.iterator || \"@@iterator\", c = i.asyncIterator || \"@@asyncIterator\", u = i.toStringTag || \"@@toStringTag\"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, \"\"); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, \"_invoke\", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: \"normal\", arg: t.call(e, r) }; } catch (t) { return { type: \"throw\", arg: t }; } } e.wrap = wrap; var h = \"suspendedStart\", l = \"suspendedYield\", f = \"executing\", s = \"completed\", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { [\"next\", \"throw\", \"return\"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if (\"throw\" !== c.type) { var u = c.arg, h = u.value; return h && \"object\" == _typeof(h) && n.call(h, \"__await\") ? e.resolve(h.__await).then(function (t) { invoke(\"next\", t, i, a); }, function (t) { invoke(\"throw\", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke(\"throw\", t, i, a); }); } a(c.arg); } var r; o(this, \"_invoke\", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error(\"Generator is already running\"); if (o === s) { if (\"throw\" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if (\"next\" === n.method) n.sent = n._sent = n.arg;else if (\"throw\" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else \"return\" === n.method && n.abrupt(\"return\", n.arg); o = f; var p = tryCatch(e, r, n); if (\"normal\" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } \"throw\" === p.type && (o = s, n.method = \"throw\", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, \"throw\" === n && e.iterator[\"return\"] && (r.method = \"return\", r.arg = t, maybeInvokeDelegate(e, r), \"throw\" === r.method) || \"return\" !== n && (r.method = \"throw\", r.arg = new TypeError(\"The iterator does not provide a '\" + n + \"' method\")), y; var i = tryCatch(o, e.iterator, r.arg); if (\"throw\" === i.type) return r.method = \"throw\", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, \"return\" !== r.method && (r.method = \"next\", r.arg = t), r.delegate = null, y) : a : (r.method = \"throw\", r.arg = new TypeError(\"iterator result is not an object\"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = \"normal\", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: \"root\" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || \"\" === e) { var r = e[a]; if (r) return r.call(e); if (\"function\" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + \" is not iterable\"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, \"constructor\", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, \"constructor\", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, \"GeneratorFunction\"), e.isGeneratorFunction = function (t) { var e = \"function\" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || \"GeneratorFunction\" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, \"GeneratorFunction\")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, \"Generator\"), define(g, a, function () { return this; }), define(g, \"toString\", function () { return \"[object Generator]\"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = \"next\", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) \"t\" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if (\"throw\" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = \"throw\", a.arg = e, r.next = n, o && (r.method = \"next\", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if (\"root\" === i.tryLoc) return handle(\"end\"); if (i.tryLoc <= this.prev) { var c = n.call(i, \"catchLoc\"), u = n.call(i, \"finallyLoc\"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error(\"try statement without catch or finally\"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, \"finallyLoc\") && this.prev < o.finallyLoc) { var i = o; break; } } i && (\"break\" === t || \"continue\" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = \"next\", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if (\"throw\" === t.type) throw t.arg; return \"break\" === t.type || \"continue\" === t.type ? this.next = t.arg : \"return\" === t.type ? (this.rval = this.arg = t.arg, this.method = \"return\", this.next = \"end\") : \"normal\" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, \"catch\": function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if (\"throw\" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error(\"illegal catch attempt\"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, \"next\" === this.method && (this.arg = t), y; } }, e; }\nfunction asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }\nfunction _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, \"next\", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, \"throw\", err); } _next(undefined); }); }; }\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\nvar APIScenarioExecutor = /*#__PURE__*/function () {\n function APIScenarioExecutor(graph, apiTester, outputEditor) {\n _classCallCheck(this, APIScenarioExecutor);\n this.graph = graph; // The graph data\n this.apiClient = new _APIClient__WEBPACK_IMPORTED_MODULE_1__[\"default\"]();\n this.apiTester = apiTester;\n this.outputEditor = outputEditor;\n this.reset();\n }\n\n // Helper method to find the start node ID\n _createClass(APIScenarioExecutor, [{\n key: \"findStartNodeId\",\n value: function findStartNodeId() {\n for (var nodeId in this.graph) {\n if (this.graph[nodeId][\"class\"] === 'start') {\n return nodeId;\n }\n }\n return null; // Return null if no start node is found\n }\n }, {\n key: \"reset\",\n value: function reset() {\n this.currentNodeId = this.findStartNodeId(); // Initialize at the 'start' node\n this.visitedNodes = new Set(); // Keep track of visited nodes\n this.isRunning = false;\n this.isDone = false;\n var allNodes = document.querySelector('#drawflow').querySelectorAll('.drawflow-node');\n allNodes.forEach(function (node) {\n node.classList.remove('current-execution');\n node.classList.remove('result-success');\n node.classList.remove('result-error');\n node.classList.remove('result-abort');\n });\n }\n }, {\n key: \"executeCurrentNode\",\n value: function executeCurrentNode() {\n var _this = this;\n return new Promise(function (resolve, reject) {\n console.log(_this.currentNodeId);\n var allNodes = document.querySelector('#drawflow').querySelectorAll('.drawflow-node');\n allNodes.forEach(function (node) {\n node.classList.remove('current-execution');\n });\n if (!_this.currentNodeId) {\n console.log('No current node to execute.');\n return;\n }\n var currentNode = _this.graph[_this.currentNodeId];\n if (currentNode) {\n _this.isRunning = true;\n _this.visitedNodes.add(_this.currentNodeId); // Mark this node as visited\n\n var nodeElement = document.querySelector('#drawflow').querySelector(\".drawflow-node[id=\\\"node-\".concat(_this.currentNodeId, \"\\\"]\"));\n if (nodeElement) {\n nodeElement.classList.add('current-execution');\n } else {\n console.error('Node with ID ' + _this.currentNodeId + ' not found');\n }\n if (currentNode[\"class\"] === 'api') {\n var model = JSON.parse(JSON.stringify(_this.apiTester.getApiRequestModel(currentNode.data.id)));\n model.responseModel = {};\n _this.appendLog(\"===============================================================\\nExecuting API [\".concat(model.name, \"]\"));\n _this.apiClient.sendAPIRequest(model, _this.logHttpRequest.bind(_this)).then(function (response) {\n _this.isRunning = false;\n _this.logHttpResponse(response);\n if (response.status === 200 || response.status === 201) {\n nodeElement.classList.add('result-success');\n } else {\n nodeElement.classList.add('result-error');\n }\n resolve();\n })[\"catch\"](function (error) {\n nodeElement.classList.add('result-abort');\n $('.toast-body').text(error.message);\n $('.toast').toast('show');\n _this.appendLog(error.message);\n reject(error);\n });\n console.log(\"===============================================================\\nExecuting API request for node: \".concat(currentNode.id, \" - \").concat(currentNode.name));\n } else if (currentNode[\"class\"] === 'start') {\n _this.appendLog('Starting API scenario\\n');\n nodeElement.classList.add('result-success');\n resolve();\n } else {\n console.log(\"Executing script for node: \".concat(currentNode.id, \" - \").concat(currentNode.name));\n resolve();\n }\n }\n });\n }\n }, {\n key: \"appendLog\",\n value: function appendLog(text) {\n var range = new monaco_editor__WEBPACK_IMPORTED_MODULE_0__.Range(this.outputEditor.getModel().getLineCount(), 1, this.outputEditor.getModel().getLineCount(), 1);\n var id = {\n major: 1,\n minor: 1\n };\n var op = {\n identifier: id,\n range: range,\n text: text + '\\n\\n',\n forceMoveMarkers: true\n };\n this.outputEditor.executeEdits(\"my-source\", [op]);\n }\n }, {\n key: \"logHttpRequest\",\n value: function logHttpRequest(model) {\n console.log(model);\n var log = \"[API Request]\\n\".concat(model.method, \" \").concat(model.path, \" HTTP/1.1\\n[Request Headers]\\n\").concat(this.parseRequestHeaders(model.headers), \"\\n[Request Body]\\n\").concat(model.requestBody);\n this.appendLog(log);\n }\n }, {\n key: \"logHttpResponse\",\n value: function logHttpResponse(response) {\n var log = \"[Response]\\nHTTP/1.1 \".concat(response.status, \"\\n[Response Headers]\\n\").concat(this.parseHeaders(response.headers), \"\\n[Response Body]\\n\").concat(response.body, \"\\n\");\n this.appendLog(log);\n }\n }, {\n key: \"parseRequestHeaders\",\n value: function parseRequestHeaders(headers) {\n var parsedHeaders = '';\n headers.forEach(function (header) {\n if (header.enabled) {\n parsedHeaders += \"\".concat(header.key, \": \").concat(header.value, \"\\n\");\n }\n });\n return parsedHeaders;\n }\n }, {\n key: \"parseHeaders\",\n value: function parseHeaders(headers) {\n //convert object to string with \\n separation\n //sort header by key\n\n var parsedHeaders = '';\n var sortedKeys = Object.keys(headers).sort(); // Sorting the keys alphabetically\n sortedKeys.forEach(function (key) {\n parsedHeaders += \"\".concat(key, \": \").concat(headers[key], \"\\n\");\n });\n return parsedHeaders;\n }\n\n // Method to move to the next node\n }, {\n key: \"moveToNextNode\",\n value: function moveToNextNode() {\n var _this2 = this;\n var currentNode = this.graph[this.currentNodeId];\n console.log(currentNode);\n if (currentNode && currentNode.connections.length > 0) {\n // Find the next unvisited node\n var nextNode = currentNode.connections.find(function (nodeId) {\n return !_this2.visitedNodes.has(nodeId);\n });\n if (nextNode) {\n this.currentNodeId = nextNode;\n } else {\n console.log('No more unvisited connections to move to.');\n this.currentNodeId = null; // No more nodes to visit\n }\n } else {\n console.log('Current node has no connections or does not exist.');\n this.currentNodeId = null; // No more nodes to visit\n this.isDone = true;\n }\n }\n }, {\n key: \"executeAll\",\n value: function () {\n var _executeAll = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {\n return _regeneratorRuntime().wrap(function _callee$(_context) {\n while (1) switch (_context.prev = _context.next) {\n case 0:\n if (!this.currentNodeId) {\n _context.next = 14;\n break;\n }\n console.log(this.currentNodeId);\n _context.prev = 2;\n _context.next = 5;\n return this.executeCurrentNode();\n case 5:\n _context.next = 10;\n break;\n case 7:\n _context.prev = 7;\n _context.t0 = _context[\"catch\"](2);\n console.error('Error executing node: ', _context.t0);\n // Handle error or break loop if necessary\n case 10:\n _context.next = 12;\n return this.moveToNextNodeWithDelay(250);\n case 12:\n _context.next = 0;\n break;\n case 14:\n console.log('Completed execution of all API nodes.');\n case 15:\n case \"end\":\n return _context.stop();\n }\n }, _callee, this, [[2, 7]]);\n }));\n function executeAll() {\n return _executeAll.apply(this, arguments);\n }\n return executeAll;\n }()\n }, {\n key: \"moveToNextNodeWithDelay\",\n value: function moveToNextNodeWithDelay(delay) {\n var _this3 = this;\n return new Promise(function (resolve) {\n setTimeout(function () {\n _this3.moveToNextNode();\n resolve();\n }, delay);\n });\n }\n }], [{\n key: \"extractGraphFromStart\",\n value: function extractGraphFromStart(graphData) {\n console.log(graphData);\n var graph = {};\n\n // Helper function to recursively build the graph\n function buildGraph(nodeId) {\n var node = graphData[nodeId];\n if (!node || graph[nodeId]) {\n // If the node doesn't exist or has already been visited, stop the recursion\n return;\n }\n\n // Initialize the node in the graph\n graph[nodeId] = {\n id: node.id,\n name: node.name,\n \"class\": node[\"class\"],\n data: node.data,\n connections: []\n };\n\n // If the node has outputs, recursively add connected nodes\n if (node.outputs) {\n Object.values(node.outputs).forEach(function (output) {\n output.connections.forEach(function (connection) {\n graph[nodeId].connections.push(connection.node);\n buildGraph(connection.node); // Recurse\n });\n });\n }\n }\n\n // Find the start node\n for (var nodeId in graphData) {\n if (graphData[nodeId][\"class\"] === 'start') {\n buildGraph(nodeId); // Start building the graph from the 'start' node\n break; // Assuming there's only one start node\n }\n }\n return graph;\n }\n }]);\n return APIScenarioExecutor;\n}();\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (APIScenarioExecutor);\n\n//# sourceURL=webpack://APITestManager/./src/APIScenarioExecutor.js?"); +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\");\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 _regeneratorRuntime() { \"use strict\"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = \"function\" == typeof Symbol ? Symbol : {}, a = i.iterator || \"@@iterator\", c = i.asyncIterator || \"@@asyncIterator\", u = i.toStringTag || \"@@toStringTag\"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, \"\"); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, \"_invoke\", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: \"normal\", arg: t.call(e, r) }; } catch (t) { return { type: \"throw\", arg: t }; } } e.wrap = wrap; var h = \"suspendedStart\", l = \"suspendedYield\", f = \"executing\", s = \"completed\", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { [\"next\", \"throw\", \"return\"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if (\"throw\" !== c.type) { var u = c.arg, h = u.value; return h && \"object\" == _typeof(h) && n.call(h, \"__await\") ? e.resolve(h.__await).then(function (t) { invoke(\"next\", t, i, a); }, function (t) { invoke(\"throw\", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke(\"throw\", t, i, a); }); } a(c.arg); } var r; o(this, \"_invoke\", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error(\"Generator is already running\"); if (o === s) { if (\"throw\" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if (\"next\" === n.method) n.sent = n._sent = n.arg;else if (\"throw\" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else \"return\" === n.method && n.abrupt(\"return\", n.arg); o = f; var p = tryCatch(e, r, n); if (\"normal\" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } \"throw\" === p.type && (o = s, n.method = \"throw\", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, \"throw\" === n && e.iterator[\"return\"] && (r.method = \"return\", r.arg = t, maybeInvokeDelegate(e, r), \"throw\" === r.method) || \"return\" !== n && (r.method = \"throw\", r.arg = new TypeError(\"The iterator does not provide a '\" + n + \"' method\")), y; var i = tryCatch(o, e.iterator, r.arg); if (\"throw\" === i.type) return r.method = \"throw\", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, \"return\" !== r.method && (r.method = \"next\", r.arg = t), r.delegate = null, y) : a : (r.method = \"throw\", r.arg = new TypeError(\"iterator result is not an object\"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = \"normal\", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: \"root\" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || \"\" === e) { var r = e[a]; if (r) return r.call(e); if (\"function\" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + \" is not iterable\"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, \"constructor\", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, \"constructor\", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, \"GeneratorFunction\"), e.isGeneratorFunction = function (t) { var e = \"function\" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || \"GeneratorFunction\" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, \"GeneratorFunction\")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, \"Generator\"), define(g, a, function () { return this; }), define(g, \"toString\", function () { return \"[object Generator]\"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = \"next\", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) \"t\" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if (\"throw\" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = \"throw\", a.arg = e, r.next = n, o && (r.method = \"next\", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if (\"root\" === i.tryLoc) return handle(\"end\"); if (i.tryLoc <= this.prev) { var c = n.call(i, \"catchLoc\"), u = n.call(i, \"finallyLoc\"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error(\"try statement without catch or finally\"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, \"finallyLoc\") && this.prev < o.finallyLoc) { var i = o; break; } } i && (\"break\" === t || \"continue\" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = \"next\", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if (\"throw\" === t.type) throw t.arg; return \"break\" === t.type || \"continue\" === t.type ? this.next = t.arg : \"return\" === t.type ? (this.rval = this.arg = t.arg, this.method = \"return\", this.next = \"end\") : \"normal\" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, \"catch\": function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if (\"throw\" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error(\"illegal catch attempt\"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, \"next\" === this.method && (this.arg = t), y; } }, e; }\nfunction asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }\nfunction _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, \"next\", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, \"throw\", err); } _next(undefined); }); }; }\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\nvar APIScenarioExecutor = /*#__PURE__*/function () {\n function APIScenarioExecutor(graph, apiTester, outputEditor) {\n _classCallCheck(this, APIScenarioExecutor);\n this.graph = graph; // The graph data\n this.apiClient = new _APIClient__WEBPACK_IMPORTED_MODULE_1__[\"default\"]();\n this.apiTester = apiTester;\n this.outputEditor = outputEditor;\n this.reset();\n }\n\n // Helper method to find the start node ID\n _createClass(APIScenarioExecutor, [{\n key: \"findStartNodeId\",\n value: function findStartNodeId() {\n for (var nodeId in this.graph) {\n if (this.graph[nodeId][\"class\"] === 'start') {\n return nodeId;\n }\n }\n return null; // Return null if no start node is found\n }\n }, {\n key: \"reset\",\n value: function reset() {\n this.currentNodeId = this.findStartNodeId(); // Initialize at the 'start' node\n this.visitedNodes = new Set(); // Keep track of visited nodes\n this.isRunning = false;\n this.isDone = false;\n var allNodes = document.querySelector('#drawflow').querySelectorAll('.drawflow-node');\n allNodes.forEach(function (node) {\n node.classList.remove('current-execution');\n node.classList.remove('result-success');\n node.classList.remove('result-error');\n node.classList.remove('result-abort');\n });\n }\n }, {\n key: \"executeCurrentNode\",\n value: function executeCurrentNode() {\n var _this = this;\n return new Promise(function (resolve, reject) {\n console.log(_this.currentNodeId);\n var allNodes = document.querySelector('#drawflow').querySelectorAll('.drawflow-node');\n allNodes.forEach(function (node) {\n node.classList.remove('current-execution');\n });\n if (!_this.currentNodeId) {\n console.log('No current node to execute.');\n return;\n }\n var currentNode = _this.graph[_this.currentNodeId];\n if (currentNode) {\n _this.isRunning = true;\n _this.visitedNodes.add(_this.currentNodeId); // Mark this node as visited\n\n var nodeElement = document.querySelector('#drawflow').querySelector(\".drawflow-node[id=\\\"node-\".concat(_this.currentNodeId, \"\\\"]\"));\n if (nodeElement) {\n nodeElement.classList.add('current-execution');\n } else {\n console.error('Node with ID ' + _this.currentNodeId + ' not found');\n }\n if (currentNode[\"class\"] === 'api') {\n var model = JSON.parse(JSON.stringify(_this.apiTester.getApiRequestModel(currentNode.data.id)));\n model.responseModel = {};\n _this.appendLog(\"===============================================================\\nExecuting API [\".concat(model.name, \"]\"));\n _this.apiClient.sendAPIRequest(model, _this.logHttpRequest.bind(_this)).then(function (response) {\n _this.isRunning = false;\n _this.logHttpResponse(response);\n if (response.status === 200 || response.status === 201) {\n nodeElement.classList.add('result-success');\n } else {\n nodeElement.classList.add('result-error');\n }\n resolve();\n })[\"catch\"](function (error) {\n nodeElement.classList.add('result-abort');\n $('.toast-body').text(error.message);\n $('.toast').toast('show');\n _this.appendLog(error.message);\n reject(error);\n });\n console.log(\"===============================================================\\nExecuting API request for node: \".concat(currentNode.id, \" - \").concat(currentNode.name));\n } else if (currentNode[\"class\"] === 'start') {\n _this.appendLog('Starting API scenario\\n');\n nodeElement.classList.add('result-success');\n resolve();\n } else {\n console.log(\"Executing script for node: \".concat(currentNode.id, \" - \").concat(currentNode.name));\n resolve();\n }\n }\n });\n }\n }, {\n key: \"appendLog\",\n value: function appendLog(text) {\n var range = new monaco_editor__WEBPACK_IMPORTED_MODULE_0__.Range(this.outputEditor.getModel().getLineCount(), 1, this.outputEditor.getModel().getLineCount(), 1);\n var id = {\n major: 1,\n minor: 1\n };\n var op = {\n identifier: id,\n range: range,\n text: text + '\\n\\n',\n forceMoveMarkers: true\n };\n this.outputEditor.executeEdits('my-source', [op]);\n }\n }, {\n key: \"logHttpRequest\",\n value: function logHttpRequest(model) {\n console.log(model);\n var log = \"[API Request]\\n\".concat(model.method, \" \").concat(model.path, \" HTTP/1.1\\n[Request Headers]\\n\").concat(this.parseRequestHeaders(model.headers), \"\\n[Request Body]\\n\").concat(model.requestBody);\n this.appendLog(log);\n }\n }, {\n key: \"logHttpResponse\",\n value: function logHttpResponse(response) {\n var log = \"[Response]\\nHTTP/1.1 \".concat(response.status, \"\\n[Response Headers]\\n\").concat(this.parseHeaders(response.headers), \"\\n[Response Body]\\n\").concat(response.body, \"\\n\");\n this.appendLog(log);\n }\n }, {\n key: \"parseRequestHeaders\",\n value: function parseRequestHeaders(headers) {\n var parsedHeaders = '';\n headers.forEach(function (header) {\n if (header.enabled) {\n parsedHeaders += \"\".concat(header.key, \": \").concat(header.value, \"\\n\");\n }\n });\n return parsedHeaders;\n }\n }, {\n key: \"parseHeaders\",\n value: function parseHeaders(headers) {\n //convert object to string with \\n separation\n //sort header by key\n\n var parsedHeaders = '';\n var sortedKeys = Object.keys(headers).sort(); // Sorting the keys alphabetically\n sortedKeys.forEach(function (key) {\n parsedHeaders += \"\".concat(key, \": \").concat(headers[key], \"\\n\");\n });\n return parsedHeaders;\n }\n\n // Method to move to the next node\n }, {\n key: \"moveToNextNode\",\n value: function moveToNextNode() {\n var _this2 = this;\n var currentNode = this.graph[this.currentNodeId];\n console.log(currentNode);\n if (currentNode && currentNode.connections.length > 0) {\n // Find the next unvisited node\n var nextNode = currentNode.connections.find(function (nodeId) {\n return !_this2.visitedNodes.has(nodeId);\n });\n if (nextNode) {\n this.currentNodeId = nextNode;\n } else {\n console.log('No more unvisited connections to move to.');\n this.currentNodeId = null; // No more nodes to visit\n }\n } else {\n console.log('Current node has no connections or does not exist.');\n this.currentNodeId = null; // No more nodes to visit\n this.isDone = true;\n }\n }\n }, {\n key: \"executeAll\",\n value: function () {\n var _executeAll = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {\n return _regeneratorRuntime().wrap(function _callee$(_context) {\n while (1) switch (_context.prev = _context.next) {\n case 0:\n if (!this.currentNodeId) {\n _context.next = 14;\n break;\n }\n console.log(this.currentNodeId);\n _context.prev = 2;\n _context.next = 5;\n return this.executeCurrentNode();\n case 5:\n _context.next = 10;\n break;\n case 7:\n _context.prev = 7;\n _context.t0 = _context[\"catch\"](2);\n console.error('Error executing node: ', _context.t0);\n // Handle error or break loop if necessary\n case 10:\n _context.next = 12;\n return this.moveToNextNodeWithDelay(250);\n case 12:\n _context.next = 0;\n break;\n case 14:\n console.log('Completed execution of all API nodes.');\n case 15:\n case \"end\":\n return _context.stop();\n }\n }, _callee, this, [[2, 7]]);\n }));\n function executeAll() {\n return _executeAll.apply(this, arguments);\n }\n return executeAll;\n }()\n }, {\n key: \"moveToNextNodeWithDelay\",\n value: function moveToNextNodeWithDelay(delay) {\n var _this3 = this;\n return new Promise(function (resolve) {\n setTimeout(function () {\n _this3.moveToNextNode();\n resolve();\n }, delay);\n });\n }\n }], [{\n key: \"extractGraphFromStart\",\n value: function extractGraphFromStart(graphData) {\n console.log(graphData);\n var graph = {};\n\n // Helper function to recursively build the graph\n function buildGraph(nodeId) {\n var node = graphData[nodeId];\n if (!node || graph[nodeId]) {\n // If the node doesn't exist or has already been visited, stop the recursion\n return;\n }\n\n // Initialize the node in the graph\n graph[nodeId] = {\n id: node.id,\n name: node.name,\n \"class\": node[\"class\"],\n data: node.data,\n connections: []\n };\n\n // If the node has outputs, recursively add connected nodes\n if (node.outputs) {\n Object.values(node.outputs).forEach(function (output) {\n output.connections.forEach(function (connection) {\n graph[nodeId].connections.push(connection.node);\n buildGraph(connection.node); // Recurse\n });\n });\n }\n }\n\n // Find the start node\n for (var nodeId in graphData) {\n if (graphData[nodeId][\"class\"] === 'start') {\n buildGraph(nodeId); // Start building the graph from the 'start' node\n break; // Assuming there's only one start node\n }\n }\n return graph;\n }\n }]);\n return APIScenarioExecutor;\n}();\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (APIScenarioExecutor);\n\n//# sourceURL=webpack://APITestManager/./src/APIScenarioExecutor.js?"); /***/ }), @@ -543,7 +543,18 @@ 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 _components_EditableInput__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./components/EditableInput */ \"./src/components/EditableInput.js\");\n/* harmony import */ var _popperjs_core_lib_popper_lite__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @popperjs/core/lib/popper-lite */ \"./node_modules/@popperjs/core/lib/popper-lite.js\");\n/* harmony import */ var _components_PropertyTable__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./components/PropertyTable */ \"./src/components/PropertyTable.js\");\n/* harmony import */ var _components_VariableSnippet__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./components/VariableSnippet */ \"./src/components/VariableSnippet.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\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: \"renderServers\",\n value: function renderServers(selectedServer) {\n var optionsHtml = this.servers.map(function (server) {\n return \"\\n \\n \");\n }).join('');\n return \"\");\n }\n }, {\n key: \"basePath\",\n value: function basePath(serverId) {\n if (serverId === undefined || serverId === null || serverId === '') {\n return '';\n }\n return this.servers.filter(function (server) {\n return server.id == serverId;\n })[0].basePath; // == : 타입 비교 없이 값만 비교\n }\n }, {\n key: \"apiRequestTemplate\",\n value: function apiRequestTemplate(apiRequest, index) {\n return \"\\n
    \\n
    \").concat(apiRequest.collectionName, \" > \").concat(apiRequest.name, \"
    \\n
    \\n
    \\n \\n \\n
    \\n
    \\n \").concat(this.renderServers(apiRequest.server), \"\\n \\n
    \\n
    \\n \\n \\n
    \\n
    \\n \\n
    \\n \\n \\n
    \\n \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n Response\\n \\n \\n \\n
    \\n \\n
    \\n
    \\n
    \\n
    \\n
    \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n
    \\uC774\\uB984\\uAC12
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n \");\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.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.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_5__.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 _this3 = this;\n console.log('renderTabContent');\n var me = this;\n var apiRequestTabContent = $(this.apiTabContentTarget);\n var model = this.apiRequests[index];\n apiRequestTabContent.append(this.apiRequestTemplate(model, index));\n var editableInput = new _components_EditableInput__WEBPACK_IMPORTED_MODULE_2__[\"default\"]({\n name: 'path',\n value: model.path\n });\n var queryParamTable = new _components_PropertyTable__WEBPACK_IMPORTED_MODULE_3__[\"default\"]({\n propertyName: 'queryParams',\n properties: model.queryParams\n });\n var headerTable = new _components_PropertyTable__WEBPACK_IMPORTED_MODULE_3__[\"default\"]({\n propertyName: 'headers',\n properties: model.headers\n });\n queryParamTable.init(apiRequestTabContent.find(\"#api_request_\".concat(model.id)).find('.query_params')[0], function (properties) {\n model.queryParams = properties;\n console.log(model.queryParams);\n _this3.buildPath(model);\n editableInput.setValue(model.path);\n $('span.variable').off('mouseover');\n $('span.variable').off('mouseout');\n document.querySelectorAll('span.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 });\n headerTable.init(apiRequestTabContent.find(\"#api_request_\".concat(model.id)).find('.request_headers')[0], function (properties) {\n model.headers = properties;\n $('span.variable').off('mouseover');\n $('span.variable').off('mouseout');\n document.querySelectorAll('span.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 });\n apiRequestTabContent.find(\"#api_request_\".concat(model.id)).find('.api_request_info').find('.path').each(function () {\n editableInput.init(this, function (value) {\n model.path = value;\n model.queryParams = me.parseParam(model.path);\n queryParamTable.setProperties(model.queryParams);\n $('span.variable').off('mouseover');\n $('span.variable').off('mouseout');\n document.querySelectorAll('span.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 });\n $(this).append(\"\");\n $('span.variable').off('mouseover');\n $('span.variable').off('mouseout');\n });\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 this.openTab(model.id);\n var target = $('#api_request_' + model.id);\n var 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 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\")[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: 'json',\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_4__[\"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_4__[\"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 _this4 = 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(_this4.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 = $('\");\n }).join('');\n return \"\");\n }\n }, {\n key: \"basePath\",\n value: function basePath(serverId) {\n if (serverId === undefined || serverId === null || serverId === '') {\n return '';\n }\n return this.servers.filter(function (server) {\n return server.id == serverId;\n })[0].basePath; // == : 타입 비교 없이 값만 비교\n }\n }, {\n key: \"apiRequestTemplate\",\n value: function apiRequestTemplate(apiRequest, index) {\n return \"\\n
    \\n
    \").concat(apiRequest.collectionName, \" > \").concat(apiRequest.name, \"
    \\n
    \\n
    \\n \\n \\n
    \\n
    \\n \").concat(this.renderServers(apiRequest.server), \"\\n \\n
    \\n
    \\n \\n \\n
    \\n
    \\n \\n
    \\n \\n \\n
    \\n
    \\n
    \\n
      \\n
    • \\n \\n
      • \\n
    • \\n \\n
      • \\n
    • \\n \\n
      • \\n
    • \\n \\n
      • \\n
    • \\n \\n
      • \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n\\n
    \\n
    \\n Response\\n \\n \\n \\n
    \\n
      \\n
    • \\n \\n
      • \\n
    • \\n \\n
      • \\n
    • \\n \\n
      • \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n
    \\uC774\\uB984\\uAC12
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n
    \\n \\n \");\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.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.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_5__.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 _this3 = this;\n var me = this;\n var apiRequestTabContent = $(this.apiTabContentTarget);\n var model = this.apiRequests[index];\n apiRequestTabContent.append(this.apiRequestTemplate(model, index));\n var editableInput = new _components_EditableInput__WEBPACK_IMPORTED_MODULE_2__[\"default\"]({\n name: 'path',\n value: model.path\n });\n var queryParamTable = new _components_PropertyTable__WEBPACK_IMPORTED_MODULE_3__[\"default\"]({\n propertyName: 'queryParams',\n properties: model.queryParams\n });\n var headerTable = new _components_PropertyTable__WEBPACK_IMPORTED_MODULE_3__[\"default\"]({\n propertyName: 'headers',\n properties: model.headers\n });\n queryParamTable.init(apiRequestTabContent.find(\"#api_request_\".concat(model.id)).find('.query_params')[0], function (properties) {\n model.queryParams = properties;\n console.log(model.queryParams);\n _this3.buildPath(model);\n editableInput.setValue(model.path);\n $('span.variable').off('mouseover');\n $('span.variable').off('mouseout');\n document.querySelectorAll('span.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 });\n headerTable.init(apiRequestTabContent.find(\"#api_request_\".concat(model.id)).find('.request_headers')[0], function (properties) {\n model.headers = properties;\n $('span.variable').off('mouseover');\n $('span.variable').off('mouseout');\n document.querySelectorAll('span.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 });\n apiRequestTabContent.find(\"#api_request_\".concat(model.id)).find('.api_request_info').find('.path').each(function () {\n editableInput.init(this, function (value) {\n model.path = value;\n model.queryParams = me.parseParam(model.path);\n queryParamTable.setProperties(model.queryParams);\n $('span.variable').off('mouseover');\n $('span.variable').off('mouseout');\n document.querySelectorAll('span.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 });\n $(this).append(\"\");\n $('span.variable').off('mouseover');\n $('span.variable').off('mouseout');\n });\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 this.openTab(model.id);\n var target = $('#api_request_' + model.id);\n var 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 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')[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: 'json',\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_4__[\"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_4__[\"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 // apiRequestTabContent.find('.resizer').each(function(index, ele) {\n // resizable(ele, () => {this.resizeEditor();});\n // });\n }\n }, {\n key: \"renderResponse\",\n value: function renderResponse(tabIndex) {\n var _this4 = 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(_this4.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 = $('