@opensumi/ide-testing 2.21.13 → 2.22.0

package/src/browser/outputPeek/test-message-container.tsx

@@ -0,0 +1,183 @@
+import React, { useEffect, useRef, useState } from 'react';
+import ReactDOM from 'react-dom';
+
+import { IOpenerService, useInjectable } from '@opensumi/ide-core-browser';
+import { Disposable, IMarkdownString, Schemes, URI } from '@opensumi/ide-core-common';
+import {
+  EditorCollectionService,
+  getSimpleEditorOptions,
+  IDiffEditor,
+  IEditorDocumentModelService,
+} from '@opensumi/ide-editor/lib/browser';
+import { Markdown } from '@opensumi/ide-markdown';
+import { IDiffEditorOptions, IEditorOptions } from '@opensumi/ide-monaco/lib/browser/monaco-api/editor';
+
+import { TestPeekMessageToken } from '../../common';
+import { ITestErrorMessage } from '../../common/testCollection';
+import styles from '../components/testing.module.less';
+
+import { TestDto } from './test-output-peek';
+import { TestingPeekMessageServiceImpl } from './test-peek-message.service';
+
+enum EContainerType {
+  DIFF,
+  PLANTTEXT,
+  MARKDOWN,
+}
+
+const commonEditorOptions: IEditorOptions = {
+  scrollBeyondLastLine: false,
+  scrollbar: {
+    verticalScrollbarSize: 14,
+    horizontal: 'auto',
+    useShadows: true,
+    verticalHasArrows: false,
+    horizontalHasArrows: false,
+    alwaysConsumeMouseWheel: false,
+  },
+  fixedOverflowWidgets: true,
+  readOnly: true,
+  minimap: {
+    enabled: false,
+  },
+};
+
+const diffEditorOptions: IDiffEditorOptions = {
+  ...commonEditorOptions,
+  enableSplitViewResizing: true,
+  renderOverviewRuler: false,
+  ignoreTrimWhitespace: false,
+  renderSideBySide: true,
+};
+
+const getMessage = (dto?: TestDto) =>
+  dto ? dto.messages[dto.messageIndex] : { message: '', actual: '', expected: '' };
+
+const ShadowContent = ({ root, children }) => ReactDOM.createPortal(children, root);
+
+const MarkdownContentProvider = (props: { dto: TestDto | undefined }) => {
+  const openerService: IOpenerService = useInjectable(IOpenerService);
+
+  const shadowRootRef = useRef<HTMLDivElement | null>(null);
+  const [message, useMessage] = useState<string>('');
+  const [shadowRoot, setShadowRoot] = useState<ShadowRoot | null>(null);
+
+  const handleLinkClick = (uri: URI) => {
+    if (uri && uri.scheme === Schemes.command) {
+      openerService.open(uri);
+    }
+  };
+
+  React.useEffect(() => {
+    if (shadowRootRef.current) {
+      const { dto } = props;
+      const shadowRootElement = shadowRootRef.current.attachShadow({ mode: 'open' });
+      if (!shadowRoot) {
+        setShadowRoot(shadowRootElement);
+      }
+
+      const mdStr = getMessage(dto).message;
+      // 不处理 \t 制表符
+      const message = mdStr ? (mdStr as IMarkdownString).value.replace(/\t/g, '') : '';
+      useMessage(message);
+    }
+  }, []);
+
+  return (
+    <div ref={shadowRootRef} className={styles.preview_markdown}>
+      {shadowRoot && (
+        <ShadowContent root={shadowRoot}>
+          <Markdown content={message} onLinkClick={handleLinkClick}></Markdown>
+        </ShadowContent>
+      )}
+    </div>
+  );
+};
+
+const DiffContentProvider = React.memo((props: { dto: TestDto | undefined }) => {
+  const { dto } = props;
+  const documentModelService: IEditorDocumentModelService = useInjectable(IEditorDocumentModelService);
+  const editorCollectionService: EditorCollectionService = useInjectable(EditorCollectionService);
+  const editorRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    if (!dto) {
+      return;
+    }
+    let diffEditor: IDiffEditor;
+
+    const { expectedUri, actualUri } = dto;
+    Promise.all([
+      documentModelService.createModelReference(expectedUri),
+      documentModelService.createModelReference(actualUri),
+    ]).then((data) => {
+      const [original, modified] = data;
+      const { actual, expected } = getMessage(dto) as ITestErrorMessage;
+
+      diffEditor = editorCollectionService.createDiffEditor(editorRef.current!, {
+        ...getSimpleEditorOptions(),
+        ...diffEditorOptions,
+      });
+
+      const originalModel = original.instance.getMonacoModel();
+      const modifiedModel = modified.instance.getMonacoModel();
+
+      originalModel.setValue(expected!);
+      modifiedModel.setValue(actual!);
+
+      diffEditor.compare(original, modified);
+
+      diffEditor.originalEditor.monacoEditor.setModel(originalModel);
+      diffEditor.modifiedEditor.monacoEditor.setModel(modifiedModel);
+    });
+
+    return () => {
+      if (diffEditor) {
+        diffEditor.dispose();
+      }
+    };
+  }, []);
+
+  return <div ref={editorRef} style={{ height: 'inherit' }}></div>;
+});
+
+export const TestMessageContainer = () => {
+  const testingPeekMessageService: TestingPeekMessageServiceImpl = useInjectable(TestPeekMessageToken);
+
+  const [type, setType] = useState<EContainerType>();
+  const [dto, setDto] = useState<TestDto>();
+
+  useEffect(() => {
+    const disposer: Disposable = new Disposable();
+
+    disposer.addDispose(
+      testingPeekMessageService.onDidReveal(async (dto: TestDto) => {
+        setDto(dto);
+        const message = getMessage(dto);
+        if (dto.isDiffable) {
+          setType(EContainerType.DIFF);
+        } else if (!(dto.isDiffable || typeof message.message === 'string')) {
+          setType(EContainerType.MARKDOWN);
+        } else {
+          setType(EContainerType.PLANTTEXT);
+        }
+      }),
+    );
+
+    return () => {
+      disposer.dispose();
+    };
+  }, []);
+
+  return (
+    <div className={styles.test_output_peek_message_container} style={{ height: '100%' }}>
+      {type === EContainerType.DIFF ? (
+        <DiffContentProvider dto={dto} />
+      ) : type === EContainerType.MARKDOWN ? (
+        <MarkdownContentProvider dto={dto} />
+      ) : type === EContainerType.PLANTTEXT ? (
+        getMessage(dto).message
+      ) : null}
+    </div>
+  );
+};

