Export getTypeScriptWorker & getJavaScriptWorker to monaco.languages.typescript

[paveldk]

The idea behind this pull request is to enable and export the typescript compilation for multiple files.

You can now create multiple models with:

resourceUri = Monaco.Uri.file(filePath);
model = Monaco.editor.createModel(fileContent, language, resourceUri);

(will be good idea to cache those)

In this way, you will feed the typescriptService host with all your available files and then you can simply call:

    Monaco.languages.typescript.getTypeScriptWorker()
            .then(function(worker) {
                worker(model.uri)
                      .then(function(client) {
                            client.getEmitOutput(model.uri.toString().then(function(r) {});
                      });
            });

Which will compile the file you have already created Model for.

We are attaching the function to the Monaco.languages.typescript object so we can use it for multiple files/models and not just the current one.

As this is my first PR I want to make a small step before exposing the whole API (will probably iterate through the worker functions and add those to exports)

Related to microsoft/monaco-editor#35

[msftclas]

Hi @paveldk, I'm your friendly neighborhood Microsoft Pull Request Bot (You can call me MSBOT). Thanks for your contribution!

In order for us to evaluate and accept your PR, we ask that you sign a contribution license agreement. It's all electronic and will take just minutes. I promise there's no faxing. https://cla.microsoft.com.

TTYL, MSBOT;

[paveldk]

ping @jrieken

[jrieken]

This won't work cos the method is being called twice which means either JS or TS wins and you never know what you got. I'd make the setupMode method return the client and inside setupTypeScript resp setupJavaScript set the proper state for getJavaScriptWorker and getTypeScriptWorker. Before that those method should simply reject

[paveldk]

Yup, just figured out the same thing a couple of hours ago. Will apply fix now.

[paveldk]

Should there be just one worker for both JS and TS or 2 separate? If they are separate wouldn't the completion be laggy?

[jrieken]

Two workers as we have it now. Since they are scoped one is asked for JS files and the other for TS files

[paveldk]

I see how this is better and I can agree with this approach. But if we want to have cross-js-ts completions we either have to use one worker here or change how monaco works with SuggestAdapters and concat results from multiple that can be responsible for certain fail type.

[jrieken]

No, both are two separate 'extensions' and cannot be married in that way cos it will disallow having different configurations (compiler options, extra libs) for each. That doesn't mean you cannot have JS files in TypeScript - use the allowJS-options and add them as extra lib or just add JS content as TS-file.

[paveldk]

@jrieken applied changes -> now exports the workers and all functions are available for use

[jrieken]

Instead of the client you could export the worker function here. It already does the right thing. Also note that you should have a signature that takes n resources otherwise there framework might drop them again

[jrieken]

LGTM

[ErkoKnoll]

Works nicely, however I'm adding some additional libraries using monaco.languages.typescript.typescriptDefaults.addExtraLib function and when I compile using your proposed solution where the model is derived from the editor (editor.getModel()) then it only compiles what's written in the editor and everything that is added using addExtraLib function is ignored in the compiled output.

Is it possible to have compiler including also the files added using addExtraLib function so the compiled output contains everything in the context and not only whats written in the editor?

I guess it would be possible to manually concatenate everything that was added as extra libs including the editor content to a single model and then have it compiled but it seems rather manual.

[Viatorus]

@ThorConzales
Did you solve the issue with additional libraries?

[ErkoKnoll]

I solved it by concatenating everything to a single file and compiling it with typescript-simple.

[rjamesnw]

Is there any docs on this yet? What functions are exposed? I was hoping to get access to the language service itself but it seems you made proxies using promises instead.

Some TypeScript definitions would have been enough; not sure why the service returns "any" when it could have returned the promise structures.

[rjamesnw]

After some more research and reviewing the debugger, I created this if it helps anyone:

namespace ts {
    export interface IMonacoTypeScriptServiceProxy {
        _getModel(uri: string): Promise<{ _eol: string, _lineStarts: any, _Lines: string[], length: number, _uri: monaco.Uri, _versionId: number }>;
        getCompilationSettings(): Promise<CompilerOptions>;
        getCompilerOptionsDiagnostics(): Promise<Diagnostic[]>;
        getCompletionEntryDetails(uri: string, position: number, name: string, formatOptions: FormatCodeOptions | FormatCodeSettings | undefined, source: string | undefined, preferences: UserPreferences | undefined): Promise<CompletionEntryDetails | undefined>;
        getCompletionsAtPosition(uri: string, position: number, options: GetCompletionsAtPositionOptions | undefined): Promise<WithMetadata<CompletionInfo> | undefined>;
        getCurrentDirectory(): Promise<string>;
        getDefaultLibFileName(options: CompilerOptions): Promise<string>;
        getDefinitionAtPosition(uri: string, position: number): Promise<ReadonlyArray<DefinitionInfo> | undefined>;
        getEmitOutput(uri: string, emitOnlyDtsFiles?: boolean): Promise<EmitOutput>;
        getFormattingEditsAfterKeystroke(uri: string, position: number, key: string, options: FormatCodeOptions | FormatCodeSettings): Promise<TextChange[]>;
        getFormattingEditsForDocument(uri: string, options: FormatCodeOptions | FormatCodeSettings): Promise<TextChange[]>;
        getFormattingEditsForRange(uri: string, start: number, end: number, options: FormatCodeOptions | FormatCodeSettings): Promise<TextChange[]>;
        getNavigationBarItems(uri: string): Promise<NavigationBarItem[]>;
        getOccurrencesAtPosition(uri: string, position: number): Promise<ReadonlyArray<ReferenceEntry> | undefined>;
        getQuickInfoAtPosition(uri: string, position: number): Promise<QuickInfo | undefined>;
        getReferencesAtPosition(uri: string, position: number): Promise<ReferenceEntry[] | undefined>;
        getScriptFileNames(): Promise<string[]>;
        getScriptKind(uri: string): Promise<ScriptKind>;
        getScriptSnapshot(uri: string): Promise<IScriptSnapshot | undefined>;
        getScriptVersion(uri: string): Promise<string>;
        /** The first time this is called, it will return global diagnostics (no location). */
        getSemanticDiagnostics(uri: string): Promise<Diagnostic[]>;
        getSignatureHelpItems(uri: string, position: number, options: SignatureHelpItemsOptions | undefined): Promise<SignatureHelpItems | undefined>;
        getSyntacticDiagnostics(uri: string): Promise<DiagnosticWithLocation[]>;
        isDefaultLibFileName(uri: string): Promise<boolean>;
    }
}

var editor = monaco.editor.create(...etc...);
var tsProxy: ts.IMonacoTypeScriptServiceProxy;

monaco.languages.typescript.getTypeScriptWorker()
            .then(function(worker: (v: monaco.Uri) => Promise<ts.IMonacoTypeScriptServiceProxy>) {
                worker(editor.getModel().uri)
                      .then(function(proxy) {
                            tsProxy = proxy;
                      });
            });