Some fixes in undo/redo a transform action (WIP)

src/js/History.js

@@ -120,7 +120,7 @@ function History (editor) {
       }
     },
 
-    'transform': {
+    'sort': {
       'undo': function (params) {
         var node = params.node;
         node.hideChilds();
@@ -135,6 +135,21 @@ function History (editor) {
         node.updateDom({updateIndexes: true});
         node.showChilds();
       }
+    },
+
+    'transform': {
+      'undo': function (params) {
+        var node = params.node;
+        node.setValue(params.oldValue);
+
+        // TODO: would be nice to restore the state of the node and childs
+      },
+      'redo': function (params) {
+        var node = params.node;
+        node.setValue(params.newValue);
+
+        // TODO: would be nice to restore the state of the node and childs
+      }
     }
 
     // TODO: restore the original caret position and selection with each undo

src/js/Node.js

@@ -685,10 +685,10 @@ Node.prototype.appendChild = function(node, visible, updateDom) {
     if (this.expanded && visible !== false) {
       // insert into the DOM, before the appendRow
       var newTr = node.getDom();
-      var appendTr = this.getAppendDom();
+      var nextTr = this._getNextTr();
-      var table = appendTr ? appendTr.parentNode : undefined;
+      var table = nextTr ? nextTr.parentNode : undefined;
-      if (appendTr && table) {
+      if (nextTr && table) {
-        table.insertBefore(newTr, appendTr);
+        table.insertBefore(newTr, nextTr);
       }
 
       node.showChilds();
@@ -3119,7 +3119,7 @@ Node.prototype.sort = function (path, direction) {
   // update the index numbering
   this._updateDomIndexes();
 
-  this.editor._onAction('transform', {
+  this.editor._onAction('sort', {
     node: this,
     oldChilds: oldChilds,
     newChilds: this.childs
@@ -3146,14 +3146,18 @@ Node.prototype.transform = function (query) {
 
   try {
     // apply the JMESPath query
-    var transformed = jmespath.search(this.getValue(), query);
+    var oldValue = this.getValue();
+    var newValue = jmespath.search(oldValue, query);
 
-    this.setValue(transformed);
+    this.setValue(newValue);
 
     this.editor._onAction('transform', {
       node: this,
+      oldValue: oldValue,
+      newValue: newValue,
       oldChilds: oldChilds,
       newChilds: this.childs
+      // TODO: use oldChilds/newChilds in history or clean it up
     });
 
     this.showChilds();

src/js/showTransformModal.js

@@ -25,7 +25,7 @@ function showTransformModal (node, container) {
       '<tr>' +
       '  <td>' + translate('transformQueryLabel') + ' </td>' +
       '  <td class="jsoneditor-modal-input">' +
-      '    <input id="query" type="text" title="' + translate('transformQueryTitle') + '" value="[*]"/>' +
+      '    <input id="query" type="text" title="' + translate('transformQueryTitle') + '" value=""/>' +
       '  </td>' +
       '</tr>' +
       '<tr>' +
@@ -59,6 +59,8 @@ function showTransformModal (node, container) {
         var query = modal.modalElem().querySelector('#query');
         var preview = modal.modalElem().querySelector('#preview');
 
+        query.value = Array.isArray(value) ? '[*]' : '@';
+
         function updatePreview() {
           try {
             var transformed = jmespath.search(value, query.value);