package/src/browser/outputPeek/test-output-peek.ts

@@ -0,0 +1,282 @@
+import { Injectable, Optional, Autowired, INJECTOR_TOKEN, Injector } from '@opensumi/di';
+import { EDITOR_COMMANDS, IContextKeyService, Schemes } from '@opensumi/ide-core-browser';
+import { CommandService, Disposable, IDisposable, MutableDisposable, URI } from '@opensumi/ide-core-common';
+import { IEditor, IEditorFeatureContribution } from '@opensumi/ide-editor/lib/browser';
+import { Range } from '@opensumi/monaco-editor-core/esm/vs/editor/common/core/range';
+import * as editorCommon from '@opensumi/monaco-editor-core/esm/vs/editor/common/editorCommon';
+
+import { ITestResult, TestResultServiceToken } from '../../common/test-result';
+import { IRichLocation, ITestItem, ITestMessage, TestMessageType, TestResultItem } from '../../common/testCollection';
+import { TestingPeekOpenerServiceToken } from '../../common/testingPeekOpener';
+import { isDiffable } from '../../common/testingStates';
+import { TestContextKey } from '../test-contextkey.service';
+import { TestResultServiceImpl } from '../test.result.service';
+
+import { buildTestUri, TestUriType } from './../../common/testingUri';
+import { TestingPeekOpenerServiceImpl } from './test-peek-opener.service';
+import { TestingOutputPeek } from './test-peek-widget';
+
+export class TestDto {
+  public readonly test: ITestItem;
+  public readonly messages: ITestMessage[];
+  public readonly expectedUri: URI;
+  public readonly actualUri: URI;
+  public readonly messageUri: URI;
+  public readonly revealLocation: IRichLocation | undefined;
+
+  public get isDiffable() {
+    const message = this.messages[this.messageIndex];
+    return message.type === TestMessageType.Error && isDiffable(message);
+  }
+
+  constructor(
+    public readonly resultId: string,
+    test: TestResultItem,
+    public readonly taskIndex: number,
+    public readonly messageIndex: number,
+  ) {
+    this.test = test.item;
+    this.messages = test.tasks[taskIndex].messages;
+    this.messageIndex = messageIndex;
+
+    const parts = { messageIndex, resultId, taskIndex, testExtId: test.item.extId };
+    this.expectedUri = buildTestUri({ ...parts, type: TestUriType.ResultExpectedOutput });
+    this.actualUri = buildTestUri({ ...parts, type: TestUriType.ResultActualOutput });
+    this.messageUri = buildTestUri({ ...parts, type: TestUriType.ResultMessage });
+
+    const message = this.messages[this.messageIndex];
+    this.revealLocation =
+      message.location ??
+      (test.item.uri && test.item.range ? { uri: test.item.uri, range: Range.lift(test.item.range) } : undefined);
+  }
+}
+
+@Injectable({ multiple: true })
+export class TestOutputPeekContribution implements IEditorFeatureContribution {
+  @Autowired(INJECTOR_TOKEN)
+  private readonly injector: Injector;
+
+  @Autowired(TestResultServiceToken)
+  private readonly testResultService: TestResultServiceImpl;
+
+  @Autowired(TestingPeekOpenerServiceToken)
+  private readonly testingPeekOpenerService: TestingPeekOpenerServiceImpl;
+
+  @Autowired(IContextKeyService)
+  private readonly contextKeyService: IContextKeyService;
+
+  @Autowired(CommandService)
+  private readonly commandService: CommandService;
+
+  private readonly testContextKey: TestContextKey;
+
+  private readonly disposer: Disposable = new Disposable();
+
+  private readonly peekView = new MutableDisposable<TestingOutputPeek>();
+
+  private currentPeekUri: URI | undefined;
+
+  constructor(@Optional() private readonly editor: IEditor) {
+    this.testContextKey = this.injector.get(TestContextKey, [(this.editor.monacoEditor as any)._contextKeyService]);
+  }
+
+  private allMessages(results: readonly ITestResult[]): {
+    result: ITestResult;
+    test: TestResultItem;
+    taskIndex: number;
+    messageIndex: number;
+  }[] {
+    const messages: {
+      result: ITestResult;
+      test: TestResultItem;
+      taskIndex: number;
+      messageIndex: number;
+    }[] = [];
+
+    for (const result of results) {
+      for (const test of result.tests) {
+        for (let taskIndex = 0; taskIndex < test.tasks.length; taskIndex++) {
+          for (let messageIndex = 0; messageIndex < test.tasks[taskIndex].messages.length; messageIndex++) {
+            messages.push({ result, test, taskIndex, messageIndex });
+          }
+        }
+      }
+    }
+
+    return messages;
+  }
+
+  public contribute(): IDisposable {
+    this.disposer.addDispose(
+      this.editor.monacoEditor.onDidChangeModel((e: editorCommon.IModelChangedEvent) => {
+        if (e.newModelUrl?.scheme !== Schemes.file) {
+          return;
+        }
+
+        this.testingPeekOpenerService.setPeekContrib(e.newModelUrl as unknown as URI, this);
+      }),
+    );
+
+    this.disposer.addDispose(
+      Disposable.create(() => {
+        if (this.editor.currentUri) {
+          this.testingPeekOpenerService.delPeekContrib(this.editor.currentUri);
+        }
+      }),
+    );
+    return this.disposer;
+  }
+
+  public toggle(uri: URI) {
+    if (this.currentPeekUri?.toString() === uri.toString()) {
+      this.peekView.clear();
+    } else {
+      this.show(uri);
+    }
+  }
+
+  public openCurrentInEditor() {
+    const current = this.peekView.value?.current;
+    if (!current) {
+      return;
+    }
+
+    if (current.isDiffable) {
+      this.commandService.executeCommand(
+        EDITOR_COMMANDS.API_OPEN_DIFF_EDITOR_COMMAND_ID,
+        current.expectedUri,
+        current.actualUri,
+        'Expected <-> Actual',
+      );
+    } else {
+      this.commandService.executeCommand(EDITOR_COMMANDS.OPEN_RESOURCE.id, current.messageUri, {
+        preview: false,
+        focus: true,
+      });
+    }
+  }
+
+  public removePeek() {
+    this.peekView.value?.hide();
+    this.peekView.clear();
+  }
+
+  public async show(uri: URI): Promise<void> {
+    const dto = this.testResultService.retrieveTest(uri);
+    if (!dto) {
+      return;
+    }
+
+    if (!this.peekView.value) {
+      this.peekView.value = this.injector.get(TestingOutputPeek, [this.editor.monacoEditor, this.contextKeyService]);
+      this.disposer.addDispose(
+        this.peekView.value.onDidClose(() => {
+          this.testContextKey.contextTestingIsPeekVisible.set(false);
+          this.currentPeekUri = undefined;
+          this.peekView.value = undefined;
+        }),
+      );
+
+      this.testContextKey.contextTestingIsPeekVisible.set(true);
+      this.peekView.value.create();
+    }
+
+    this.peekView.value.setModel(dto);
+    this.currentPeekUri = uri;
+  }
+
+  public async openAndShow(uri: URI) {
+    const dto = this.testResultService.retrieveTest(uri);
+    if (!dto) {
+      return;
+    }
+
+    if (!dto.revealLocation || dto.revealLocation.uri.toString() === this.editor.currentUri?.toString()) {
+      return this.show(uri);
+    }
+
+    const ctor = this.testingPeekOpenerService.peekControllerMap.get(uri.toString());
+
+    if (!ctor) {
+      return;
+    }
+
+    this.removePeek();
+
+    await this.commandService.executeCommand(EDITOR_COMMANDS.OPEN_RESOURCE.id, URI.parse(uri.toString()), {
+      preview: true,
+      focus: true,
+    });
+
+    ctor.show(uri);
+  }
+
+  public next() {
+    const dto = this.peekView.value?.current;
+    if (!dto) {
+      return;
+    }
+
+    let found = false;
+    const getAllMessage = this.allMessages(this.testResultService.results);
+
+    for (const { messageIndex, taskIndex, result, test } of getAllMessage) {
+      if (found) {
+        this.openAndShow(
+          buildTestUri({
+            type: TestUriType.ResultMessage,
+            messageIndex,
+            taskIndex,
+            resultId: result.id,
+            testExtId: test.item.extId,
+          }),
+        );
+        return;
+      } else if (
+        dto.test.extId === test.item.extId &&
+        dto.messageIndex === messageIndex &&
+        dto.taskIndex === taskIndex &&
+        dto.resultId === result.id
+      ) {
+        found = true;
+      }
+    }
+  }
+
+  public previous() {
+    const dto = this.peekView.value?.current;
+    if (!dto) {
+      return;
+    }
+
+    let previous: { messageIndex: number; taskIndex: number; result: ITestResult; test: TestResultItem } | undefined;
+
+    const getAllMessage = this.allMessages(this.testResultService.results);
+
+    for (const m of getAllMessage) {
+      if (
+        dto.test.extId === m.test.item.extId &&
+        dto.messageIndex === m.messageIndex &&
+        dto.taskIndex === m.taskIndex &&
+        dto.resultId === m.result.id
+      ) {
+        if (!previous) {
+          return;
+        }
+
+        this.openAndShow(
+          buildTestUri({
+            type: TestUriType.ResultMessage,
+            messageIndex: previous.messageIndex,
+            taskIndex: previous.taskIndex,
+            resultId: previous.result.id,
+            testExtId: previous.test.item.extId,
+          }),
+        );
+        return;
+      }
+
+      previous = m;
+    }
+  }
+}

