Flat Message Layout

ApiTestManager/src/components/EditableInput.js

@@ -165,7 +165,6 @@ class EditableInputController {
         if (content === '\u200B') {
             return 0; // Return 0 if the content is only the zero-width space character
         }
-        console.log(content);
         return content.replace('\u200B', '').length;
     }
 
@@ -206,10 +205,8 @@ class EditableInputController {
         const nodeStack = [element];
         let node, foundStart = false, stop = false;
         let charIndex = 0;
-        console.log('restoreCursor', position);
         while (!stop && (node = nodeStack.pop())) {
             if (node.nodeType === 3) {
-                console.log(node);
                 const nextCharIndex = charIndex + node.length;
                 if (!foundStart && position >= charIndex && position <= nextCharIndex) {
                     range.setStart(node, position - charIndex);

ApiTestManager/src/components/LayoutTreeDataGrid.js

@@ -97,7 +97,7 @@ class LayoutTreeGridController {
     this.view.addHeaders(this.options);
     this.processNode(this.model.dataRoot, 0);
     this.setupEditableFields();
-    this.callback(await this.concatenateFieldValues(this.model.dataRoot));
+    this.callback(await this.concatenateFieldValues(this.model.dataRoot), this.model.dataRoot);
   }
 
   getIndent(depth) {
@@ -161,11 +161,8 @@ class LayoutTreeGridController {
       });
 
       editableInput.init(editableElement, async (value) => {
-        console.log(editableElement.dataset.path);
-        console.log(value);
         _.set(this.model.dataRoot, editableElement.dataset.path, value);
-        console.log(this.model.dataRoot);
-        this.callback(await this.concatenateFieldValues(this.model.dataRoot));
+        this.callback(await this.concatenateFieldValues(this.model.dataRoot), this.model.dataRoot);
       });
     });
 

ApiTestManager/src/components/TCPClientView.js

@@ -49,10 +49,11 @@ class TCPClientView {
     let layoutDataRoot = replicator.createReplicatedTree(layoutRoot);
 
     let layoutTreeDataGrid = new LayoutTreeDataGrid(this.apiRequestTabContent.find(`#api_request_${this.model.id}`).find('.request_layout_data_tree'), layoutDataRoot, this.model, layoutDataTreeOptions, this.apiRequestTabContent.find(`#api_request_${this.model.id}`).find('.total_message_length'));
-    layoutTreeDataGrid.init( async (finalMessage) => {
+    layoutTreeDataGrid.init( async (finalMessage, layoutDataTree) => {
       const prefix = this.server.serverOptions ? await this.serverManager.renderServerPrefix(this.server.serverOptions, this.model) : '';
 
       this.requestBodyEditor.setValue(prefix + finalMessage);
+      this.model.layout.computedLayoutItemRoot = layoutDataTree;
     });
 
     let layoutTreeGrid = new LayoutTreeGrid(this.apiRequestTabContent.find(`#api_request_${this.model.id}`).find('.request_layout_tree'), layoutRoot, layoutDataTreeOptions, (root) => {