@opensumi/ide-debug 2.21.4-rc-1668395886.0 → 2.21.4

package/src/browser/editor/debug-hover-model.ts

@@ -1,38 +0,0 @@
-import { Injectable, Optional } from '@opensumi/di';
-import { TreeModel, TreeNodeEvent, CompositeTreeNode } from '@opensumi/ide-components';
-import { ThrottledDelayer, Emitter, Event } from '@opensumi/ide-core-browser';
-
-import { ExpressionContainer } from '../tree/debug-tree-node.define';
-
-@Injectable({ multiple: true })
-export class DebugHoverModel extends TreeModel {
-  static DEFAULT_FLUSH_DELAY = 100;
-
-  private flushDispatchChangeDelayer = new ThrottledDelayer<void>(DebugHoverModel.DEFAULT_FLUSH_DELAY);
-  private onWillUpdateEmitter: Emitter<void> = new Emitter();
-
-  constructor(@Optional() root: ExpressionContainer) {
-    super();
-    this.init(root);
-  }
-
-  get onWillUpdate(): Event<void> {
-    return this.onWillUpdateEmitter.event;
-  }
-
-  init(root: CompositeTreeNode) {
-    this.root = root;
-    // 分支更新时通知树刷新, 不是立即更新，而是延迟更新，待树稳定后再更新
-    // 100ms的延迟并不能保证树稳定，特别是在node_modules展开的情况下
-    // 但在普通使用上已经足够可用，即不会有渲染闪烁问题
-    this.root.watcher.on(TreeNodeEvent.BranchDidUpdate, () => {
-      if (!this.flushDispatchChangeDelayer.isTriggered()) {
-        this.flushDispatchChangeDelayer.cancel();
-      }
-      this.flushDispatchChangeDelayer.trigger(async () => {
-        await this.onWillUpdateEmitter.fireAndAwait();
-        this.dispatchChange();
-      });
-    });
-  }
-}

package/src/browser/editor/debug-hover-source.ts

@@ -1,107 +0,0 @@
-import { Injectable, Autowired } from '@opensumi/di';
-import { Event, Emitter } from '@opensumi/ide-core-browser';
-
-import { IDebugSessionManager } from '../../common';
-import { DebugSessionManager } from '../debug-session-manager';
-import {
-  DebugVariable,
-  DebugScope,
-  DebugVariableContainer,
-  DebugHoverVariableRoot,
-} from '../tree/debug-tree-node.define';
-
-
-export type ExpressionVariable = DebugHoverVariableRoot | DebugVariable | DebugVariableContainer | undefined;
-
-@Injectable()
-export class DebugHoverSource {
-  @Autowired(IDebugSessionManager)
-  protected readonly sessions: DebugSessionManager;
-
-  private onDidChangeEmitter: Emitter<ExpressionVariable> = new Emitter();
-  onDidChange: Event<ExpressionVariable> = this.onDidChangeEmitter.event;
-
-  dispose(): void {
-    this._expression = undefined;
-  }
-
-  protected _expression: ExpressionVariable;
-  get expression(): ExpressionVariable {
-    return this._expression;
-  }
-
-  public clearEvaluate(): void {
-    this.onDidChangeEmitter.fire(undefined);
-  }
-
-  async evaluate(expression: string): Promise<ExpressionVariable> {
-    const evaluated = await this.doEvaluate(expression);
-    this._expression = evaluated;
-    this.onDidChangeEmitter.fire(evaluated);
-    return evaluated;
-  }
-
-  protected async doEvaluate(expression: string): Promise<ExpressionVariable> {
-    const { currentSession } = this.sessions;
-    if (!currentSession) {
-      return undefined;
-    }
-    if (currentSession.capabilities.supportsEvaluateForHovers) {
-      const item = new DebugHoverVariableRoot(expression, currentSession);
-      await item.evaluate('hover');
-      return (item.available && item) || undefined;
-    }
-    return this.findVariable(
-      expression
-        .split('.')
-        .map((word) => word.trim())
-        .filter((word) => !!word),
-    );
-  }
-
-  protected async findVariable(namesToFind: string[]): Promise<DebugVariable | DebugVariableContainer | undefined> {
-    const { currentFrame } = this.sessions;
-    if (!currentFrame) {
-      return undefined;
-    }
-    let variable: DebugVariable | undefined;
-    const scopes = await currentFrame.getScopes();
-    for (const scope of scopes) {
-      const found = await this.doFindVariable(scope, namesToFind);
-      if (!variable) {
-        variable = found;
-      } else if (found && found.value !== variable.value) {
-        // 仅显示找到的所有表达式是否具有相同的值
-        return undefined;
-      }
-    }
-    return variable;
-  }
-
-  protected async doFindVariable(
-    owner: DebugScope | DebugVariableContainer,
-    namesToFind: string[],
-  ): Promise<DebugVariable | undefined> {
-    await owner.ensureLoaded();
-    const elements = owner.children;
-    const variables: (DebugVariable | DebugVariableContainer)[] = [];
-    if (!elements) {
-      return;
-    }
-    for (const element of elements) {
-      if (element instanceof DebugVariableContainer || element instanceof DebugVariable) {
-        if (element.name === namesToFind[0]) {
-          variables.push(element);
-        }
-      }
-    }
-    if (variables.length !== 1) {
-      return undefined;
-    }
-    if (namesToFind.length === 1) {
-      return variables[0] as DebugVariable;
-    } else {
-      return this.doFindVariable(variables[0] as DebugVariableContainer, namesToFind.slice(1));
-    }
-  }
-}

