SSL SmartTrace.js
Interaktion und PortierbarkeitJAVA
/* 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/. */
class SmartTrace extends Component { static get propTypes() { return {
stacktrace: PropTypes.array.isRequired,
onViewSource: PropTypes.func.isRequired,
onViewSourceInDebugger: PropTypes.func.isRequired, // Service to enable the source map feature.
sourceMapURLService: PropTypes.object, // A number in ms (defaults to 100) which we'll wait before doing the first actual // render of this component, in order to avoid shifting layout rapidly in case the // page is using sourcemap. // Setting it to 0 or anything else than a number will force the first render to // happen immediatly, without any delay.
initialRenderDelay: PropTypes.number,
onSourceMapResultDebounceDelay: PropTypes.number, // Function that will be called when the SmartTrace is ready, i.e. once it was // rendered.
onReady: PropTypes.func,
};
}
constructor(props) { super(props); this.state = {
hasError: false, // If a sourcemap service is passed, we want to introduce a small delay in rendering // so we can have the results from the sourcemap service, or render if they're not // available yet.
ready: !props.sourceMapURLService || !this.hasInitialRenderDelay(),
updateCount: 0, // Original positions for each indexed position
originalLocations: null,
};
}
// Without initial render delay, we don't have to do anything; if the frames are // sourcemapped, we will get new renders from onSourceMapServiceChange. if (!this.hasInitialRenderDelay()) { return;
}
// We wait either for the delay to be over (if it exists), or the sourcemapService // results to be available, before setting the state as initialized.
Promise.race([delay, sourceMapInit]).then(() => { if (this.initialRenderDelayTimeoutId) {
clearTimeout(this.initialRenderDelayTimeoutId);
} this.setState(state => ({ // Force-update so that the ready state is detected.
updateCount: state.updateCount + 1,
ready: true,
}));
});
}
}
componentDidMount() { if (this.props.onReady && this.state.ready) { this.props.onReady();
}
}
shouldComponentUpdate(_, nextState) { if (this.state.updateCount !== nextState.updateCount) { returntrue;
}
if (this.onFrameLocationChangedTimeoutId) {
clearTimeout(this.onFrameLocationChangedTimeoutId);
}
// Since a trace may have many original positions, we don't want to // constantly re-render every time one becomes available. To avoid this, // we only update the component after an initial timeout, and on a // debounce edge as more positions load after that. if (this.state.ready === true) { this.onFrameLocationChangedTimeoutId = setTimeout(() => { this.setState(state => ({
updateCount: state.updateCount + 1,
}));
}, this.props.onSourceMapResultDebounceDelay);
}
}
const frames = stacktrace.map(
(
{
filename,
sourceId,
lineNumber,
columnNumber,
functionName,
asyncCause,
},
i
) => { // Create partial debugger frontend "location" objects compliant with <Frames> react component requirements const sourceUrl = filename.split(" -> ").pop(); const generatedLocation = {
line: lineNumber,
column: columnNumber,
source: { // 'id' isn't used by Frames, but by selectFrame callback below
id: sourceId,
url: sourceUrl, // Used by FrameComponent
shortName: sourceUrl
? getDisplayURL(sourceUrl).filename
: getFormattedSourceId(sourceId),
},
};
let location = generatedLocation; const originalLocation = originalLocations?.[i]; if (originalLocation) {
location = {
line: originalLocation.line,
column: originalLocation.column,
source: {
url: originalLocation.url, // Used by FrameComponent
shortName: getDisplayURL(originalLocation.url).filename,
},
};
}
// Create partial debugger frontend "frame" objects compliant with <Frames> react component requirements return {
id: "fake-frame-id-" + i,
displayName: functionName,
asyncCause,
location, // Note that for now, Frames component only uses 'location' attribute // and never the 'generatedLocation'. // But the code below does, the selectFrame callback.
generatedLocation,
};
}
);
annotateFramesWithLibrary(frames);
Die Informationen auf dieser Webseite wurden
nach bestem Wissen sorgfältig zusammengestellt. Es wird jedoch weder Vollständigkeit, noch Richtigkeit,
noch Qualität der bereit gestellten Informationen zugesichert.
Bemerkung:
Die farbliche Syntaxdarstellung ist noch experimentell.