More work on diffs

Author: aeisenberg

extensions/ql-vscode/gulpfile.js/webpack.config.ts

@@ -5,7 +5,7 @@ export const config: webpack.Configuration = {
   mode: 'development',
   entry: {
     resultsView: './src/view/results.tsx',
-    compareView: './src/compare/view/compare.tsx',
+    compareView: './src/compare/view/Compare.tsx',
   },
   output: {
     path: path.resolve(__dirname, '..', 'out'),

extensions/ql-vscode/src/compare/compare-interface.ts

@@ -1,15 +1,30 @@
 import { DisposableObject } from "semmle-vscode-utils";
-import { WebviewPanel, ExtensionContext, window as Window, ViewColumn, Uri } from "vscode";
-import * as path from 'path';
+import {
+  WebviewPanel,
+  ExtensionContext,
+  window as Window,
+  ViewColumn,
+  Uri,
+} from "vscode";
+import * as path from "path";
 
 import { tmpDir } from "../run-queries";
 import { CompletedQuery } from "../query-results";
-import { CompareViewMessage } from "../interface-types";
+import {
+  FromCompareViewMessage,
+  ToCompareViewMessage,
+  QueryCompareResult,
+} from "../interface-types";
 import { Logger } from "../logging";
 import { CodeQLCliServer } from "../cli";
 import { DatabaseManager } from "../databases";
-import { getHtmlForWebview, WebviewReveal } from "../webview-utils";
-import { showAndLogErrorMessage } from "../helpers";
+import {
+  getHtmlForWebview,
+  jumpToLocation,
+} from "../webview-utils";
+import { adaptSchema, adaptBqrs, RawResultSet } from "../adapt";
+import { BQRSInfo } from "../bqrs-cli-types";
+import resultsDiff from "./resultsDiff";
 
 interface ComparePair {
   from: CompletedQuery;
@@ -19,6 +34,8 @@ interface ComparePair {
 export class CompareInterfaceManager extends DisposableObject {
   private comparePair: ComparePair | undefined;
   private panel: WebviewPanel | undefined;
+  private panelLoaded = false;
+  private panelLoadedCallBacks: (() => void)[] = [];
 
   constructor(
     public ctx: ExtensionContext,
@@ -29,20 +46,59 @@ export class CompareInterfaceManager extends DisposableObject {
     super();
   }
 
-  showResults(from: CompletedQuery, to: CompletedQuery, forceReveal = WebviewReveal.NotForced) {
+  async showResults(
+    from: CompletedQuery,
+    to: CompletedQuery,
+    selectedResultSetName?: string
+  ) {
     this.comparePair = { from, to };
-    if (forceReveal === WebviewReveal.Forced) {
-      this.getPanel().reveal(undefined, true);
+    this.getPanel().reveal(undefined, true);
+
+    await this.waitForPanelLoaded();
+    const [
+      commonResultSetNames,
+      currentResultSetName,
+      fromResultSet,
+      toResultSet,
+    ] = await this.findCommonResultSetNames(from, to, selectedResultSetName);
+    if (currentResultSetName) {
+      await this.postMessage({
+        t: "setComparisons",
+        stats: {
+          fromQuery: {
+            // since we split the description into several rows
+            // only run interpolation if the label is user-defined
+            // otherwise we will wind up with duplicated rows
+            name: from.options.label
+              ? from.interpolate(from.getLabel())
+              : from.queryName,
+            status: from.statusString,
+            time: from.time,
+          },
+          toQuery: {
+            name: to.options.label
+              ? to.interpolate(from.getLabel())
+              : to.queryName,
+            status: to.statusString,
+            time: to.time,
+          },
+        },
+        columns: fromResultSet.schema.columns,
+        commonResultSetNames,
+        currentResultSetName: currentResultSetName,
+        rows: this.compareResults(fromResultSet, toResultSet),
+        datebaseUri: to.database.databaseUri,
+      });
     }
   }
 
   getPanel(): WebviewPanel {
     if (this.panel == undefined) {
       const { ctx } = this;
       const panel = (this.panel = Window.createWebviewPanel(
-        "compareView", // internal name
-        "Compare CodeQL Query Results", // user-visible name
-        { viewColumn: ViewColumn.Beside, preserveFocus: true },
+        "compareView",
+        "Compare CodeQL Query Results",
+        { viewColumn: ViewColumn.Active, preserveFocus: true },
         {
           enableScripts: true,
           enableFindWidget: true,
@@ -54,7 +110,10 @@ export class CompareInterfaceManager extends DisposableObject {
         }
       ));
       this.panel.onDidDispose(
-        () => this.panel = undefined,
+        () => {
+          this.panel = undefined;
+          this.comparePair = undefined;
+        },
         null,
         ctx.subscriptions
       );
@@ -64,10 +123,14 @@ export class CompareInterfaceManager extends DisposableObject {
       );
 
       const stylesheetPathOnDisk = Uri.file(
-        ctx.asAbsolutePath("out/compareView.css")
+        ctx.asAbsolutePath("out/resultsView.css")
       );
 
-      panel.webview.html = getHtmlForWebview(panel.webview, scriptPathOnDisk, stylesheetPathOnDisk);
+      panel.webview.html = getHtmlForWebview(
+        panel.webview,
+        scriptPathOnDisk,
+        stylesheetPathOnDisk
+      );
       panel.webview.onDidReceiveMessage(
         async (e) => this.handleMsgFromView(e),
         undefined,
@@ -77,9 +140,103 @@ export class CompareInterfaceManager extends DisposableObject {
     return this.panel;
   }
 
-  private async handleMsgFromView(msg: CompareViewMessage): Promise<void> {
-    /** TODO */
-    showAndLogErrorMessage(JSON.stringify(msg));
-    showAndLogErrorMessage(JSON.stringify(this.comparePair));
+  private waitForPanelLoaded(): Promise<void> {
+    return new Promise((resolve) => {
+      if (this.panelLoaded) {
+        resolve();
+      } else {
+        this.panelLoadedCallBacks.push(resolve);
+      }
+    });
+  }
+
+  private async handleMsgFromView(msg: FromCompareViewMessage): Promise<void> {
+    switch (msg.t) {
+      case "compareViewLoaded":
+        this.panelLoaded = true;
+        this.panelLoadedCallBacks.forEach((cb) => cb());
+        this.panelLoadedCallBacks = [];
+        break;
+
+      case "changeCompare":
+        this.changeTable(msg.newResultSetName);
+        break;
+
+      case "viewSourceFile":
+        await jumpToLocation(msg, this.databaseManager, this.logger);
+        break;
+    }
+  }
+
+  private postMessage(msg: ToCompareViewMessage): Thenable<boolean> {
+    return this.getPanel().webview.postMessage(msg);
+  }
+
+  private async findCommonResultSetNames(
+    from: CompletedQuery,
+    to: CompletedQuery,
+    selectedResultSetName: string | undefined
+  ): Promise<[string[], string, RawResultSet, RawResultSet]> {
+    const fromSchemas = await this.cliServer.bqrsInfo(
+      from.query.resultsPaths.resultsPath
+    );
+    const toSchemas = await this.cliServer.bqrsInfo(
+      to.query.resultsPaths.resultsPath
+    );
+    const fromSchemaNames = fromSchemas["result-sets"].map(
+      (schema) => schema.name
+    );
+    const toSchemaNames = toSchemas["result-sets"].map((schema) => schema.name);
+    const commonResultSetNames = fromSchemaNames.filter((name) =>
+      toSchemaNames.includes(name)
+    );
+    const currentResultSetName = selectedResultSetName || commonResultSetNames[0];
+    const fromResultSet = await this.getResultSet(
+      fromSchemas,
+      currentResultSetName,
+      from.query.resultsPaths.resultsPath
+    );
+    const toResultSet = await this.getResultSet(
+      toSchemas,
+      currentResultSetName,
+      to.query.resultsPaths.resultsPath
+    );
+    return [
+      commonResultSetNames,
+      currentResultSetName,
+      fromResultSet,
+      toResultSet,
+    ];
+  }
+
+  private async changeTable(newResultSetName: string) {
+    if (!this.comparePair?.from || !this.comparePair.to) {
+      return;
+    }
+    await this.showResults(this.comparePair.from, this.comparePair.to, newResultSetName);
+  }
+
+  private async getResultSet(
+    bqrsInfo: BQRSInfo,
+    resultSetName: string,
+    resultsPath: string
+  ): Promise<RawResultSet> {
+    const schema = bqrsInfo["result-sets"].find(
+      (schema) => schema.name === resultSetName
+    );
+    if (!schema) {
+      throw new Error(`Schema ${resultSetName} not found.`);
+    }
+    const chunk = await this.cliServer.bqrsDecode(resultsPath, resultSetName);
+    const adaptedSchema = adaptSchema(schema);
+    return adaptBqrs(adaptedSchema, chunk);
+  }
+
+  private compareResults(
+    fromResults: RawResultSet,
+    toResults: RawResultSet
+  ): QueryCompareResult {
+    // Only compare columns that have the same name
+    return resultsDiff(fromResults, toResults);
   }
 }

extensions/ql-vscode/src/compare/resultsDiff.ts

@@ -0,0 +1,58 @@
+import { RawResultSet } from "../adapt";
+import { QueryCompareResult } from "../interface-types";
+
+/**
+ * Compare the rows of two queries. Use deep equality to determine if
+ * rows have been added or removed across two invocations of a query.
+ *
+ * Assumptions:
+ *
+ * 1. Queries have the same sort order
+ * 2. Queries have same number and order of columns
+ * 3. Rows are not changed or re-ordered, they are only added or removed
+ *
+ * @param fromResults the source query
+ * @param toResults the target query
+ *
+ * @throws Error when:
+ *  1. number of columns do not match
+ *  2. If either query is empty
+ *  3. If the queries are 100% disjoint
+ */
+export default function resultsDiff(
+  fromResults: RawResultSet,
+  toResults: RawResultSet
+): QueryCompareResult {
+
+  if (fromResults.schema.columns.length !== toResults.schema.columns.length) {
+    throw new Error("CodeQL Compare: Columns do not match.");
+  }
+
+  if (!fromResults.rows.length) {
+    throw new Error("CodeQL Compare: Source query has no results.");
+  }
+
+  if (!toResults.rows.length) {
+    throw new Error("CodeQL Compare: Target query has no results.");
+  }
+
+  const results = {
+    from: arrayDiff(fromResults.rows, toResults.rows),
+    to: arrayDiff(toResults.rows, fromResults.rows),
+  };
+
+  if (
+    fromResults.rows.length === results.from.length &&
+    toResults.rows.length === results.to.length
+  ) {
+    throw new Error("CodeQL Compare: No overlap between the selected queries.");
+  }
+
+  return results;
+}
+
+function arrayDiff<T>(source: readonly T[], toRemove: readonly T[]): T[] {
+  // Stringify the object so that we can compare hashes in the set
+  const rest = new Set(toRemove.map((item) => JSON.stringify(item)));
+  return source.filter((element) => !rest.has(JSON.stringify(element)));
+}