package/src/browser/editor/debug-hover-tree.model.service.ts

@@ -1,332 +0,0 @@
-import { Injectable, Autowired, INJECTOR_TOKEN, Injector } from '@opensumi/di';
-import {
-  DecorationsManager,
-  Decoration,
-  IRecycleTreeHandle,
-  WatchEvent,
-  TreeNodeEvent,
-} from '@opensumi/ide-components';
-import { Emitter, Deferred, Event, DisposableCollection, path, pSeries } from '@opensumi/ide-core-browser';
-
-import { DebugVariable, ExpressionContainer, ExpressionNode } from '../tree/debug-tree-node.define';
-import styles from '../view/variables/debug-variables.module.less';
-
-import { DebugHoverModel } from './debug-hover-model';
-import { ExpressionVariable, DebugHoverSource } from './debug-hover-source';
-
-const { Path } = path;
-
-export interface IDebugVariablesHandle extends IRecycleTreeHandle {
-  hasDirectFocus: () => boolean;
-}
-
-export interface IDebugHoverUpdateData {
-  treeModel?: DebugHoverModel;
-  variable?: DebugVariable;
-}
-
-@Injectable()
-export class DebugHoverTreeModelService {
-  private static DEFAULT_FLUSH_FILE_EVENT_DELAY = 100;
-
-  @Autowired(INJECTOR_TOKEN)
-  private readonly injector: Injector;
-
-  @Autowired(DebugHoverSource)
-  private readonly debugHoverSource: DebugHoverSource;
-
-  private _treeModel: DebugHoverModel;
-  private _whenReady: Promise<void>;
-
-  private _decorations: DecorationsManager;
-  private _debugHoverTreeHandle: IDebugVariablesHandle;
-
-  public flushEventQueueDeferred: Deferred<void> | null;
-  private _eventFlushTimeout: number;
-  private _changeEventDispatchQueue: string[] = [];
-
-  // 装饰器
-  private selectedDecoration: Decoration = new Decoration(styles.mod_selected); // 选中态
-  private focusedDecoration: Decoration = new Decoration(styles.mod_focused); // 焦点态
-  private loadingDecoration: Decoration = new Decoration(styles.mod_loading); // 加载态
-
-  // 即使选中态也是焦点态的节点
-  private _focusedNode: ExpressionContainer | ExpressionNode | undefined;
-  // 选中态的节点
-  private _selectedNodes: (ExpressionContainer | ExpressionNode)[] = [];
-
-  private preContextMenuFocusedNode: ExpressionContainer | ExpressionNode | null;
-
-  private onDidRefreshedEmitter: Emitter<void> = new Emitter();
-  private onDidUpdateTreeModelOrVariableEmitter: Emitter<IDebugHoverUpdateData | void> = new Emitter();
-
-  private disposableCollection: DisposableCollection = new DisposableCollection();
-
-  constructor() {
-    this.debugHoverSource.onDidChange(async (expression: ExpressionVariable | DebugVariable | undefined) => {
-      if (!expression) {
-        this.onDidUpdateTreeModelOrVariableEmitter.fire({ treeModel: undefined, variable: undefined });
-        return;
-      }
-
-      if (expression instanceof DebugVariable) {
-        this.dispose();
-        this.onDidUpdateTreeModelOrVariableEmitter.fire({ variable: expression });
-      } else {
-        await this.initTreeModel(expression);
-        this.onDidUpdateTreeModelOrVariableEmitter.fire({ treeModel: this.treeModel });
-      }
-    });
-  }
-
-  get onDidRefreshed(): Event<void> {
-    return this.onDidRefreshedEmitter.event;
-  }
-
-  get onDidUpdateTreeModelOrVariable(): Event<IDebugHoverUpdateData | void> {
-    return this.onDidUpdateTreeModelOrVariableEmitter.event;
-  }
-
-  get flushEventQueuePromise() {
-    return this.flushEventQueueDeferred && this.flushEventQueueDeferred.promise;
-  }
-
-  get treeHandle() {
-    return this._debugHoverTreeHandle;
-  }
-
-  get decorations() {
-    return this._decorations;
-  }
-
-  get treeModel() {
-    return this._treeModel;
-  }
-
-  get whenReady() {
-    return this._whenReady;
-  }
-
-  // 既是选中态，也是焦点态节点
-  get focusedNode() {
-    return this._focusedNode;
-  }
-  // 是选中态，非焦点态节点
-  get selectedNodes() {
-    return this._selectedNodes;
-  }
-
-  dispose() {
-    if (!this.disposableCollection.disposed) {
-      this.disposableCollection.dispose();
-    }
-  }
-
-  listenTreeViewChange() {
-    this.dispose();
-    this.disposableCollection.push(
-      this.treeModel?.root.watcher.on(TreeNodeEvent.WillResolveChildren, (target) => {
-        this.loadingDecoration.addTarget(target);
-      }),
-    );
-    this.disposableCollection.push(
-      this.treeModel?.root.watcher.on(TreeNodeEvent.DidResolveChildren, (target) => {
-        this.loadingDecoration.removeTarget(target);
-      }),
-    );
-    this.disposableCollection.push(
-      this.treeModel!.onWillUpdate(() => {
-        // 更新树前更新下选中节点
-        if (this.selectedNodes.length !== 0) {
-          // 仅处理一下单选情况
-          const node = this.treeModel?.root.getTreeNodeByPath(this.selectedNodes[0].path);
-          this.selectedDecoration.addTarget(node as ExpressionNode);
-        }
-      }),
-    );
-  }
-
-  async initTreeModel(root: ExpressionVariable) {
-    if (!root) {
-      return;
-    }
-    this._treeModel = this.injector.get<any>(DebugHoverModel, [root]);
-
-    this.initDecorations(root);
-    this.listenTreeViewChange();
-    return this._treeModel;
-  }
-
-  initDecorations(root) {
-    this._decorations = new DecorationsManager(root as any);
-    this._decorations.addDecoration(this.selectedDecoration);
-    this._decorations.addDecoration(this.focusedDecoration);
-    this._decorations.addDecoration(this.loadingDecoration);
-  }
-
-  // 清空其他选中/焦点态节点，更新当前焦点节点
-  activeNodeDecoration = (target: ExpressionContainer | ExpressionNode, dispatchChange = true) => {
-    if (this.preContextMenuFocusedNode) {
-      this.focusedDecoration.removeTarget(this.preContextMenuFocusedNode);
-      this.selectedDecoration.removeTarget(this.preContextMenuFocusedNode);
-      this.preContextMenuFocusedNode = null;
-    }
-    if (target) {
-      if (this.selectedNodes.length > 0) {
-        // 因为选择装饰器可能通过其他方式添加而不能及时在selectedNodes上更新
-        // 故这里遍历所有选中装饰器的节点进行一次统一清理
-        for (const target of this.selectedDecoration.appliedTargets.keys()) {
-          this.selectedDecoration.removeTarget(target);
-        }
-      }
-      if (this.focusedNode) {
-        this.focusedDecoration.removeTarget(this.focusedNode);
-      }
-      this.selectedDecoration.addTarget(target);
-      this.focusedDecoration.addTarget(target);
-      this._focusedNode = target;
-      this._selectedNodes = [target];
-
-      if (dispatchChange) {
-        // 通知视图更新
-        this.treeModel.dispatchChange();
-      }
-    }
-  };
-
-  // 清空其他焦点态节点，更新当前焦点节点，
-  // removePreFocusedDecoration 表示更新焦点节点时如果此前已存在焦点节点，之前的节点装饰器将会被移除
-  activeNodeFocusedDecoration = (target: ExpressionContainer | ExpressionNode, removePreFocusedDecoration = false) => {
-    if (this.focusedNode !== target) {
-      if (removePreFocusedDecoration) {
-        // 当存在上一次右键菜单激活的文件时，需要把焦点态的文件节点的装饰器全部移除
-        if (this.preContextMenuFocusedNode) {
-          this.focusedDecoration.removeTarget(this.preContextMenuFocusedNode);
-          this.selectedDecoration.removeTarget(this.preContextMenuFocusedNode);
-        } else if (this.focusedNode) {
-          // 多选情况下第一次切换焦点文件
-          this.focusedDecoration.removeTarget(this.focusedNode);
-        }
-        this.preContextMenuFocusedNode = target;
-      } else if (this.focusedNode) {
-        this.preContextMenuFocusedNode = null;
-        this.focusedDecoration.removeTarget(this.focusedNode);
-      }
-      if (target) {
-        this.selectedDecoration.addTarget(target);
-        this.focusedDecoration.addTarget(target);
-        this._focusedNode = target;
-        this._selectedNodes.push(target);
-      }
-    }
-    // 通知视图更新
-    this.treeModel.dispatchChange();
-  };
-
-  // 取消选中节点焦点
-  enactiveNodeDecoration = () => {
-    if (this.focusedNode) {
-      this.focusedDecoration.removeTarget(this.focusedNode);
-      this.treeModel.dispatchChange();
-    }
-    this._focusedNode = undefined;
-  };
-
-  removeNodeDecoration() {
-    if (!this.decorations) {
-      return;
-    }
-    this.decorations.removeDecoration(this.selectedDecoration);
-    this.decorations.removeDecoration(this.focusedDecoration);
-  }
-
-  handleTreeHandler(handle: IDebugVariablesHandle) {
-    this._debugHoverTreeHandle = handle;
-  }
-
-  handleTreeBlur = () => {
-    // 清空焦点状态
-    this.enactiveNodeDecoration();
-  };
-
-  handleTwistierClick = (item: ExpressionContainer | ExpressionNode) => {
-    // 单选操作默认先更新选中状态
-    if (!ExpressionContainer.is(item)) {
-      this.activeNodeDecoration(item);
-    } else {
-      this.activeNodeDecoration(item, false);
-      this.toggleDirectory(item as ExpressionContainer);
-    }
-  };
-
-  toggleDirectory = async (item: ExpressionContainer) => {
-    if (item.expanded) {
-      this.treeHandle.collapseNode(item);
-    } else {
-      this.treeHandle.expandNode(item);
-    }
-  };
-
-  /**
-   * 刷新指定下的所有子节点
-   */
-  async refresh(node: ExpressionContainer = this.treeModel.root as ExpressionContainer) {
-    if (!ExpressionContainer.is(node) && (node as ExpressionContainer).parent) {
-      node = (node as ExpressionContainer).parent as ExpressionContainer;
-    }
-    // 这里也可以直接调用node.refresh，但由于文件树刷新事件可能会较多
-    // 队列化刷新动作减少更新成本
-    this.queueChangeEvent(node.path, () => {
-      this.onDidRefreshedEmitter.fire();
-    });
-  }
-
-  // 队列化Changed事件
-  private queueChangeEvent(path: string, callback: any) {
-    if (!this.flushEventQueueDeferred) {
-      this.flushEventQueueDeferred = new Deferred<void>();
-      clearTimeout(this._eventFlushTimeout);
-      this._eventFlushTimeout = setTimeout(async () => {
-        await this.flushEventQueue()!;
-        this.flushEventQueueDeferred?.resolve();
-        this.flushEventQueueDeferred = null;
-        callback();
-      }, DebugHoverTreeModelService.DEFAULT_FLUSH_FILE_EVENT_DELAY) as any;
-    }
-    if (this._changeEventDispatchQueue.indexOf(path) === -1) {
-      this._changeEventDispatchQueue.push(path);
-    }
-  }
-
-  public flushEventQueue = () => {
-    let promise: Promise<any>;
-    if (!this._changeEventDispatchQueue || this._changeEventDispatchQueue.length === 0) {
-      return;
-    }
-    this._changeEventDispatchQueue.sort((pathA, pathB) => {
-      const pathADepth = Path.pathDepth(pathA);
-      const pathBDepth = Path.pathDepth(pathB);
-      return pathADepth - pathBDepth;
-    });
-    const roots = [this._changeEventDispatchQueue[0]];
-    for (const path of this._changeEventDispatchQueue) {
-      if (roots.some((root) => path.indexOf(root) === 0)) {
-        continue;
-      } else {
-        roots.push(path);
-      }
-    }
-    promise = pSeries(
-      roots.map((path) => async () => {
-        const watcher = this.treeModel.root?.watchEvents.get(path);
-        if (watcher && typeof watcher.callback === 'function') {
-          await watcher.callback({ type: WatchEvent.Changed, path });
-        }
-        return null;
-      }),
-    );
-    // 重置更新队列
-    this._changeEventDispatchQueue = [];
-    return promise;
-  };
-}

