v2.0.6

.vscode/launch.json

@@ -47,7 +47,7 @@
 			"runtimeExecutable": "${execPath}",
 			"args": [
 				"--extensionDevelopmentPath=${workspaceFolder}/extension",
-				"${workspaceFolder}/demos/python"
+				"${workspaceFolder}/demos/js"
 			],
 			"env": {
 				"HOT_RELOAD": "",

data-extraction/src/js/api/default-extractors/GridExtractor.ts

@@ -24,7 +24,7 @@ export class GridExtractor implements DataExtractor {
 			extractData: () =>
 				expect<GridVisualizationData>({
 					kind: { grid: true },
-					rows: [{ columns: data.map(d => ({ tag: d })) }],
+					rows: [{ columns: data.map(d => ({ tag: "" + d })) }],
 				}),
 		});
 	}

data-extraction/src/js/api/default-extractors/TableExtractor.ts

@@ -0,0 +1,38 @@
+import { isAssertionExpression } from "typescript";
+import { DataExtractor, ExtractionCollector, DataExtractorContext } from "..";
+import { TableVisualizationData } from "../../../CommonDataTypes";
+import { expect } from "../../../util";
+
+function assert<T>(value: unknown): asserts value {}
+
+export class TableDataExtractor implements DataExtractor {
+	readonly id = "table";
+
+	getExtractions(
+		data: unknown,
+		collector: ExtractionCollector,
+		context: DataExtractorContext
+	): void {
+		if (!Array.isArray(data)) {
+			return;
+		}
+		if (!data.every(d => typeof d === "object" && d)) {
+			return;
+		}
+		assert<object[]>(data);
+
+		collector.addExtraction({
+			id: "table",
+			name: "Table",
+			priority: 1000,
+			extractData() {
+				return expect<TableVisualizationData>({
+					kind: {
+						table: true,
+					},
+					rows: data,
+				});
+			},
+		});
+	}
+}

data-extraction/src/js/api/default-extractors/TypeScriptDataExtractors.ts

