mrva/vscode-codeql
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Fix Graphviz WASM module not loading for graph viewer

Browse Source 
It seems that when we added the CSP policy to the webview, we did not
take into account that `d3-graphviz` uses `@hpcc-js/wasm` to load
Graphviz as a WASM module. This commit adds `'wasm-unsafe-eval'` to the
CSP policy to allow this.
This commit is contained in:
Koen Vlaswinkel
2023-02-15 15:41:29 +01:00
parent 5933f097e7
commit bc51e7462b
2 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
extensions/ql-vscode/src/interface-utils.ts
View File

@@ -163,7 +163,7 @@ export function getHtmlForWebview(
/*
* Content security policy:
* default-src: allow nothing by default.
* script-src: allow only the given script, using the nonce.
* script-src: allow the given script, using the nonce. also allow loading WebAssembly modules.
* style-src: allow only the given stylesheet, using the nonce.
* connect-src: only allow fetch calls to webview resource URIs
* (this is used to load BQRS result files).
@@ -172,7 +172,7 @@ export function getHtmlForWebview(
<html>
<head>
<meta http-equiv="Content-Security-Policy"
content="default-src 'none'; script-src 'nonce-${nonce}'; font-src ${fontSrc}; style-src ${styleSrc}; connect-src ${
content="default-src 'none'; script-src 'nonce-${nonce}' 'wasm-unsafe-eval'; font-src ${fontSrc}; style-src ${styleSrc}; connect-src ${
webview.cspSource
};">
${stylesheetsHtmlLines.join(` ${EOL}`)}

8
extensions/ql-vscode/src/view/results/graph.tsx
View File

@@ -5,7 +5,7 @@ import {
InterpretedResultSet,
GraphInterpretationData,
} from "../../pure/interface-types";
import { graphviz } from "d3-graphviz";
import { graphviz, GraphvizOptions } from "d3-graphviz";
import { tryGetLocationFromString } from "../../pure/bqrs-utils";
export type GraphProps = ResultTableProps & {
resultSet: InterpretedResultSet<GraphInterpretationData>;
@@ -59,11 +59,12 @@ export class Graph extends React.Component<GraphProps> {
return;
}
const options = {
const options: GraphvizOptions = {
fit: true,
fade: false,
growEnteringEdges: false,
zoom: true,
useWorker: false,
};
const element = document.querySelector(`#${graphId}`);
@@ -77,8 +78,7 @@ export class Graph extends React.Component<GraphProps> {
const borderColor = getComputedStyle(element).borderColor;
let firstPolygon = true;
graphviz(`#${graphId}`)
.options(options)
graphviz(`#${graphId}`, options)
.attributer(function (d) {
if (d.tag === "a") {
const url = d.attributes["xlink:href"] || d.attributes["href"];