From 8dd16259287f58f9273002717ec4d27e97127719 Mon Sep 17 00:00:00 2001 From: Daniel Baumann Date: Wed, 12 Jun 2024 07:43:14 +0200 Subject: Merging upstream version 127.0. Signed-off-by: Daniel Baumann --- .../client/debugger/src/components/Editor/index.js | 116 +++++++++++++++------ 1 file changed, 87 insertions(+), 29 deletions(-) (limited to 'devtools/client/debugger/src/components/Editor/index.js') diff --git a/devtools/client/debugger/src/components/Editor/index.js b/devtools/client/debugger/src/components/Editor/index.js index e21e05c11a..38040e3314 100644 --- a/devtools/client/debugger/src/components/Editor/index.js +++ b/devtools/client/debugger/src/components/Editor/index.js @@ -61,7 +61,6 @@ import { lineAtHeight, toSourceLine, getDocument, - scrollToPosition, toEditorPosition, getSourceLocationFromMouseEvent, hasDocument, @@ -149,15 +148,15 @@ class Editor extends PureComponent { this.props.selectedSourceTextContent?.value || nextProps.symbols !== this.props.symbols; + const shouldScroll = + nextProps.selectedLocation && + this.shouldScrollToLocation(nextProps, editor); + if (!features.codemirrorNext) { const shouldUpdateSize = nextProps.startPanelSize !== this.props.startPanelSize || nextProps.endPanelSize !== this.props.endPanelSize; - const shouldScroll = - nextProps.selectedLocation && - this.shouldScrollToLocation(nextProps, editor); - if (shouldUpdateText || shouldUpdateSize || shouldScroll) { startOperation(); if (shouldUpdateText) { @@ -183,6 +182,10 @@ class Editor extends PureComponent { if (shouldUpdateText) { this.setText(nextProps, editor); } + + if (shouldScroll) { + this.scrollToLocation(nextProps, editor); + } } } @@ -238,7 +241,12 @@ class Editor extends PureComponent { editor.setUpdateListener(this.onEditorUpdated); editor.setGutterEventListeners({ click: (event, cm, line) => this.onGutterClick(cm, line, null, event), - contextmenu: (event, cm, line) => this.openMenu(event, line, true), + contextmenu: (event, cm, line) => this.openMenu(event, line), + }); + editor.setContentEventListeners({ + click: (event, cm, line, column) => this.onClick(event, line, column), + contextmenu: (event, cm, line, column) => + this.openMenu(event, line, column), }); } this.setState({ editor }); @@ -278,7 +286,7 @@ class Editor extends PureComponent { } }; - componentDidUpdate(prevProps) { + componentDidUpdate(prevProps, prevState) { const { selectedSource, blackboxedRanges, @@ -295,7 +303,9 @@ class Editor extends PureComponent { if (features.codemirrorNext) { const shouldUpdateBreakableLines = prevProps.breakableLines.size !== this.props.breakableLines.size || - prevProps.selectedSource?.id !== selectedSource.id; + prevProps.selectedSource?.id !== selectedSource.id || + // Make sure we update after the editor has loaded + (!prevState.editor && !!editor); const isSourceWasm = isWasm(selectedSource.id); @@ -459,7 +469,7 @@ class Editor extends PureComponent { }; // Note: The line is optional, if not passed (as is likely for codemirror 6) // it fallsback to lineAtHeight. - openMenu(event, line) { + openMenu(event, line, ch) { event.stopPropagation(); event.preventDefault(); @@ -508,7 +518,7 @@ class Editor extends PureComponent { line ).trim(); - const lineObject = { from: { line }, to: { line } }; + const lineObject = { from: { line, ch }, to: { line, ch } }; this.props.showEditorGutterContextMenu( event, @@ -523,13 +533,23 @@ class Editor extends PureComponent { return; } - const location = getSourceLocationFromMouseEvent( - editor, - selectedSource, - event - ); + let location; + if (features.codemirrorNext) { + location = createLocation({ + source: selectedSource, + line: fromEditorLine( + selectedSource.id, + line, + isWasm(selectedSource.id) + ), + column: isWasm(selectedSource.id) ? 0 : ch + 1, + }); + } else { + location = getSourceLocationFromMouseEvent(editor, selectedSource, event); + } - this.props.showEditorContextMenu(event, editor, location); + const lineObject = editor.getSelectionCursor(); + this.props.showEditorContextMenu(event, editor, lineObject, location); } /** @@ -617,16 +637,29 @@ class Editor extends PureComponent { ); }; - onClick(e) { + onClick(e, line, ch) { const { selectedSource, updateCursorPosition, jumpToMappedLocation } = this.props; if (selectedSource) { - const sourceLocation = getSourceLocationFromMouseEvent( - this.state.editor, - selectedSource, - e - ); + let sourceLocation; + if (features.codemirrorNext) { + sourceLocation = createLocation({ + source: selectedSource, + line: fromEditorLine( + selectedSource.id, + line, + isWasm(selectedSource.id) + ), + column: isWasm(selectedSource.id) ? 0 : ch + 1, + }); + } else { + sourceLocation = getSourceLocationFromMouseEvent( + this.state.editor, + selectedSource, + e + ); + } if (e.metaKey && e.altKey) { jumpToMappedLocation(sourceLocation); @@ -664,8 +697,7 @@ class Editor extends PureComponent { const lineText = doc.getLine(line); column = Math.max(column, getIndentation(lineText)); } - - scrollToPosition(editor.codeMirror, line, column); + editor.scrollTo(line, column); } setText(props, editor) { @@ -774,6 +806,7 @@ class Editor extends PureComponent { }; } + // eslint-disable-next-line complexity renderItems() { const { selectedSource, @@ -788,19 +821,44 @@ class Editor extends PureComponent { } = this.props; const { editor } = this.state; + if (!selectedSource || !editor) { + return null; + } + if (features.codemirrorNext) { return React.createElement( React.Fragment, null, - React.createElement(Breakpoints, { - editor, - }), + React.createElement(Breakpoints, { editor }), React.createElement(DebugLine, { editor, selectedSource }), - React.createElement(Exceptions, { editor }) + React.createElement(HighlightLine, { editor }), + React.createElement(Exceptions, { editor }), + conditionalPanelLocation + ? React.createElement(ConditionalPanel, { + editor, + selectedSource, + }) + : null, + isPaused && + inlinePreviewEnabled && + (!selectedSource.isOriginal || + selectedSource.isPrettyPrinted || + mapScopesEnabled) + ? React.createElement(InlinePreviews, { + editor, + selectedSource, + }) + : null, + highlightedLineRange + ? React.createElement(HighlightLines, { + editor, + range: highlightedLineRange, + }) + : null ); } - if (!selectedSource || !editor || !getDocument(selectedSource.id)) { + if (!getDocument(selectedSource.id)) { return null; } return div( -- cgit v1.2.3