package/src/browser/outputPeek/test-peek-message.service.ts

@@ -0,0 +1,15 @@
+import { Injectable, Autowired } from '@opensumi/di';
+import { Disposable, URI, Emitter } from '@opensumi/ide-core-common';
+
+import { ITestingPeekMessageService } from '../../common';
+
+import { TestDto } from './test-output-peek';
+
+@Injectable()
+export class TestingPeekMessageServiceImpl extends Disposable implements ITestingPeekMessageService {
+  public readonly _didReveal = new Emitter<TestDto>();
+  public readonly _visibilityChange = new Emitter<boolean>();
+
+  public readonly onDidReveal = this._didReveal.event;
+  public readonly onVisibilityChange = this._visibilityChange.event;
+}

package/src/browser/outputPeek/test-peek-opener.service.ts

@@ -0,0 +1,131 @@
+import { Injectable, Autowired } from '@opensumi/di';
+import { Disposable, URI } from '@opensumi/ide-core-common';
+import { WorkbenchEditorService } from '@opensumi/ide-editor';
+import { ITextEditorOptions } from '@opensumi/monaco-editor-core/esm/vs/platform/editor/common/editor';
+
+import { ITestResult, TestResultServiceToken } from '../../common/test-result';
+import { ITestMessage, ITestTaskState, TestResultItem } from '../../common/testCollection';
+import { ITestingPeekOpenerService } from '../../common/testingPeekOpener';
+import { buildTestUri, ParsedTestUri, TestUriType } from '../../common/testingUri';
+import { TestResultServiceImpl } from '../test.result.service';
+
+import { TestOutputPeekContribution } from './test-output-peek';
+
+type TestUriWithDocument = ParsedTestUri & { documentUri: URI };
+
+const mapFindTestMessage = <T>(
+  test: TestResultItem,
+  fn: (task: ITestTaskState, message: ITestMessage, messageIndex: number, taskIndex: number) => T | undefined,
+) => {
+  for (let taskIndex = 0; taskIndex < test.tasks.length; taskIndex++) {
+    const task = test.tasks[taskIndex];
+    for (let messageIndex = 0; messageIndex < task.messages.length; messageIndex++) {
+      const r = fn(task, task.messages[messageIndex], messageIndex, taskIndex);
+      if (r !== undefined) {
+        return r;
+      }
+    }
+  }
+
+  return undefined;
+};
+
+@Injectable()
+export class TestingPeekOpenerServiceImpl extends Disposable implements ITestingPeekOpenerService {
+  @Autowired(WorkbenchEditorService)
+  private editorService: WorkbenchEditorService;
+
+  @Autowired(TestResultServiceToken)
+  private readonly testResultService: TestResultServiceImpl;
+
+  declare _serviceBrand: undefined;
+
+  private lastUri?: TestUriWithDocument;
+
+  public readonly peekControllerMap: Map<string, TestOutputPeekContribution> = new Map();
+
+  public get currentUri(): URI | undefined {
+    return this.editorService.currentEditor?.currentUri!;
+  }
+
+  private async showPeekFromUri(testUri: TestUriWithDocument, options?: ITextEditorOptions) {
+    const editor = this.editorService.currentEditor;
+
+    this.lastUri = testUri;
+
+    const uri = buildTestUri(this.lastUri);
+    const ctor = this.peekControllerMap.get(editor?.currentUri!.toString()!);
+    ctor?.show(uri);
+
+    return true;
+  }
+
+  private getAnyCandidateMessage() {
+    const seen = new Set<string>();
+    for (const result of this.testResultService.results) {
+      for (const test of result.tests) {
+        if (seen.has(test.item.extId)) {
+          continue;
+        }
+
+        seen.add(test.item.extId);
+        const found = mapFindTestMessage(
+          test,
+          (task, message, messageIndex, taskIndex) =>
+            message.location && {
+              type: TestUriType.ResultMessage,
+              testExtId: test.item.extId,
+              resultId: result.id,
+              taskIndex,
+              messageIndex,
+              documentUri: message.location.uri,
+            },
+        );
+
+        if (found) {
+          return found;
+        }
+      }
+    }
+
+    return undefined;
+  }
+
+  public setPeekContrib(uri: URI, contrib: TestOutputPeekContribution): this {
+    const uriStr = uri.toString();
+    if (!this.peekControllerMap.has(uriStr)) {
+      this.peekControllerMap.set(uriStr, contrib);
+    }
+    return this;
+  }
+
+  public delPeekContrib(uri: URI): this {
+    const uriStr = uri.toString();
+    this.peekControllerMap.delete(uriStr);
+    return this;
+  }
+
+  public tryPeekFirstError(result: ITestResult, test: TestResultItem, options?: Partial<ITextEditorOptions>): boolean {
+    throw new Error('Method not implemented.');
+  }
+
+  public async open(): Promise<boolean> {
+    let uri: any;
+
+    if (!uri) {
+      uri = this.getAnyCandidateMessage();
+    }
+
+    if (!uri) {
+      return false;
+    }
+
+    return this.showPeekFromUri(uri);
+  }
+
+  public closeAllPeeks(): void {
+    for (const ctor of this.peekControllerMap.values()) {
+      ctor.removePeek();
+    }
+  }
+}

