show step into when select function_call

index.html

@@ -301,6 +301,12 @@
         margin-left: 0 !important;
       }
 
+      .embed_value_explorer_control {
+        display: block;
+        margin-bottom: 1em;
+        font-size: 0.9em;
+      }
+
       .value_explorer_node {
         margin-left: 1em;
       }

src/cmd.js

@@ -475,6 +475,7 @@ const eval_selection = (state, index, is_expand) => {
     selection_state,
     value_explorer: selection_state.ok
       ? {
+          node: selection_state.node,
           index: selection_state.node.index,
           length: selection_state.node.length,
           result,

src/editor/editor.js

@@ -224,7 +224,7 @@ export class Editor {
     }
   }
 
-  embed_value_explorer({index, length, result: {ok, value, error}}) {
+  embed_value_explorer({node, index, length, result: {ok, value, error}}) {
     this.unembed_value_explorer()
 
     const session = this.ace_editor.getSession()
@@ -262,6 +262,14 @@ export class Editor {
       }
     })
 
+    if(node != null && node.type == 'function_call') {
+      content.append(el('a', {
+        href: 'javascript: void(0)',
+        'class': 'embed_value_explorer_control',
+        click: () => exec('step_into', index),
+      }, 'Step into call (Enter)'))
+    }
+
     let is_dom_el
 
     if(ok) {
@@ -305,14 +313,15 @@ export class Editor {
     }
 
     const widget = this.widget = {
-       row: is_dom_el
-        ? session.doc.indexToPosition(index + length).row
-        : session.doc.indexToPosition(index).row,
-       fixedWidth: true,
-       el: container,
-       content,
-       is_dom_el,
-     }
+      node,
+      row: is_dom_el
+       ? session.doc.indexToPosition(index + length).row
+       : session.doc.indexToPosition(index).row,
+      fixedWidth: true,
+      el: container,
+      content,
+      is_dom_el,
+    }
 
 
     if (!session.widgetManager) {
@@ -361,6 +370,16 @@ export class Editor {
   init_keyboard(){
     this.set_keyboard_handler(localStorage.keyboard)
 
+    // Intercept Enter to execute step_into if function_call selected
+    this.ace_editor.keyBinding.addKeyboardHandler(($data, hashId, keyString, keyCode, e) => {
+      if(keyString == 'return') {
+        if(this.widget?.node?.type == 'function_call') {
+          exec('step_into', this.widget.node.index)
+          return {command: "null"} // to stop other handlers
+        }
+      }
+    })
+
     const VimApi = require("ace/keyboard/vim").CodeMirror.Vim
 
     // Remove commands binded to function keys that we are going to redefine

src/editor/value_explorer.js

@@ -175,13 +175,8 @@ export class ValueExplorer {
     this.toggle_expanded()
   }
 
-  clear() {
-    this.container.innerHTML = ''
-    this.node_data = {is_expanded: true}
-  }
-
   render(value) {
-    this.clear()
+    this.node_data = {is_expanded: true}
     this.value = value
     const path = []
     this.container.appendChild(this.render_value_explorer_node(null, value, path, this.node_data))