tanhauhau/svelte-json-tree

Display differs from Svelte REPL console

techniq opened this issue · 3 comments

techniq commented

When I try to display the output of a d3-hierarchy structure using svelte-json-tree, I only see Iterable in the display (1), but using console.log(), I see the desired output (2).

image

When I looked at the Svelte REPL ConsoleLine.svelte, I didn't see any special handling, so I'm a little perplex why the output diffs (and how to accomplish the same outside of the REPL).

Here is an example REPL.

Thanks for any guidance!

tanhauhau commented

the d3.hierarchy is an iterable, that's why it is render as an iterable. the reason why it looks different in Svelte REPL, is because the data got serialised and deserialised through window.postMessage (the repl output code is run inside and iframe, but the console is on the main window, so the console data is sent from the iframe out to the main window via window.postMessage)

tanhauhau commented

i've published v2.2.0 that allows you to treat iterable as normal object

techniq commented

@tanhauhau Perfect! Thanks for the explanation and quick turnaround.

It allowed me to add a much nicer "View data" experience on all the hierarchy LayerChart examples

Before After
image image