current/deps/v8/tools/turbolizer/src/disassembly-view.ts
// Copyright 2015 the V8 project authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
import { PROF_COLS, UNICODE_BLOCK } from "../src/constants";
import { SelectionBroker } from "../src/selection-broker";
import { TextView } from "../src/text-view";
import { MySelection } from "./selection";
import { anyToString, interpolate } from "./util";
import { InstructionSelectionHandler } from "./selection-handler";
const toolboxHTML = `<div id="disassembly-toolbox">
<form>
<label><input id="show-instruction-address" type="checkbox" name="instruction-address">Show addresses</label>
<label><input id="show-instruction-binary" type="checkbox" name="instruction-binary">Show binary literal</label>
<label><input id="highlight-gap-instructions" type="checkbox" name="instruction-binary">Highlight gap instructions</label>
</form>
</div>`;
export class DisassemblyView extends TextView {
SOURCE_POSITION_HEADER_REGEX: any;
addrEventCounts: any;
totalEventCounts: any;
maxEventCounts: any;
posLines: Array<any>;
instructionSelectionHandler: InstructionSelectionHandler;
offsetSelection: MySelection;
showInstructionAddressHandler: () => void;
showInstructionBinaryHandler: () => void;
highlightGapInstructionsHandler: () => void;
createViewElement() {
const pane = document.createElement('div');
pane.setAttribute('id', "disassembly");
pane.innerHTML =
`<pre id='disassembly-text-pre' class='prettyprint prettyprinted'>
<ul class='disassembly-list nolinenums noindent'>
</ul>
</pre>`;
return pane;
}
constructor(parentId, broker: SelectionBroker) {
super(parentId, broker);
const view = this;
const ADDRESS_STYLE = {
associateData: (text, fragment: HTMLElement) => {
const matches = text.match(/(?<address>0?x?[0-9a-fA-F]{8,16})(?<addressSpace>\s+)(?<offset>[0-9a-f]+)(?<offsetSpace>\s*)/);
const offset = Number.parseInt(matches.groups["offset"], 16);
const instructionKind = view.sourceResolver.getInstructionKindForPCOffset(offset);
fragment.dataset.instructionKind = instructionKind;
fragment.title = view.sourceResolver.instructionKindToReadableName(instructionKind);
const blockIds = view.sourceResolver.getBlockIdsForOffset(offset);
const blockIdElement = document.createElement("SPAN");
blockIdElement.className = "block-id com linkable-text";
blockIdElement.innerText = "";
if (blockIds && blockIds.length > 0) {
blockIds.forEach(blockId => view.addHtmlElementForBlockId(blockId, fragment));
blockIdElement.innerText = `B${blockIds.join(",")}:`;
blockIdElement.dataset.blockId = `${blockIds.join(",")}`;
}
fragment.appendChild(blockIdElement);
const addressElement = document.createElement("SPAN");
addressElement.className = "instruction-address";
addressElement.innerText = matches.groups["address"];
const offsetElement = document.createElement("SPAN");
offsetElement.innerText = matches.groups["offset"];
fragment.appendChild(addressElement);
fragment.appendChild(document.createTextNode(matches.groups["addressSpace"]));
fragment.appendChild(offsetElement);
fragment.appendChild(document.createTextNode(matches.groups["offsetSpace"]));
fragment.classList.add('tag');
if (!Number.isNaN(offset)) {
let pcOffset = view.sourceResolver.getKeyPcOffset(offset);
if (pcOffset == -1) pcOffset = Number(offset);
fragment.dataset.pcOffset = `${pcOffset}`;
addressElement.classList.add('linkable-text');
offsetElement.classList.add('linkable-text');
}
return true;
}
};
const UNCLASSIFIED_STYLE = {
css: 'com'
};
const NUMBER_STYLE = {
css: ['instruction-binary', 'lit']
};
const COMMENT_STYLE = {
css: 'com'
};
const OPCODE_ARGS = {
associateData: function (text, fragment) {
fragment.innerHTML = text;
const replacer = (match, hexOffset) => {
const offset = Number.parseInt(hexOffset, 16);
let keyOffset = view.sourceResolver.getKeyPcOffset(offset);
if (keyOffset == -1) keyOffset = Number(offset);
const blockIds = view.sourceResolver.getBlockIdsForOffset(offset);
let block = "";
let blockIdData = "";
if (blockIds && blockIds.length > 0) {
block = `B${blockIds.join(",")} `;
blockIdData = `data-block-id="${blockIds.join(",")}"`;
}
return `<span class="tag linkable-text" data-pc-offset="${keyOffset}" ${blockIdData}>${block}${match}</span>`;
};
const html = text.replace(/<.0?x?([0-9a-fA-F]+)>/g, replacer);
fragment.innerHTML = html;
return true;
}
};
const OPCODE_STYLE = {
css: 'kwd'
};
const BLOCK_HEADER_STYLE = {
associateData: function (text, fragment) {
if (view.sourceResolver.hasBlockStartInfo()) return false;
const matches = /\d+/.exec(text);
if (!matches) return true;
const blockId = matches[0];
fragment.dataset.blockId = blockId;
fragment.innerHTML = text;
fragment.className = "com block";
return true;
}
};
const SOURCE_POSITION_HEADER_STYLE = {
css: 'com'
};
view.SOURCE_POSITION_HEADER_REGEX = /^\s*--[^<]*<.*(not inlined|inlined\((\d+)\)):(\d+)>\s*--/;
const patterns = [
[
[/^0?x?[0-9a-fA-F]{8,16}\s+[0-9a-f]+\s+/, ADDRESS_STYLE, 1],
[view.SOURCE_POSITION_HEADER_REGEX, SOURCE_POSITION_HEADER_STYLE, -1],
[/^\s+-- B\d+ start.*/, BLOCK_HEADER_STYLE, -1],
[/^.*/, UNCLASSIFIED_STYLE, -1]
],
[
[/^\s*[0-9a-f]+\s+/, NUMBER_STYLE, 2],
[/^\s*[0-9a-f]+\s+[0-9a-f]+\s+/, NUMBER_STYLE, 2],
[/^.*/, null, -1]
],
[
[/^REX.W \S+\s+/, OPCODE_STYLE, 3],
[/^\S+\s+/, OPCODE_STYLE, 3],
[/^\S+$/, OPCODE_STYLE, -1],
[/^.*/, null, -1]
],
[
[/^\s+/, null],
[/^[^;]+$/, OPCODE_ARGS, -1],
[/^[^;]+/, OPCODE_ARGS, 4],
[/^;/, COMMENT_STYLE, 5]
],
[
[/^.+$/, COMMENT_STYLE, -1]
]
];
view.setPatterns(patterns);
const linkHandler = (e: MouseEvent) => {
if (!(e.target instanceof HTMLElement)) return;
const offsetAsString = typeof e.target.dataset.pcOffset != "undefined" ? e.target.dataset.pcOffset : e.target.parentElement.dataset.pcOffset;
const offset = Number.parseInt(offsetAsString, 10);
if ((typeof offsetAsString) != "undefined" && !Number.isNaN(offset)) {
view.offsetSelection.select([offset], true);
const nodes = view.sourceResolver.nodesForPCOffset(offset)[0];
if (nodes.length > 0) {
e.stopPropagation();
if (!e.shiftKey) {
view.selectionHandler.clear();
}
view.selectionHandler.select(nodes, true);
} else {
view.updateSelection();
}
}
return undefined;
};
view.divNode.addEventListener('click', linkHandler);
const linkHandlerBlock = e => {
const blockId = e.target.dataset.blockId;
if (typeof blockId != "undefined") {
const blockIds = blockId.split(",");
if (!e.shiftKey) {
view.selectionHandler.clear();
}
view.blockSelectionHandler.select(blockIds, true);
}
};
view.divNode.addEventListener('click', linkHandlerBlock);
this.offsetSelection = new MySelection(anyToString);
const instructionSelectionHandler = {
clear: function () {
view.offsetSelection.clear();
view.updateSelection();
broker.broadcastClear(instructionSelectionHandler);
},
select: function (instructionIds, selected) {
view.offsetSelection.select(instructionIds, selected);
view.updateSelection();
broker.broadcastBlockSelect(instructionSelectionHandler, instructionIds, selected);
},
brokeredInstructionSelect: function (instructionIds, selected) {
const firstSelect = view.offsetSelection.isEmpty();
const keyPcOffsets = view.sourceResolver.instructionsToKeyPcOffsets(instructionIds);
view.offsetSelection.select(keyPcOffsets, selected);
view.updateSelection(firstSelect);
},
brokeredClear: function () {
view.offsetSelection.clear();
view.updateSelection();
}
};
this.instructionSelectionHandler = instructionSelectionHandler;
broker.addInstructionHandler(instructionSelectionHandler);
const toolbox = document.createElement("div");
toolbox.id = "toolbox-anchor";
toolbox.innerHTML = toolboxHTML;
view.divNode.insertBefore(toolbox, view.divNode.firstChild);
const instructionAddressInput: HTMLInputElement = view.divNode.querySelector("#show-instruction-address");
const lastShowInstructionAddress = window.sessionStorage.getItem("show-instruction-address");
instructionAddressInput.checked = lastShowInstructionAddress == 'true';
const showInstructionAddressHandler = () => {
window.sessionStorage.setItem("show-instruction-address", `${instructionAddressInput.checked}`);
for (const el of view.divNode.querySelectorAll(".instruction-address")) {
el.classList.toggle("invisible", !instructionAddressInput.checked);
}
};
instructionAddressInput.addEventListener("change", showInstructionAddressHandler);
this.showInstructionAddressHandler = showInstructionAddressHandler;
const instructionBinaryInput: HTMLInputElement = view.divNode.querySelector("#show-instruction-binary");
const lastShowInstructionBinary = window.sessionStorage.getItem("show-instruction-binary");
instructionBinaryInput.checked = lastShowInstructionBinary == 'true';
const showInstructionBinaryHandler = () => {
window.sessionStorage.setItem("show-instruction-binary", `${instructionBinaryInput.checked}`);
for (const el of view.divNode.querySelectorAll(".instruction-binary")) {
el.classList.toggle("invisible", !instructionBinaryInput.checked);
}
};
instructionBinaryInput.addEventListener("change", showInstructionBinaryHandler);
this.showInstructionBinaryHandler = showInstructionBinaryHandler;
const highlightGapInstructionsInput: HTMLInputElement = view.divNode.querySelector("#highlight-gap-instructions");
const lastHighlightGapInstructions = window.sessionStorage.getItem("highlight-gap-instructions");
highlightGapInstructionsInput.checked = lastHighlightGapInstructions == 'true';
const highlightGapInstructionsHandler = () => {
window.sessionStorage.setItem("highlight-gap-instructions", `${highlightGapInstructionsInput.checked}`);
view.divNode.classList.toggle("highlight-gap-instructions", highlightGapInstructionsInput.checked);
};
highlightGapInstructionsInput.addEventListener("change", highlightGapInstructionsHandler);
this.highlightGapInstructionsHandler = highlightGapInstructionsHandler;
}
updateSelection(scrollIntoView: boolean = false) {
super.updateSelection(scrollIntoView);
const keyPcOffsets = this.sourceResolver.nodesToKeyPcOffsets(this.selection.selectedKeys());
if (this.offsetSelection) {
for (const key of this.offsetSelection.selectedKeys()) {
keyPcOffsets.push(Number(key));
}
}
for (const keyPcOffset of keyPcOffsets) {
const elementsToSelect = this.divNode.querySelectorAll(`[data-pc-offset='${keyPcOffset}']`);
for (const el of elementsToSelect) {
el.classList.toggle("selected", true);
}
}
}
initializeCode(sourceText, sourcePosition: number = 0) {
const view = this;
view.addrEventCounts = null;
view.totalEventCounts = null;
view.maxEventCounts = null;
view.posLines = new Array();
// Comment lines for line 0 include sourcePosition already, only need to
// add sourcePosition for lines > 0.
view.posLines[0] = sourcePosition;
if (sourceText && sourceText != "") {
const base = sourcePosition;
let current = 0;
const sourceLines = sourceText.split("\n");
for (let i = 1; i < sourceLines.length; i++) {
// Add 1 for newline character that is split off.
current += sourceLines[i - 1].length + 1;
view.posLines[i] = base + current;
}
}
}
initializePerfProfile(eventCounts) {
const view = this;
if (eventCounts !== undefined) {
view.addrEventCounts = eventCounts;
view.totalEventCounts = {};
view.maxEventCounts = {};
for (const evName in view.addrEventCounts) {
if (view.addrEventCounts.hasOwnProperty(evName)) {
const keys = Object.keys(view.addrEventCounts[evName]);
const values = keys.map(key => view.addrEventCounts[evName][key]);
view.totalEventCounts[evName] = values.reduce((a, b) => a + b);
view.maxEventCounts[evName] = values.reduce((a, b) => Math.max(a, b));
}
}
} else {
view.addrEventCounts = null;
view.totalEventCounts = null;
view.maxEventCounts = null;
}
}
showContent(data): void {
console.time("disassembly-view");
super.initializeContent(data, null);
this.showInstructionAddressHandler();
this.showInstructionBinaryHandler();
this.highlightGapInstructionsHandler();
console.timeEnd("disassembly-view");
}
// Shorten decimals and remove trailing zeroes for readability.
humanize(num) {
return num.toFixed(3).replace(/\.?0+$/, "") + "%";
}
processLine(line) {
const view = this;
let fragments = super.processLine(line);
// Add profiling data per instruction if available.
if (view.totalEventCounts) {
const matches = /^(0x[0-9a-fA-F]+)\s+\d+\s+[0-9a-fA-F]+/.exec(line);
if (matches) {
const newFragments = [];
for (const event in view.addrEventCounts) {
if (!view.addrEventCounts.hasOwnProperty(event)) continue;
const count = view.addrEventCounts[event][matches[1]];
let str = " ";
const cssCls = "prof";
if (count !== undefined) {
const perc = count / view.totalEventCounts[event] * 100;
let col = { r: 255, g: 255, b: 255 };
for (let i = 0; i < PROF_COLS.length; i++) {
if (perc === PROF_COLS[i].perc) {
col = PROF_COLS[i].col;
break;
} else if (perc > PROF_COLS[i].perc && perc < PROF_COLS[i + 1].perc) {
const col1 = PROF_COLS[i].col;
const col2 = PROF_COLS[i + 1].col;
const val = perc - PROF_COLS[i].perc;
const max = PROF_COLS[i + 1].perc - PROF_COLS[i].perc;
col.r = Math.round(interpolate(val, max, col1.r, col2.r));
col.g = Math.round(interpolate(val, max, col1.g, col2.g));
col.b = Math.round(interpolate(val, max, col1.b, col2.b));
break;
}
}
str = UNICODE_BLOCK;
const fragment = view.createFragment(str, cssCls);
fragment.title = event + ": " + view.humanize(perc) + " (" + count + ")";
fragment.style.color = "rgb(" + col.r + ", " + col.g + ", " + col.b + ")";
newFragments.push(fragment);
} else {
newFragments.push(view.createFragment(str, cssCls));
}
}
fragments = newFragments.concat(fragments);
}
}
return fragments;
}
detachSelection() { return null; }
public searchInputAction(searchInput: HTMLInputElement, e: Event, onlyVisible: boolean): void {
throw new Error("Method not implemented.");
}
}