diff --git a/index.html b/index.html
index 9b4b860..673617a 100644
--- a/index.html
+++ b/index.html
@@ -175,6 +175,10 @@
cursor: pointer;
display: inline-block;
}
+ .call_el .expand_icon {
+ padding-left: 5px;
+ padding-right: 2px;
+ }
.call_header {
white-space: nowrap;
}
diff --git a/src/calltree.js b/src/calltree.js
index afe7442..24b8dd9 100644
--- a/src/calltree.js
+++ b/src/calltree.js
@@ -551,7 +551,12 @@ export const toggle_expanded = (state, is_exp) => {
)
}
-const click = (state, id) => {
+const select_node = (state, id) => {
+ const node = find_node(state.calltree, n => n.id == id)
+ return jump_calltree_node(state, node)
+}
+
+const select_and_toggle_expanded = (state, id) => {
const node = find_node(state.calltree, n => n.id == id)
const nextstate = jump_calltree_node(state, node)
if(is_expandable(node)) {
@@ -950,7 +955,8 @@ export const calltree_commands = {
arrow_up,
arrow_left,
arrow_right,
- click,
+ select_node,
+ select_and_toggle_expanded,
select_return_value,
select_arguments,
select_error,
diff --git a/src/editor/calltree.js b/src/editor/calltree.js
index 35ed408..dd68f9d 100644
--- a/src/editor/calltree.js
+++ b/src/editor/calltree.js
@@ -67,8 +67,12 @@ export class CallTree {
}
- on_click_node(id) {
- exec('calltree.click', id)
+ on_click_node(ev, id) {
+ if(ev.target.classList.contains('expand_icon')) {
+ exec('calltree.select_and_toggle_expanded', id)
+ } else {
+ exec('calltree.select_node', id)
+ }
}
clear_calltree(){
@@ -83,11 +87,11 @@ export class CallTree {
const result = el('div', 'callnode',
el('div', {
'class': 'call_el',
- click: () => this.on_click_node(n.id),
+ click: e => this.on_click_node(e, n.id),
},
!is_expandable(n)
? '\xa0'
- : is_expanded ? '▼' : '▶',
+ : el('span', 'expand_icon', is_expanded ? '▼' : '▶'),
n.toplevel
? el('span', '',
el('i', '',
diff --git a/test/test.js b/test/test.js
index c7d89bd..f743450 100644
--- a/test/test.js
+++ b/test/test.js
@@ -1761,7 +1761,7 @@ export const tests = [
)
const x_call = root_calltree_node(initial).children[0]
- const step_into = COMMANDS.calltree.click(initial, x_call.id)
+ const step_into = COMMANDS.calltree.select_and_toggle_expanded(initial, x_call.id)
assert_equal(
color_file(step_into, '').sort((a,b) => a.index - b.index),
[
@@ -1815,7 +1815,7 @@ export const tests = [
x()`
const initial = test_initial_state(code)
const x_call = root_calltree_node(initial).children[0]
- const step_into = COMMANDS.calltree.click(initial, x_call.id)
+ const step_into = COMMANDS.calltree.select_and_toggle_expanded(initial, x_call.id)
assert_equal(
color_file(step_into, '').sort((c1, c2) => c1.index - c2.index),
@@ -1979,7 +1979,7 @@ const y = x()`
x(2);
`)
- const s2 = COMMANDS.calltree.click(
+ const s2 = COMMANDS.calltree.select_and_toggle_expanded(
s,
root_calltree_node(s).children[0].id,
)
@@ -2161,7 +2161,7 @@ const y = x()`
`)
const first = root_calltree_node(s).children[0]
assert_equal(first.value, 10)
- const s2 = COMMANDS.calltree.click(s, first.id)
+ const s2 = COMMANDS.calltree.select_and_toggle_expanded(s, first.id)
const first2 = root_calltree_node(s2).children[0]
assert_equal(first2.children[0].value, 9)
assert_equal(first2.code, first2.children[0].code)
@@ -2176,7 +2176,7 @@ const y = x()`
`
const s = test_initial_state(code)
const new_call = root_calltree_node(s).children.at(-1)
- const expanded_new_call = COMMANDS.calltree.click(s, new_call.id)
+ const expanded_new_call = COMMANDS.calltree.select_and_toggle_expanded(s, new_call.id)
const x_call = root_calltree_node(expanded_new_call)
.children.at(-1)
.children[0]
@@ -2186,7 +2186,7 @@ const y = x()`
test('expand_calltree_node native', () => {
const s = test_initial_state(`[1,2,3].map(x => x + 1)`)
const map = root_calltree_node(s).children[0]
- const s2 = COMMANDS.calltree.click(s, map.id)
+ const s2 = COMMANDS.calltree.select_and_toggle_expanded(s, map.id)
const map_expanded = root_calltree_node(s2).children[0]
assert_equal(map_expanded.children.length, 3)
}),
@@ -2198,7 +2198,7 @@ const y = x()`
foo(1, {y: 2})
`)
- const expanded = COMMANDS.calltree.click(i, root_calltree_node(i).children[0].id)
+ const expanded = COMMANDS.calltree.select_and_toggle_expanded(i, root_calltree_node(i).children[0].id)
const args = expanded.value_explorer.result.value['*arguments*']
assert_equal(args, {value: {x: 1, y: 2}})
}),
@@ -2207,7 +2207,7 @@ const y = x()`
const s = test_initial_state(`Object.fromEntries([])`)
const index = 0 // Where call starts
const call = root_calltree_node(s).children[0]
- const state = COMMANDS.calltree.click(s, call.id)
+ const state = COMMANDS.calltree.select_and_toggle_expanded(s, call.id)
assert_equal(current_cursor_position(state), index)
assert_equal(
state.value_explorer,
@@ -2291,7 +2291,7 @@ const y = x()`
`
const s = test_initial_state(code)
const call_fn = root_calltree_node(s).children[0].children[0]
- const s2 = COMMANDS.calltree.click(s, call_fn.id)
+ const s2 = COMMANDS.calltree.select_and_toggle_expanded(s, call_fn.id)
const good = s2.current_calltree_node.children[0]
assert_equal(good.code.index, code.indexOf('() => {/*good'))
}),
@@ -3200,7 +3200,7 @@ const y = x()`
const i = test_initial_state(code, code.indexOf('label'))
assert_equal(i.active_calltree_node.args[0], 1)
// select second call
- const second = COMMANDS.calltree.click(i, root_calltree_node(i).children[1].id)
+ const second = COMMANDS.calltree.select_and_toggle_expanded(i, root_calltree_node(i).children[1].id)
assert_equal(second.active_calltree_node.args[0], 2)
}),
@@ -3220,7 +3220,7 @@ const y = x()`
const i = test_initial_state(code)
const first_call_id = root_calltree_node(i).children[0].id
// explicitly select first call
- const selected = COMMANDS.calltree.click(i, first_call_id)
+ const selected = COMMANDS.calltree.select_and_toggle_expanded(i, first_call_id)
// implicitly select second call by moving cursor
const moved = COMMANDS.move_cursor(selected, code.indexOf('false'))
const finish = COMMANDS.move_cursor(moved, code.indexOf('finish'))
@@ -3265,7 +3265,7 @@ const y = x()`
assert_equal(call.value, 2)
// Expand call
- const expanded = COMMANDS.calltree.click(state, call.id)
+ const expanded = COMMANDS.calltree.select_and_toggle_expanded(state, call.id)
const moved = COMMANDS.move_cursor(expanded, code.indexOf('return arg'))
assert_equal(moved.active_calltree_node.value, 2)
}),
@@ -3394,7 +3394,7 @@ const y = x()`
assert_equal(call.args, [10])
// Expand call
- const expanded = COMMANDS.calltree.click(state, call.id)
+ const expanded = COMMANDS.calltree.select_and_toggle_expanded(state, call.id)
assert_equal(get_deferred_calls(expanded)[0].children[0].fn.name, 'fn2')
// Navigate logs
@@ -3568,7 +3568,7 @@ const y = x()`
const state = on_deferred_call(i)
const call = get_deferred_calls(state)[0]
- const expanded = COMMANDS.calltree.click(state, call.id)
+ const expanded = COMMANDS.calltree.select_and_toggle_expanded(state, call.id)
// Make deferred call again. There was a runtime error
expanded.modules[''].fn(10)
}),
@@ -4417,7 +4417,7 @@ const y = x()`
const i = test_initial_state(code)
const second_foo_call = root_calltree_node(i).children[1]
assert_equal(second_foo_call.has_more_children, true)
- const expanded = COMMANDS.calltree.click(i, second_foo_call.id)
+ const expanded = COMMANDS.calltree.select_and_toggle_expanded(i, second_foo_call.id)
const bar_call = root_calltree_node(expanded).children[1].children[0]
assert_equal(bar_call.fn.name, 'bar')
assert_equal(bar_call.args, [11])
@@ -4445,7 +4445,7 @@ const y = x()`
const i = test_initial_state(code)
const second_deep_call = root_calltree_node(i).children[1]
assert_equal(second_deep_call.has_more_children, true)
- const expanded = COMMANDS.calltree.click(i, second_deep_call.id)
+ const expanded = COMMANDS.calltree.select_and_toggle_expanded(i, second_deep_call.id)
const moved = COMMANDS.move_cursor(expanded, code.indexOf('y /*y*/'))
assert_equal(moved.value_explorer.result.value, 11)
}),
@@ -4469,7 +4469,7 @@ const y = x()`
const i = test_initial_state(code)
const second_x_call = root_calltree_node(i).children[1]
assert_equal(second_x_call.has_more_children, true)
- const expanded = COMMANDS.calltree.click(i, second_x_call.id)
+ const expanded = COMMANDS.calltree.select_and_toggle_expanded(i, second_x_call.id)
const moved = COMMANDS.move_cursor(expanded, code.indexOf('y /*result*/'))
assert_equal(moved.value_explorer.result.value, 1)
}),
@@ -4494,11 +4494,11 @@ const y = x()`
const i = test_initial_state(code, code.indexOf('holder.get'))
assert_equal(i.value_explorer.result.value, 9)
- const map_expanded = COMMANDS.calltree.click(
+ const map_expanded = COMMANDS.calltree.select_and_toggle_expanded(
i,
root_calltree_node(i).children[2].id
)
- const expanded = COMMANDS.calltree.click(
+ const expanded = COMMANDS.calltree.select_and_toggle_expanded(
map_expanded,
root_calltree_node(map_expanded).children[2].children[5].id
)
@@ -4689,7 +4689,7 @@ const y = x()`
// `
// const i = test_initial_state(code)
// const second_y_call = root_calltree_node(i).children[0].children[1]
- // const selected = COMMANDS.calltree.click(i, second_y_call.id)
+ // const selected = COMMANDS.calltree.select_and_toggle_expanded(i, second_y_call.id)
// const moved = COMMANDS.move_cursor(selected, code.indexOf('x /*x*/'))
// assert_equal(moved.value_explorer.result.value, 1)
// }),
@@ -4737,7 +4737,7 @@ const y = x()`
const i = test_initial_state(code)
const second_map_call = i.calltree.children[0].children[1]
assert_equal(second_map_call.has_more_children, true)
- const expanded = COMMANDS.calltree.click(i, second_map_call.id)
+ const expanded = COMMANDS.calltree.select_and_toggle_expanded(i, second_map_call.id)
const second_map_call_exp = expanded.calltree.children[0].children[1]
assert_equal(second_map_call.id == second_map_call_exp.id, true)
assert_equal(second_map_call_exp.children[0].id == second_map_call_exp.id + 1, true)
@@ -4763,14 +4763,14 @@ const y = x()`
const test_call = root_calltree_node(i).children[1]
assert_equal(test_call.has_more_children , true)
- const expanded = COMMANDS.calltree.click(i, test_call.id)
+ const expanded = COMMANDS.calltree.select_and_toggle_expanded(i, test_call.id)
const test2_call = root_calltree_node(expanded).children[1].children[0]
assert_equal(test2_call.has_more_children, true)
- const expanded2 = COMMANDS.calltree.click(expanded, test2_call.id)
+ const expanded2 = COMMANDS.calltree.select_and_toggle_expanded(expanded, test2_call.id)
const foo_call = root_calltree_node(expanded2).children[1].children[0].children[0]
- const expanded3 = COMMANDS.calltree.click(expanded2, foo_call.id)
+ const expanded3 = COMMANDS.calltree.select_and_toggle_expanded(expanded2, foo_call.id)
const moved = COMMANDS.move_cursor(expanded3, code.indexOf('x /*x*/'))
assert_equal(moved.value_explorer.result.value, 1)
@@ -4803,7 +4803,7 @@ const y = x()`
// first arrow rights selects do_inc call, second steps into it
const expanded = COMMANDS.calltree.arrow_right(
COMMANDS.calltree.arrow_right(
- COMMANDS.calltree.click(state, call.id)
+ COMMANDS.calltree.select_and_toggle_expanded(state, call.id)
)
)
// Move cursor
@@ -4836,7 +4836,7 @@ const y = x()`
const second_set_call = root_calltree_node(i).children[1]
assert_equal(second_set_call.has_more_children, true)
- const exp = COMMANDS.calltree.click(i, second_set_call.id)
+ const exp = COMMANDS.calltree.select_and_toggle_expanded(i, second_set_call.id)
assert_equal(exp.modules[''].get(), 3)
}),
@@ -5175,7 +5175,7 @@ const y = x()`
}
sort(array)
`)
- const selected = COMMANDS.calltree.click(i, root_calltree_node(i).children[0].id)
+ const selected = COMMANDS.calltree.select_and_toggle_expanded(i, root_calltree_node(i).children[0].id)
const args = selected.value_explorer.result.value['*arguments*']
assert_versioned_value(i, args, {array: [3,2,1]})
@@ -5268,7 +5268,7 @@ const y = x()`
const i = test_initial_state(code)
const second_foo_call = root_calltree_node(i).children[1]
assert_equal(second_foo_call.has_more_children, true)
- const expanded = COMMANDS.calltree.click(i, second_foo_call.id)
+ const expanded = COMMANDS.calltree.select_and_toggle_expanded(i, second_foo_call.id)
const bar_call = root_calltree_node(expanded).children[1].children[0]
assert_equal(bar_call.fn.name, 'bar')
const moved = COMMANDS.move_cursor(expanded, code.indexOf('y /*y*/'))
@@ -5296,14 +5296,14 @@ const y = x()`
const test_call = root_calltree_node(i).children[1]
assert_equal(test_call.has_more_children , true)
- const expanded = COMMANDS.calltree.click(i, test_call.id)
+ const expanded = COMMANDS.calltree.select_and_toggle_expanded(i, test_call.id)
const test2_call = root_calltree_node(expanded).children[1].children[0]
assert_equal(test2_call.has_more_children, true)
- const expanded2 = COMMANDS.calltree.click(expanded, test2_call.id)
+ const expanded2 = COMMANDS.calltree.select_and_toggle_expanded(expanded, test2_call.id)
const foo_call = root_calltree_node(expanded2).children[1].children[0].children[0]
- const expanded3 = COMMANDS.calltree.click(expanded2, foo_call.id)
+ const expanded3 = COMMANDS.calltree.select_and_toggle_expanded(expanded2, foo_call.id)
const moved = COMMANDS.move_cursor(expanded3, code.indexOf('x /*x*/'))
assert_equal(moved.value_explorer.result.value, {value: 1 })