finishing record io

src/editor/calltree.js

@@ -36,12 +36,6 @@ export class CallTree {
         this.ui.editor.focus()
       }
 
-      /* TODO test
-      if(e.key == 'F3') {
-        this.ui.set_active_tab('logs')
-      }
-      */
-
       if(e.key == 'a') {
         if(FLAGS.embed_value_explorer) {
           exec('calltree.select_arguments')

src/editor/io_cache.js

@@ -2,8 +2,6 @@ import {header, stringify_for_header} from './value_explorer.js'
 import {el} from './domutils.js'
 import {has_error} from '../calltree.js'
 
-// TODO render grey items there were not used in run
-
 export class IO_Cache {
   constructor(ui, el) {
     this.el = el
@@ -22,15 +20,39 @@ export class IO_Cache {
     })
   }
 
-  render_io_cache(items) {
+  clear() {
     this.el.innerHTML = ''
-    for(let item of items) {
+    this.is_rendered = false
+  }
+
+  render_io_cache(state, force) {
+    if(force) {
+      this.is_rendered = false
+    }
+
+    if(this.is_rendered) {
+      return
+    }
+
+    this.is_rendered = true
+
+    this.el.innerHTML = ''
+
+    const items = state.io_cache ?? []
+    // Number of items that were used during execution
+    const used_count = state.eval_cxt.io_cache_index ?? items.length
+
+    for(let i = 0; i < items.length; i++) {
+      const item = items[i]
       if(item.type == 'resolution') {
         continue
       }
+      const is_used = i < used_count
       this.el.appendChild(
         el('div', 
-          'call_header ' + (has_error(item) ? 'error' : ''),
+          'call_header ' 
+            + (has_error(item) ? 'error ' : '') 
+            + (is_used ? '' : 'native '),
           item.name,
           '(' ,
           // TODO fn_link, like in ./calltree.js

src/editor/logs.js

@@ -22,12 +22,6 @@ export class Logs {
         this.ui.editor.focus_value_explorer(this.el)
       }
 
-      /* TODO test
-      if(e.key == 'F2') {
-        this.ui.set_active_tab('calltree')
-      }
-      */
-
       if(e.key == 'F3') {
         this.ui.editor.focus()
       }

src/editor/ui.js

@@ -217,6 +217,11 @@ export class UI {
     this.tabs[tab_id].classList.add('active')
     Object.values(this.debugger).forEach(el => el.style.display = 'none')
     this.debugger[tab_id].style.display = 'block'
+
+    if(tab_id == 'io_cache') {
+      this.io_cache.render_io_cache(get_state(), false)
+    }
+
     if(!skip_focus) {
       this.debugger[tab_id].focus()
     }
@@ -304,12 +309,16 @@ export class UI {
 
     this.calltree.render_calltree(state)
     this.logs.render_logs(null, state.logs)
+  }
 
-    // render lazily
-    // TODO
-    //if(this.active_tab == 'io_cache') {
-      this.io_cache.render_io_cache(state.io_cache)
-    //}
+  render_io_cache(state) {
+    // render lazily, only if selected
+    if(this.active_tab == 'io_cache') {
+      this.io_cache.render_io_cache(state, true)
+    } else {
+      // Do not render until user switch to the tab
+      this.io_cache.clear()
+    }
   }
 
   render_problems(problems) {