@@ -107,6 +107,7 @@ export class TypeScriptAstDataExtractor implements DataExtractor {
 					root: helper.toTreeNode(
 						rootNode || finalRootSourceFile,
 						"root",
+						"",
 						marked,
 						fn
 					),
@@ -121,19 +122,24 @@ export class TypeScriptAstDataExtractor implements DataExtractor {
 class Helper {
 	constructor(private readonly tsApi: typeof ts) {}
 
-	findKey(value: any, object: any): string | null {
-		for (var key in object) {
-			if (key.startsWith("_")) continue;
+	getPropertyNameInParent(value: any, parent: any): string | undefined {
+		for (const propertyName in parent) {
+			if (propertyName.startsWith("_")) continue;
 
-			var member = object[key];
-			if (member === value) return key;
+			const member = parent[propertyName];
+			if (member === value) {
+				return propertyName;
+			}
 
-			if (Array.isArray(member) && member.indexOf(value) !== -1) {
-				return key;
+			if (Array.isArray(member)) {
+				const index = member.indexOf(value);
+				if (index !== -1) {
+					return `${propertyName}[${index}]`;
+				}
 			}
 		}
 
-		return null;
+		return undefined;
 	}
 
 	getChildren(node: ts.Node): ts.Node[] {
@@ -147,30 +153,38 @@ class Helper {
 	toTreeNode(
 		node: ts.Node,
 		memberName: string,
+		segmentName: string,
 		marked: Set<ts.Node>,
 		emphasizedValueFn: (node: ts.Node) => string | undefined
 	): AstTreeNode {
 		const name = this.tsApi.SyntaxKind[node.kind];
 		const children = this.getChildren(node)
 			.map((childNode, idx) => {
-				let parentPropertyName = this.findKey(childNode, node) || "";
+				let parentPropertyName =
+					this.getPropertyNameInParent(childNode, node) || "";
+
 				if (childNode.kind == this.tsApi.SyntaxKind.SyntaxList) {
 					const children = this.getChildren(childNode);
-					children.some(c => {
-						parentPropertyName = this.findKey(c, node) || "";
-						return !!parentPropertyName;
-					});
-
-					if (children.length === 0) return null!;
+					for (const c of children) {
+						const name =
+							this.getPropertyNameInParent(c, node) || "";
+						if (name) {
+							parentPropertyName = name;
+							break;
+						}
+					}
 				}
 
+				let segmentName = "." + parentPropertyName;
 				if (node.kind == this.tsApi.SyntaxKind.SyntaxList) {
 					parentPropertyName = "" + idx;
+					segmentName = `[${idx}]`;
 				}
 
 				return this.toTreeNode(
 					childNode,
 					parentPropertyName,
+					segmentName,
 					marked,
 					emphasizedValueFn
 				);
@@ -201,6 +215,7 @@ class Helper {
 		return {
 			items,
 			children: children,
+			segment: segmentName,
 			span: {
 				length: node.end - node.pos,
 				start: node.pos,

data-extraction/src/js/api/default-extractors/registerDefaultDataExtractors.ts

@@ -7,6 +7,7 @@ import { PlotlyDataExtractor } from "./PlotlyDataExtractor";
 import { ObjectGraphExtractor } from "./ObjectGraphExtractor";
 import { getDataExtractorApi } from "../injection";
 import { GridExtractor } from "./GridExtractor";
+import { TableDataExtractor } from "./TableExtractor";
 
 /**
  * The default data extractors should be registered by VS Code automatically.
@@ -23,6 +24,7 @@ export function registerDefaultExtractors(
 		new PlotlyDataExtractor(),
 		new ObjectGraphExtractor(),
 		new GridExtractor(),
+		new TableDataExtractor(),
 	]) {
 		api.registerExtractor(item);
 	}

demos/js/src/demo_typescript-asts.ts

@@ -18,6 +18,7 @@ class Main {
 class Test1 {
 	public foo(a: number) {
 		const x = { a: 5 };
+		const y = { a: 5 };
 	}
 }
 `,

extension/CHANGELOG.md

@@ -1,5 +1,13 @@
 # Change Log
 
+## 2.0.6
+
+-   Fixes grid extractor bug
+-   Fixes Perspective.js bug
+-   Fixes AST visualizer bug
+-   Adds table data extractor
+-   Improves typescript data extractor
+
 ## 2.0.0
 
 -   Support for the new JS debug adapters

extension/package.json

@@ -4,7 +4,7 @@
 	"displayName": "Debug Visualizer",
 	"description": "A visual watch window that lets you visualize your data structures while debugging.",
 	"icon": "docs/logo.drawio.png",
-	"version": "2.0.4",
+	"version": "2.0.6",
 	"license": "GPL-3.0",
 	"engines": {
 		"vscode": "^1.46.0"

webview/package.json

@@ -20,8 +20,8 @@
 		"react-dom": "^16.12.0",
 		"react-measure": "^2.3.0",
 		"@hediet/debug-visualizer-data-extraction": "*",
-		"@hediet/visualization-bundle": "^0.1.4",
-		"@hediet/visualization-core": "^0.1.0",
+		"@hediet/visualization-bundle": "^0.1.6",
+		"@hediet/visualization-core": "^0.1.1",
 		"@knuddels/mobx-logger": "^1.1.1",
 		"less-loader": "^6.2.0"
 	},

yarn.lock

@@ -507,11 +507,6 @@
     stack-trace "^0.0.10"
     ws "^7.0.0"
 
-"@hediet/semantic-json@^0.3.11":
-  version "0.3.11"
-  resolved "https://registry.yarnpkg.com/@hediet/semantic-json/-/semantic-json-0.3.11.tgz#9420a89d30645ba333dfd4f3f2c120f973297ee2"
-  integrity sha512-KKw6ZcYHiyfhanNmln/WlG4KvZnMi/Ojy8O6HB6sqfDC5XCcNYjccUMMtaX23F/Hox0dWJPFqXYs54KJAA5itg==
-
 "@hediet/semantic-json@^0.3.14":
   version "0.3.14"
   resolved "https://registry.yarnpkg.com/@hediet/semantic-json/-/semantic-json-0.3.14.tgz#876bd5c4b646c134641ad17e9ef352595fb163e7"
@@ -555,10 +550,10 @@
     "@hediet/std" "^0.6.0"
     io-ts "^1.8.6"
 
-"@hediet/visualization-bundle@^0.1.4":
-  version "0.1.4"
-  resolved "https://registry.yarnpkg.com/@hediet/visualization-bundle/-/visualization-bundle-0.1.4.tgz#ddaba4818501b8ca6a0cdd355afeb02bfb4dc731"
-  integrity sha512-FPR9zhyEDlYMk9vscWgEe9B2NQzvFxjc85tjDUR9GZbr42RtLTMd0Xyf0AlSl+plV98mD1XERWowagHqleU7Xg==
+"@hediet/visualization-bundle@^0.1.6":
+  version "0.1.6"
+  resolved "https://registry.yarnpkg.com/@hediet/visualization-bundle/-/visualization-bundle-0.1.6.tgz#a8ab11be910a30d0d26a88044caf11cab4a60f98"
+  integrity sha512-IQZDORYlRTojBwJUIADpg4NRxCqK6Q+bl1H2IP7Bq28wdwsRtuERB2UcGPufn00NGhJbOw6FAH2e1zwsQAkboQ==
   dependencies:
     "@finos/perspective-viewer" "^0.5.2"
     "@finos/perspective-viewer-d3fc" "^0.5.2"
@@ -581,12 +576,12 @@
     vis-network "^8.0.0"
     viz.js "^2.1.2"
 
-"@hediet/visualization-core@^0.1.0":
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/@hediet/visualization-core/-/visualization-core-0.1.0.tgz#f23706cbc6a9ffd411c300767077ca4c0c494c15"
-  integrity sha512-v7aZnyJ0ax09x6mBqhVaJQVwos1X7nyEfymr85/wbvLuleDjisKUuLHBxGpmWYSBRFMZUKIHllaY48DEHjP8Ug==
+"@hediet/visualization-core@^0.1.1":
+  version "0.1.1"
+  resolved "https://registry.yarnpkg.com/@hediet/visualization-core/-/visualization-core-0.1.1.tgz#240b96ac48e24b7ae81f2b0360cebd57091eb600"
+  integrity sha512-2WNP75TZg87bejt5XB+11jzbAoJ5EGbVrW+srSHRjUSdezZQ53x16E4XVV/q9W6HD6okTuz7wGjDrapNzK1EMw==
   dependencies:
-    "@hediet/semantic-json" "^0.3.11"
+    "@hediet/semantic-json" "^0.3.14"
     "@hediet/std" "^0.6.0"
     react "^16.12.0"
     react-dom "^16.12.0"