package/src/browser/outputPeek/test-peek-widget.less

@@ -0,0 +1,86 @@
+// @import '~@opensumi/ide-monaco-enhance/lib/browser/styles.module.less';
+
+.peekview-widget .head {
+  box-sizing: border-box;
+  display: flex;
+}
+
+.peekview-widget .head .peekview-title {
+  display: flex;
+  align-items: center;
+  font-size: 13px;
+  margin-left: 20px;
+  min-width: 0;
+}
+
+.peekview-widget .head .peekview-title.clickable {
+  cursor: pointer;
+}
+
+.peekview-widget .head .peekview-title .dirname:not(:empty) {
+  font-size: 0.9em;
+  margin-left: 0.5em;
+}
+
+.peekview-widget .head .peekview-title .meta {
+  white-space: nowrap;
+}
+
+.peekview-widget .head .peekview-title .dirname {
+  white-space: nowrap;
+  color: var(--descriptionForeground);
+}
+
+.peekview-widget .head .peekview-title .filename {
+  color: var(--kt-accentForeground);
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.peekview-widget .head .peekview-title .meta:not(:empty)::before {
+  content: '-';
+  padding: 0 0.3em;
+}
+
+.peekview-widget .head .peekview-actions {
+  display: flex;
+  justify-content: right;
+
+  .action-item {
+    line-height: inherit;
+    cursor: pointer;
+    margin-left: 6px;
+  }
+}
+
+.peekview-widget > .body {
+  border-top: 1px solid;
+  position: relative;
+}
+
+.peekview-widget .head .peekview-title .codicon {
+  margin-right: 4px;
+}
+
+.testing-output-peek-container {
+  border-top-color: var(--errorForeground);
+  border-bottom-color: var(--errorForeground);
+  border-top-width: 1px;
+  border-bottom-width: 1px;
+  border-top-style: solid;
+  border-bottom-style: solid;
+  top: 6px;
+  overflow: hidden;
+
+  .head {
+    background-color: var(--testing-peekHeaderBackground);
+    height: 22px;
+    line-height: 22px;
+  }
+
+  .body {
+    border-color: var(--errorForeground);
+    height: inherit;
+  }
+}