Microsoft/monaco-editor

Install actions does not work (Bulb widget)

Open

#2,477 创建于 2021年5月12日

在 GitHub 查看
 (4 评论) (0 反应) (0 负责人)JavaScript (14,836 star) (1,283 fork)batch import
bughelp wantedtypescript

描述

Hi all,

Context: Try to implement this editor on Angular.

PS: The files that I will refer to are under 'node_modules/monaco-editor/dev'

I I've lost one day on this.

Problem Nº 1:

After importing this lib into Angular, the editor loaded normally. Then i wrote:

import * as http from 'http';
export function hello() { return "";}

Bulb Action

I thought: Oh nice, it's recognize that I have to install node types. Then I clicked, nothing happen (Here I Go Again). Then after hours of investigating the editor's API, searching with the premise: "The MS software engineers must have designed the code with open-closed principle."

Conclusion: The registerCodeActionProvider kind worked, but will appear 3 actions (two of default system, and one that you added). Not acceptable!

Let's jump to Firefox debugger. The entity Action already comes without command, when you click on "Install type/node"

Where this object is created? I asked my self. After hours, I figure out, that the editor asks for suggestions to the tsWorker, the worker replies with the two semantic diagnostics (they have commands associated), then the editor, asks the tsModel to parse into actions (Here, is where the commands, emmited by the tsworker, are not even considered).

tsmodel.js L#1341

var action = {
  title: codeFix.description,
  edit: { edits: edits },
  diagnostics: context.markers,
  kind: 'quickfix',
};

My fix:

They do not use some random command assignment, so when you addCommand on editor's instance, the command ID is DYNAMIC_X

My quick fix for tsmodel.js L#1341

var action = {
  title: codeFix.description,
  edit: { edits: edits },
  diagnostics: context.markers,
  kind: 'quickfix',
};

// This is ugly
if(edits.length === 0) {
 action.command = {
                  id:'DYNAMIC_1',
                  title:'myFix',
                  arguments:[context.markers, codeFix]
  };
}
//codefix object
{
  "fixName": "fixCannotFindModule",
  "description": "Install '@types/node'",
  "changes": [],
  "commands": [
    {
      "type": "install package",
      "file": "file:///main.ts",
      "packageName": "@types/node"
    }
  ]
}

This is NOT a fix, the currect fix would be: either they do not register this CodeActionAdaptor on the line 1495 of tsModel and force the API user to provide their own implementation, or invoke this implementation if the user does not provide with any, and emit a warning, so the developer could quickly understand why nothing happened. As is, is the worse of the two worlds, you cannot extend the current implementation.

Problem Nº 2:

import * as http from 'http';
import {Component} from '@angular/core'; // Example, was my 3 line after "resolving" the Nº1
export function hello() { return "";}

Second

Well, this one was fast, because I already spend much time with source code.

tsWorker L#139702

return diagCode === errorCodeCannotFindModule
                ? (ts.JsTyping.nodeCoreModules.has(packageName) ? "@types/node" : undefined )
                : (((_a = host.isKnownTypesPackageName) === null || _a === void 0 ? void 0 : _a.call(host, packageName)) ? ts.getTypesPackageName(packageName) : undefined);

My quick fix:


return diagCode === errorCodeCannotFindModule
                ? (ts.JsTyping.nodeCoreModules.has(packageName) ? "@types/node" : packageName )
                : (((_a = host.isKnownTypesPackageName) === null || _a === void 0 ? void 0 : _a.call(host, packageName)) ? ts.getTypesPackageName(packageName) : undefined);

Fixed

This was a long-short time story, I've tried other methods. Inclusive I considered the option of clone VSCode repo, but when I saw the clang requirement, i think: "What are the odds of that compiling seamless?"

I've tried the angular wrapper: ngstack/code-editor, but the the types are downloaded but no resolved properly by the editor, and the problem Nº1 remained. (As a user, I've clicked to install nothing happened!)

Hope that someone would improve this and thank you for making this code open-source.

贡献者指南