Show HN: Visualize Data Structures in VS Code

Re:Show HN: Visualize Data Structures in VS Code by Gehinnn on Friday August 28, 2020 @05:36PM (#24310268)

Data Extractors usually need support from the extension. But you can configure how to construct the expression that is sent to the debugger to be evaluated. By default, it is `x => x`, but you could do `x => extract_json(x)`.

[ Parent | on HN ]

Re:Show HN: Visualize Data Structures in VS Code by daviding on Friday August 28, 2020 @05:57PM (#24310540)

Thanks, that works. I can put something simple in my settings.json like this

  "debugVisualizer.debugAdapterConfigurations": {
    "Ruby": {
      "expressionTemplate": "DataExtractor.to_table(${expr})",
    }
   },

..and something simple in the debugee like this..

  table_example = 
    {"id"=> "1", "label"=> "One"},
    {"id"=> "2", "label"=> "Two"},
    {"id"=> "3", "label"=> "Three"}
  
  # Quick hash to visual table helper
  class DataExtractor
    def self.to_table(hash)
      meta_hash = {
        "kind" => {"table"=> true},
        "rows"=> hash
      }
      meta_hash.to_json
    end
  end

..and we get a decent hash or ActiveRecord visualizer. Thanks for the hint.

[ Parent | on HN ]

Re:Show HN: Visualize Data Structures in VS Code by Gehinnn on Friday August 28, 2020 @06:15PM (#24310797)

Data Extractors would also allow to offer alternative extraction options (like how visualization data should be constructed from the given value). The user can then select an alternative data extractor.

The `expressionTemplate` does not allow to do that yet.

If somebody is interested in implementing data extractors for Ruby, I can offer help!

[ Parent | on HN ]

Re:Show HN: Visualize Data Structures in VS Code by jonnytran on Friday August 28, 2020 @07:36PM (#24311655)

Can you point us to where the existing extractors are implemented in the codebase?

[ Parent | on HN ]

Re:Show HN: Visualize Data Structures in VS Code by Gehinnn on Friday August 28, 2020 @07:46PM (#24311737)

In case of javascript, the data extractor runtime is injected into the debuggee at [1]. You can find the data extractor runtime implementation at [2].

[1] https://github.com/hediet/vscode-debug-visualizer/blob/c420f... [2] https://github.com/hediet/vscode-debug-visualizer/blob/maste...

[ Parent | on HN ]