Bug 1453066 - Update Debugger Frontend v34. r=jdescottes

This commit is contained in:
Jason Laster 2018-04-11 14:55:18 -04:00
Родитель 97108d5fb8
Коммит 881644f25f
10 изменённых файлов: 257 добавлений и 87 удалений

Просмотреть файл

@ -1,9 +1,9 @@
This is the debugger.html project output.
See https://github.com/devtools-html/debugger.html
Version 33.0
Version 34.0
Comparison: https://github.com/devtools-html/debugger.html/compare/release-32...release-33
Comparison: https://github.com/devtools-html/debugger.html/compare/release-33...release-34
Packages:
- babel-plugin-transform-es2015-modules-commonjs @6.26.0

Просмотреть файл

@ -326,18 +326,6 @@ menuseparator {
--reference-color: var(--theme-highlight-purple);
}
.theme-firebug {
--number-color: #000088;
--string-color: #ff0000;
--null-color: #787878;
--object-color: DarkGreen;
--caption-color: #444444;
--location-color: #555555;
--source-link-color: blue;
--node-color: rgb(0, 0, 136);
--reference-color: rgb(102, 102, 255);
}
/******************************************************************************/
.objectLink:hover {
@ -1078,10 +1066,6 @@ html[dir="rtl"] .tree-node img.arrow {
font-family: Menlo, monospace;
}
.project-text-search .result.focused {
background-color: var(--search-overlays-semitransparent);
}
.project-text-search .result .query-match {
background-color: var(--theme-selection-background);
color: white;
@ -1090,10 +1074,6 @@ html[dir="rtl"] .tree-node img.arrow {
border-radius: 2px;
}
.project-text-search .result.focused .line-number {
font-weight: bolder;
}
.project-text-search .result .line-number {
margin-right: 1em;
width: 2em;
@ -1121,10 +1101,6 @@ html[dir="rtl"] .tree-node img.arrow {
margin: 2px 0 2px 0;
}
.project-text-search .file-result.focused {
background-color: var(--search-overlays-semitransparent);
}
.project-text-search .line-match {
display: "flex";
flex-grow: 1;
@ -1148,6 +1124,22 @@ html[dir="rtl"] .tree-node img.arrow {
.project-text-search .managed-tree .tree {
height: 100%;
}
/* Focus values */
.project-text-search .file-result.focused,
.project-text-search .result.focused {
background-color: var(--theme-selection-background);
}
.project-text-search .result.focused .line-number {
font-weight: bolder;
}
.project-text-search .result.focused .query-match {
background-color: #ffffff;
color: #000000;
}
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */
@ -2925,7 +2917,8 @@ html[dir="rtl"] .breakpoints-list .breakpoint .breakpoint-line {
display: inline-block;
}
.CodeMirror.cm-s-mozilla-breakpoint .CodeMirror-code {
.CodeMirror.cm-s-mozilla-breakpoint .CodeMirror-code,
.CodeMirror.cm-s-mozilla-breakpoint .CodeMirror-scroll {
cursor: default;
}
/* This Source Code Form is subject to the terms of the Mozilla Public
@ -3009,10 +3002,6 @@ html[dir="rtl"] .breakpoints-list .breakpoint .breakpoint-line {
background-color: var(--theme-selection-background-hover);
}
:root.theme-firebug .expression-container:hover {
background-color: var(--theme-selection-background-hover);
}
.tree .tree-node:not(.focused):hover {
background-color: transparent;
}
@ -3158,8 +3147,7 @@ html[dir="rtl"] .breakpoints-list .breakpoint .breakpoint-line {
flex-shrink: 0;
}
.theme-light .frames .location,
.theme-firebug .frames .location {
.theme-light .frames .location {
color: var(--theme-comment);
}
@ -3194,7 +3182,6 @@ html[dir="rtl"] .breakpoints-list .breakpoint .breakpoint-line {
}
:root.theme-light .frames ul li.selected .location,
:root.theme-firebug .frames ul li.selected .location,
:root.theme-dark .frames ul li.selected .location {
color: white;
}
@ -4067,7 +4054,6 @@ html .welcomebox .toggle-button-end.collapsed {
line-height: 1.5em;
word-break: break-all;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}

Просмотреть файл

@ -5113,6 +5113,14 @@ function showSource(sourceId) {
return ({ dispatch, getState }) => {
const source = (0, _selectors.getSource)(getState(), sourceId);
if ((0, _selectors.getPaneCollapse)(getState(), "start")) {
dispatch({
type: "TOGGLE_PANE",
position: "start",
paneCollapsed: false
});
}
dispatch(setPrimaryPaneTab("sources"));
dispatch({
type: "SHOW_SOURCE",
@ -6433,10 +6441,7 @@ function getMappedExpression(expression) {
return expression;
}
return await dispatch({
type: "MAP_EXPRESSION_RESULT",
[_promise.PROMISE]: parser.mapOriginalExpression(expression, mappings)
});
return parser.mapOriginalExpression(expression, mappings);
};
}
@ -6616,14 +6621,31 @@ var _WasmDis = __webpack_require__(678);
var wasmStates = Object.create(null);
function maybeWasmSectionNameResolver(data) {
try {
const parser = new _WasmParser.BinaryReader();
parser.setData(data.buffer, 0, data.length);
const reader = new _WasmDis.NameSectionReader();
reader.read(parser);
return reader.hasValidNames() ? reader.getNameResolver() : null;
} catch (ex) {
// Ignoring any errors during names section retrival.
return null;
}
}
/**
* @memberof utils/wasm
* @static
*/
function getWasmText(sourceId, data) {
const nameResolver = maybeWasmSectionNameResolver(data);
const parser = new _WasmParser.BinaryReader();
parser.setData(data.buffer, 0, data.length);
const dis = new _WasmDis.WasmDisassembler();
if (nameResolver) {
dis.nameResolver = nameResolver;
}
dis.addOffsets = true;
const done = dis.disassembleChunk(parser);
let result = dis.getResult();
@ -7019,9 +7041,18 @@ class ManagedTree extends _react.Component {
if (expanded.has(this.props.getPath(highlightItems[0]))) {
this.focusItem(highlightItems[0]);
} else {
// Look at folders starting from the top-level until finds a
// closed folder and highlights this folder
const index = highlightItems.reverse().findIndex(item => !expanded.has(this.props.getPath(item)));
// Look at folders starting from the top-level and expand all the items
// which lie in the path of the item to be highlighted
highlightItems.reverse();
let index = highlightItems.findIndex(item => !expanded.has(this.props.getPath(item)));
if (this.props.autoExpandOnHighlight) {
while (index < highlightItems.length - 1) {
this.setExpanded(highlightItems[index], true, false);
index++;
}
}
this.focusItem(highlightItems[index]);
}
}
@ -7103,7 +7134,7 @@ function getURL(sourceUrl, debuggeeUrl = "") {
// A Webpack source is a special case
return (0, _lodash.merge)(def, {
path: path,
group: "Webpack",
group: "webpack://",
filename: filename
});
@ -7111,7 +7142,7 @@ function getURL(sourceUrl, debuggeeUrl = "") {
// An Angular source is a special case
return (0, _lodash.merge)(def, {
path: path,
group: "Angular",
group: "ng://",
filename: filename
});
@ -9892,7 +9923,7 @@ function isUnderRoot(url, projectRoot) {
return true;
}
return `/${url.group}${url.path}`.startsWith(projectRoot);
return `${url.group}${url.path}`.startsWith(projectRoot);
} /* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at <http://mozilla.org/MPL/2.0/>. */
@ -9958,7 +9989,7 @@ function traverseTree(url, tree, debuggeeHost, projectRoot) {
let path = "";
return parts.reduce((subTree, part, index) => {
path = `${path}/${part}`;
path = path ? `${path}/${part}` : part;
const debuggeeHostIfRoot = index === 0 ? debuggeeHost : null;
return findOrCreateNode(parts, subTree, path, part, index, url, debuggeeHostIfRoot);
}, tree);
@ -12874,8 +12905,12 @@ var _pause = __webpack_require__(1394);
var _sources = __webpack_require__(1369);
function visibleSourceId(location) {
return (0, _devtoolsSourceMap.isOriginalId)(location.sourceId) ? (0, _devtoolsSourceMap.originalToGeneratedId)(location.sourceId) : location.sourceId;
function getGeneratedId(sourceId) {
if ((0, _devtoolsSourceMap.isOriginalId)(sourceId)) {
return (0, _devtoolsSourceMap.originalToGeneratedId)(sourceId);
}
return sourceId;
}
/*
@ -12894,7 +12929,11 @@ function isSelectedFrameVisible(state) {
return false;
}
return visibleSourceId(selectedLocation) === visibleSourceId(selectedFrame.location);
if ((0, _devtoolsSourceMap.isOriginalId)(selectedLocation.sourceId)) {
return selectedLocation.sourceId === selectedFrame.location.sourceId;
}
return selectedLocation.sourceId === getGeneratedId(selectedFrame.location.sourceId);
}
/***/ }),
@ -16159,7 +16198,7 @@ function findSource(sourceTree, sourceUrl) {
function getDirectories(sourceUrl, sourceTree) {
const url = (0, _getURL.getURL)(sourceUrl);
const fullUrl = `/${url.group}${url.path}`;
const fullUrl = `${url.group}${url.path}`;
const parentMap = (0, _utils.createParentMap)(sourceTree);
const source = findSource(sourceTree, fullUrl);
if (!source) {
@ -16737,6 +16776,15 @@ class SourcesTree extends _react.Component {
}
}
renderItemName(name) {
const hosts = {
"ng://": "Angular",
"webpack://": "Webpack"
};
return hosts[name] || name;
}
renderEmptyElement(message) {
return _react2.default.createElement(
"div",
@ -16803,6 +16851,7 @@ class SourcesTree extends _react.Component {
const treeProps = {
autoExpandAll: false,
autoExpandDepth: expanded ? 0 : 1,
autoExpandOnHighlight: true,
expanded,
getChildren: item => (0, _sourcesTree.nodeHasChildren)(item) ? item.contents : [],
getParent: item => parentMap.get(item),
@ -16874,7 +16923,7 @@ var _initialiseProps = function () {
this.getIcon = (sources, item, depth) => {
const { debuggeeUrl, projectRoot } = this.props;
if (item.path === "/Webpack") {
if (item.path === "webpack://") {
return _react2.default.createElement(_Svg2.default, { name: "webpack" });
}
if (item.path === "/Angular") {
@ -16986,7 +17035,7 @@ var _initialiseProps = function () {
"span",
{ className: "label" },
" ",
item.name,
this.renderItemName(item.name),
" "
)
);
@ -18295,9 +18344,7 @@ class Preview extends _react.PureComponent {
this.onMouseOver = e => {
const { target } = e;
if (this.props.selectedFrameVisible) {
this.props.updatePreview(target, this.props.editor);
}
this.props.updatePreview(target, this.props.editor);
};
this.onMouseUp = () => {
@ -18384,8 +18431,7 @@ const {
exports.default = (0, _reactRedux.connect)(state => ({
preview: (0, _selectors.getPreview)(state),
selectedSource: (0, _selectors.getSelectedSource)(state),
selectedFrameVisible: (0, _selectors.isSelectedFrameVisible)(state)
selectedSource: (0, _selectors.getSelectedSource)(state)
}), {
addExpression,
setPopupObjectProperties,
@ -30462,7 +30508,7 @@ function updatePreview(target, editor) {
return;
}
if (!(0, _selectors.isLineInScope)(getState(), tokenPos.line)) {
if (!(0, _selectors.isSelectedFrameVisible)(getState()) || !(0, _selectors.isLineInScope)(getState(), tokenPos.line)) {
return;
}
@ -38777,7 +38823,6 @@ function formatSource(source, root) {
function getRelativeSources(state) {
const sources = (0, _selectors.getSources)(state);
const root = (0, _selectors.getProjectDirectoryRoot)(state);
return sources.valueSeq().toJS().filter(({ url }) => url && url.includes(root)).map(source => formatSource(source, root));
}
@ -38986,6 +39031,7 @@ class BreakpointItem extends _react.Component {
// $FlowIgnore
mountNode.innerHTML = "";
this.editor.appendToLocalElement(mountNode);
this.editor.codeMirror.on("mousedown", (_, e) => e.preventDefault());
}
}
}

Просмотреть файл

@ -9,10 +9,6 @@ add_task(async function() {
await waitForSources(dbg, "doc-asm.html", "asm.js");
// Expand nodes and make sure more sources appear.
is(findAllElements(dbg, "sourceNodes").length, 2);
await clickElement(dbg, "sourceDirectoryLabel", 2);
is(findAllElements(dbg, "sourceNodes").length, 4);
await selectSource(dbg, "asm.js");

Просмотреть файл

@ -1,6 +1,9 @@
/* Any copyright is dedicated to the Public Domain.
* http://creativecommons.org/publicdomain/zero/1.0/ */
// Tests for preview through Babel's compile output.
requestLongerTimeout(3);
function getCoordsFromPosition(cm, { line, ch }) {
return cm.charCoords({ line: ~~line, ch: ~~ch });
}

Просмотреть файл

@ -2,7 +2,7 @@
* http://creativecommons.org/publicdomain/zero/1.0/ */
// This test can be really slow on debug platforms and should be split.
requestLongerTimeout(4);
requestLongerTimeout(6);
// Tests loading sourcemapped sources for Babel's compile output.

Просмотреть файл

@ -1,24 +1,11 @@
/* Any copyright is dedicated to the Public Domain.
* http://creativecommons.org/publicdomain/zero/1.0/ */
function getCoordsFromPosition(cm, { line, ch }) {
return cm.charCoords({ line: ~~line, ch: ~~ch });
}
function hoverAtPos(dbg, { line, ch }) {
info(`Hovering at (${line}, ${ch})\n`);
const cm = getCM(dbg);
const coords = getCoordsFromPosition(cm, { line: line - 1, ch });
const tokenEl = dbg.win.document.elementFromPoint(coords.left, coords.top);
const previewed = waitForDispatch(dbg, "SET_PREVIEW");
tokenEl.dispatchEvent(
new MouseEvent("mouseover", {
bubbles: true,
cancelable: true,
view: dbg.win
})
);
return previewed;
async function assertNoTooltip(dbg) {
await waitForTime(200);
const el = findElement(dbg, "tooltip");
is(el, null, "Tooltip should not exist")
}
function assertPreviewTooltip(dbg, { result, expression }) {
@ -58,12 +45,21 @@ add_task(async function() {
await waitForPaused(dbg);
await waitForSelectedSource(dbg, "times2");
await hoverAtPos(dbg, { line: 2, ch: 9 });
assertPreviewTooltip(dbg, { result: 4, expression: "x" });
info(`Test previewing in the original location`)
await assertPreviews(dbg, [
{ line: 2, column: 10, result: 4, expression: "x" }
]);
info(`Test previewing in the generated location`)
await dbg.actions.jumpToMappedSelectedLocation();
await waitForSelectedSource(dbg, "bundle.js");
await assertPreviews(dbg, [
{ line: 70, column: 11, result: 4, expression: "x" }
]);
await hoverAtPos(dbg, { line: 70, ch: 10 });
assertPreviewTooltip(dbg, { result: 4, expression: "x" });
info(`Test that you can not preview in another original file`);
await selectSource(dbg, "output");
await hoverAtPos(dbg, { line: 2, ch: 16 });
await assertNoTooltip(dbg)
});

Просмотреть файл

@ -22,6 +22,23 @@ function getLabel(dbg, index) {
.replace(/^[\s\u200b]*/g, "");
}
add_task(async function() {
const dbg = await initDebugger("doc-sources.html");
const { selectors: { getSelectedSource, getExpandedState }, getState } = dbg;
await waitForSources(dbg, "nested-source");
await selectSource(dbg, "nested-source");
const expanded = getExpandedState(getState());
ok(
expanded.has(
`example.com/browser/devtools/client/debugger/new/test/mochitest/examples/nested/nested/`
),
"Nodes in path are automatically expanded"
);
});
add_task(async function() {
const dbg = await initDebugger("doc-sources.html");
const { selectors: { getSelectedSource }, getState } = dbg;

Просмотреть файл

@ -1,13 +1,13 @@
# wasmparser version
Current vesion is: 0.5.3
Current vesion is: 0.6.0
# Upgrade process
1. Pull latest release from npm and extract WasmDis.js and WasmParser.js, e.g.
```
curl https://registry.npmjs.org/wasmparser/-/wasmparser-0.5.3.tgz | tar -x --strip-components 2 package/dist/{WasmDis,WasmParser}.js
curl https://registry.npmjs.org/wasmparser/-/wasmparser-0.6.0.tgz | tar -x --strip-components 2 package/dist/{WasmDis,WasmParser}.js
```
2. Remove reference to source maps (last line)

126
devtools/client/shared/vendor/WasmDis.js поставляемый
Просмотреть файл

@ -1,4 +1,14 @@
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
Object.defineProperty(exports, "__esModule", { value: true });
/* Copyright 2016 Mozilla Foundation
*
@ -981,3 +991,119 @@ var WasmDisassembler = /** @class */ (function () {
return WasmDisassembler;
}());
exports.WasmDisassembler = WasmDisassembler;
var UNKNOWN_FUNCTION_PREFIX = "unknown";
var NameSectionNameResolver = /** @class */ (function (_super) {
__extends(NameSectionNameResolver, _super);
function NameSectionNameResolver(names) {
var _this = _super.call(this) || this;
_this._names = names;
return _this;
}
NameSectionNameResolver.prototype.getFunctionName = function (index, isImport, isRef) {
var name = this._names[index];
if (!name)
return "$" + UNKNOWN_FUNCTION_PREFIX + index;
return isRef ? "$" + name : "$" + name + " (;" + index + ";)";
};
return NameSectionNameResolver;
}(DefaultNameResolver));
var NameSectionReader = /** @class */ (function () {
function NameSectionReader() {
this._done = false;
this._functionsCount = 0;
this._functionImportsCount = 0;
this._functionNames = null;
this._hasNames = false;
}
NameSectionReader.prototype.read = function (reader) {
var _this = this;
if (this._done)
throw new Error('Invalid state: disassembly process was already finished.');
while (true) {
if (!reader.read())
return false;
switch (reader.state) {
case 2 /* END_WASM */:
if (!reader.hasMoreBytes()) {
this._done = true;
return true;
}
break;
case -1 /* ERROR */:
throw reader.error;
case 1 /* BEGIN_WASM */:
this._functionsCount = 0;
this._functionImportsCount = 0;
this._functionNames = [];
this._hasNames = false;
break;
case 4 /* END_SECTION */:
break;
case 3 /* BEGIN_SECTION */:
var sectionInfo = reader.result;
if (sectionInfo.id === 0 /* Custom */ &&
WasmParser_1.bytesToString(sectionInfo.name) === "name") {
break;
}
if (sectionInfo.id === 3 /* Function */ ||
sectionInfo.id === 2 /* Import */) {
break;
}
reader.skipSection();
break;
case 12 /* IMPORT_SECTION_ENTRY */:
var importInfo = reader.result;
if (importInfo.kind === 0 /* Function */)
this._functionImportsCount++;
break;
case 13 /* FUNCTION_SECTION_ENTRY */:
this._functionsCount++;
break;
case 19 /* NAME_SECTION_ENTRY */:
var nameInfo = reader.result;
if (nameInfo.type !== 1 /* Function */)
break;
var functionNameInfo = nameInfo;
functionNameInfo.names.forEach(function (naming) {
_this._functionNames[naming.index] = WasmParser_1.bytesToString(naming.name);
});
this._hasNames = true;
break;
default:
throw new Error("Expectected state: " + reader.state);
}
}
};
NameSectionReader.prototype.hasValidNames = function () {
return this._hasNames;
};
NameSectionReader.prototype.getNameResolver = function () {
if (!this.hasValidNames())
throw new Error("Has no valid name section");
// Fix bad names.
var functionNamesLength = this._functionImportsCount + this._functionsCount;
var functionNames = this._functionNames.slice(0, functionNamesLength);
var usedNameAt = Object.create(null);
for (var i = 0; i < functionNames.length; i++) {
var name_1 = functionNames[i];
if (!name_1)
continue;
var goodName = !(name_1 in usedNameAt) &&
!/[^0-9A-Za-z!#$%&'*+.:<=>?@^_`|~\/\-]/.test(name_1) &&
name_1.indexOf(UNKNOWN_FUNCTION_PREFIX) !== 0;
if (!goodName) {
if (usedNameAt[name_1] >= 0) {
// Remove all non-unique names.
functionNames[usedNameAt[name_1]] = null;
usedNameAt[name_1] = -1;
}
functionNames[i] = null;
continue;
}
usedNameAt[name_1] = i;
}
return new NameSectionNameResolver(functionNames);
};
return NameSectionReader;
}());
exports.NameSectionReader = NameSectionReader;