| /*--------------------------------------------------------- |
| * Copyright 2022 The Go Authors. All rights reserved. |
| * Licensed under the MIT License. See LICENSE in the project root for license information. |
| *--------------------------------------------------------*/ |
| |
| // Script for VulncheckResultViewProvider's webview. |
| |
| (function () { |
| |
| // @ts-ignore |
| const vscode = acquireVsCodeApi(); |
| |
| const logContainer = /** @type {HTMLElement} */ (document.querySelector('.log')); |
| const vulnsContainer = /** @type {HTMLElement} */ (document.querySelector('.vulns')); |
| |
| vulnsContainer.addEventListener('click', (event) => { |
| let node = event && event.target; |
| if (node?.tagName === 'A' && node.href) { |
| // Ask vscode to handle link opening. |
| vscode.postMessage({ type: 'open', target: node.href }); |
| event.preventDefault(); |
| event.stopPropagation(); |
| return; |
| } |
| }); |
| |
| const errorContainer = document.createElement('div'); |
| document.body.appendChild(errorContainer); |
| errorContainer.className = 'error' |
| errorContainer.style.display = 'none' |
| |
| function moduleVersion(/** @type {string} */mod, /** @type {string|undefined} */ver) { |
| if (ver) { |
| return `<a href="https://pkg.go.dev/${mod}@${ver}">${mod}@${ver}</a>`; |
| } |
| return 'N/A' |
| } |
| |
| function snapshotContent() { |
| return vulnsContainer.innerHTML; |
| } |
| |
| /** |
| * Render the document in the webview. |
| */ |
| function updateContent(/** @type {string} */ text = '{}') { |
| let json; |
| try { |
| json = JSON.parse(text); |
| } catch { |
| errorContainer.innerText = 'Error: Document is not valid json'; |
| errorContainer.style.display = ''; |
| return; |
| } |
| errorContainer.style.display = 'none'; |
| |
| logContainer.innerHTML = ''; |
| const runLog = document.createElement('table'); |
| const timeinfo = (startDate, durationMillisec) => { |
| if (!startDate) { return '' } |
| return durationMillisec ? `${startDate} (took ${durationMillisec} msec)` : `${startDate}`; |
| } |
| |
| runLog.innerHTML = ` |
| <tr><td>Dir:</td><td>${json.Dir || ''}</td></tr> |
| <tr><td>Pattern:</td><td>${json.Pattern || ''}</td></tr> |
| <tr><td>Analyzed at:</td><td>${timeinfo(json.Start, json.Duration)}</td></tr>`; |
| logContainer.appendChild(runLog); |
| |
| const vulns = json.Vuln || []; |
| vulnsContainer.innerHTML = ''; |
| |
| vulns.forEach((vuln) => { |
| const element = document.createElement('div'); |
| element.className = 'vuln'; |
| vulnsContainer.appendChild(element); |
| |
| // TITLE - Vuln ID |
| const title = document.createElement('h2'); |
| title.innerHTML = `<a href="${vuln.URL}">${vuln.ID}</a>`; |
| title.className = 'vuln-title'; |
| element.appendChild(title); |
| |
| // DESCRIPTION - short text (aliases) |
| const desc = document.createElement('p'); |
| desc.innerHTML = Array.isArray(vuln.Aliases) && vuln.Aliases.length ? `${vuln.Details} (${vuln.Aliases.join(', ')})` : vuln.Details; |
| desc.className = 'vuln-desc'; |
| element.appendChild(desc); |
| |
| // DETAILS - dump of all details |
| const details = document.createElement('table'); |
| details.className = 'vuln-details' |
| details.innerHTML = ` |
| <tr><td>Package</td><td>${vuln.PkgPath}</td></tr> |
| <tr><td>Current Version</td><td>${moduleVersion(vuln.ModPath, vuln.CurrentVersion)}</td></tr> |
| <tr><td>Fixed Version</td><td>${moduleVersion(vuln.ModPath, vuln.FixedVersion)}</td></tr> |
| <tr><td>Affecting</td><td>${vuln.AffectedPkgs?.join('<br>')}</td></tr> |
| `; |
| element.appendChild(details); |
| |
| /* TODO: Action for module version upgrade */ |
| /* TODO: Explain module dependency - why am I depending on this vulnerable version? */ |
| |
| // EXEMPLARS - call stacks (initially hidden) |
| const examples = document.createElement('details'); |
| examples.innerHTML = `<summary>${vuln.CallStackSummaries?.length || 0}+ findings</summary>`; |
| |
| // Call stacks |
| const callstacksContainer = document.createElement('p'); |
| callstacksContainer.className = 'stacks'; |
| vuln.CallStackSummaries?.forEach((summary, idx) => { |
| const callstack = document.createElement('details'); |
| const s = document.createElement('summary'); |
| s.innerText = summary; |
| callstack.appendChild(s); |
| |
| const stack = document.createElement('div'); |
| stack.className = 'stack'; |
| const cs = vuln.CallStacks[idx]; |
| cs.forEach((c) => { |
| const p = document.createElement('p'); |
| const pos = c.URI ? `${c.URI}?${c.Pos.line || 0}` : ''; |
| p.innerHTML = pos ? `<a href="${pos}">${c.Name}</a>` : c.Name; |
| stack.appendChild(p); |
| }); |
| callstack.appendChild(stack); |
| |
| callstacksContainer.appendChild(callstack); |
| }) |
| |
| examples.appendChild(callstacksContainer); |
| element.appendChild(examples); |
| }); |
| } |
| |
| // Message Passing between Extension and Webview |
| // |
| // Extension sends 'update' to Webview to trigger rerendering. |
| // Webview sends 'link' to Extension to forward all link |
| // click events so the extension can handle the event. |
| // |
| // Extension sends 'snapshot-request' to trigger dumping |
| // of the current DOM in the 'vulns' container. |
| // Webview sends 'snapshot-result' to the extension |
| // as the response to snapshot-request. |
| |
| // Handle messages sent from the extension to the webview |
| window.addEventListener('message', event => { |
| const message = event.data; // The json data that the extension sent |
| switch (message.type) { |
| case 'update': |
| const text = message.text; |
| |
| updateContent(text); |
| // Then persist state information. |
| // This state is returned in the call to `vscode.getState` below when a webview is reloaded. |
| vscode.setState({ text }); |
| return; |
| // Message for testing. Returns a current DOM in a serialized format. |
| case 'snapshot-request': |
| const result = snapshotContent(); |
| vscode.postMessage({ type: 'snapshot-result', target: result }); |
| return; |
| } |
| }); |
| |
| // Webviews are normally torn down when not visible and re-created when they become visible again. |
| // State lets us save information across these re-loads |
| const state = vscode.getState(); |
| if (state) { |
| updateContent(state.text); |
| }; |
| // TODO: Handle 'details' expansion info and store the state using |
| // vscode.setState or retainContextWhenHidden. Currently, we are storing only |
| // the document text. (see windowEventHandler) |
| }()); |