package/src/browser/editor/debug-hover-widget.tsx

@@ -1,200 +0,0 @@
-import debounce from 'lodash/debounce';
-import React from 'react';
-import ReactDOM from 'react-dom';
-
-import { Injectable, Autowired } from '@opensumi/di';
-import {
-  DisposableCollection,
-  Disposable,
-  AppConfig,
-  ConfigProvider,
-  IReporterService,
-} from '@opensumi/ide-core-browser';
-import type { ITextModel } from '@opensumi/monaco-editor-core/esm/vs/editor/common/model';
-import * as monaco from '@opensumi/monaco-editor-core/esm/vs/editor/editor.api';
-
-import {
-  DebugEditor,
-  IDebugSessionManager,
-  DEBUG_REPORT_NAME,
-  IDebugHoverWidget,
-  ShowDebugHoverOptions,
-  HideDebugHoverOptions,
-} from '../../common';
-import { DebugSessionManager } from '../debug-session-manager';
-
-import { DebugExpressionProvider } from './debug-expression-provider';
-import { DebugHoverSource } from './debug-hover-source';
-import { DebugHoverView } from './debug-hover.view';
-
-@Injectable()
-export class DebugHoverWidget implements IDebugHoverWidget {
-  static ID = 'debug-hover-widget';
-
-  protected readonly toDispose = new DisposableCollection();
-
-  public allowEditorOverflow = true;
-
-  @Autowired(DebugEditor)
-  protected readonly editor: DebugEditor;
-
-  @Autowired(IDebugSessionManager)
-  protected readonly sessions: DebugSessionManager;
-
-  @Autowired(DebugExpressionProvider)
-  protected readonly expressionProvider: DebugExpressionProvider;
-
-  @Autowired(DebugHoverSource)
-  protected readonly hoverSource: DebugHoverSource;
-
-  @Autowired(AppConfig)
-  private configContext: AppConfig;
-
-  @Autowired(IReporterService)
-  protected readonly reporterService: IReporterService;
-
-  protected domNode: HTMLElement;
-
-  constructor() {
-    this.init();
-  }
-
-  protected init(): void {
-    this.toDispose.pushAll([
-      Disposable.create(() => this.editor.removeContentWidget(this)),
-      Disposable.create(() => this.hide()),
-      this.sessions.onDidChange(() => {
-        if (!this.isEditorFrame()) {
-          this.hide();
-        }
-      }),
-    ]);
-    this.renderView();
-  }
-
-  handleWindowWheel(event) {
-    event.stopPropagation();
-  }
-
-  getId(): string {
-    return DebugHoverWidget.ID;
-  }
-
-  getDomNode() {
-    if (!this.domNode) {
-      this.domNode = document.createElement('div');
-      this.domNode.classList.add(DebugHoverWidget.ID);
-    }
-    return this.domNode;
-  }
-
-  getPosition(): monaco.editor.IContentWidgetPosition | null {
-    const position = this.options && this.options.selection.getStartPosition();
-    const word = position && this.editor.getModel()?.getWordAtPosition(position);
-    return position && word
-      ? {
-          position: new monaco.Position(position.lineNumber, word.startColumn),
-          preference: [
-            monaco.editor.ContentWidgetPositionPreference.BELOW,
-            monaco.editor.ContentWidgetPositionPreference.ABOVE,
-          ],
-        }
-      : null;
-  }
-
-  dispose(): void {
-    this.toDispose.dispose();
-  }
-
-  show(options?: ShowDebugHoverOptions): void {
-    this.schedule(() => this.doShow(options), options && options.immediate);
-  }
-
-  hide(options?: HideDebugHoverOptions): void {
-    this.schedule(() => this.doHide(), options && options.immediate);
-  }
-
-  protected options: ShowDebugHoverOptions | undefined;
-
-  protected schedule(fn: () => void, immediate = true): void {
-    if (immediate) {
-      this.doSchedule.cancel();
-      fn();
-    } else {
-      this.doSchedule(fn);
-    }
-  }
-  protected readonly doSchedule: any = debounce((fn: () => void) => fn(), 300);
-
-  protected isEditorFrame(): boolean {
-    const { currentFrame } = this.sessions;
-    return (
-      !!currentFrame &&
-      !!currentFrame.source &&
-      !!this.editor.getModel() &&
-      this.editor.getModel()!.uri.toString() === currentFrame.source.uri.toString()
-    );
-  }
-
-  protected doHide(): void {
-    window.removeEventListener('mousewheel', this.handleWindowWheel, true);
-    if (this.getDomNode().contains(document.activeElement)) {
-      this.editor.focus();
-    }
-    this.hoverSource.dispose();
-    this.hoverSource.clearEvaluate();
-    this.options = undefined;
-    this.editor.removeContentWidget(this);
-  }
-
-  protected layoutContentWidget(): void {
-    this.editor.layoutContentWidget(this);
-  }
-
-  private renderView(): void {
-    ReactDOM.render(
-      <ConfigProvider value={this.configContext}>
-        <DebugHoverView />
-      </ConfigProvider>,
-      this.getDomNode(),
-      () => {
-        this.layoutContentWidget();
-      },
-    );
-  }
-
-  protected async doShow(options: ShowDebugHoverOptions | undefined = this.options): Promise<void> {
-    if (!this.isEditorFrame()) {
-      return;
-    }
-
-    if (!options) {
-      return;
-    }
-
-    if (this.options && this.options.selection.equalsRange(options.selection)) {
-      return;
-    }
-
-    this.options = options;
-    const expression = await this.expressionProvider.get(
-      this.editor.getModel()! as unknown as ITextModel,
-      options.selection,
-    );
-    if (!expression) {
-      return;
-    }
-
-    this.hoverSource.clearEvaluate();
-
-    if (!(await this.hoverSource.evaluate(expression))) {
-      return;
-    }
-
-    this.reporterService.point(DEBUG_REPORT_NAME?.DEBUG_VARIABLES, 'hover', expression);
-
-    this.editor.addContentWidget(this);
-    // 展示变量面板时临时屏蔽滚轮事件
-    window.addEventListener('mousewheel', this.handleWindowWheel, true);
-  }
-}

package/src/browser/editor/debug-hover.module.less

@@ -1,29 +0,0 @@
-/** Hover */
-.debug_hover {
-  font-family: 'Menlo for Powerline', Menlo, Monaco, 'Courier New', monospace;
-  font-weight: normal;
-  font-size: 12px;
-  line-height: 21px;
-  letter-spacing: 0px;
-  background-color: var(--editor-background);
-  border: 1px solid rgb(79, 180, 216);
-  position: relative;
-}
-
-.debug_hover_title {
-  padding-left: 10px;
-  padding-right: 10px;
-  line-height: 18px;
-  font-size: 12px;
-  word-break: normal;
-  text-overflow: ellipsis;
-  height: 18px;
-  overflow: hidden;
-  white-space: pre;
-  &.has_complex_value {
-    max-width: 700px;
-    min-width: 400px;
-    border-bottom: 1px solid hsla(0, 0%, 50%, 0.35);
-    padding-left: 16px;
-  }
-}