v12 cannot be used for validation of JSON by JSON schema

[bsivanov]

I was using the editor for editing JSON with predefined schema with the older versions, but it seems this is not possible now with v12.0.0.

I have the following code (same as in the samples):

<ngx-monaco-editor [options]="options" [model]="model"></ngx-monaco-editor>

but if I try to create the model like in the samples:

model: NgxEditorModel = {
    value: this.jsonCode,
    language: 'json',
    uri: monaco.Uri.parse('a://b/foo.json')
  };

this wouldn't be working as the monaco.Uri.parse is still not loaded. In the samples this is working purely by chance, as the model is created in the onInit handler of a previous editor.

I though that I would be able to update the model in the onInit of the same editor, where the monaco.Uri.parse will be available:

<ngx-monaco-editor [options]="options" [model]="model" (onInit)="onInit($event)"></ngx-monaco-editor>

  
  onInit(editor) {
    this.model = {
      value: this.jsonCode + 'something',
      language: 'json',
      uri: monaco.Uri.parse('a://b/foo.json')
    };
  }

but in this case the binding is not working and the model stays the old one (I tried adding 'something' at the end of the code, and it didn't appear in the editor).

I also tried setting the model directly in onInit:

<ngx-monaco-editor [options]="options" (onInit)="onInit($event)"></ngx-monaco-editor>

  onInit(editor: monaco.editor.IStandaloneCodeEditor) {
      const model = monaco.editor.createModel(this.jsonCode , 'json', monaco.Uri.parse('a://b/foo.json'));

      editor.setModel(model);   
  }

but this is again not working (the code is not even validated as JSON), now the following error appears in the Debug Console:

Could not create web worker(s). Falling back to loading web worker code in main thread, which might cause UI freezes. Please see https://github.com/microsoft/monaco-editor#faq
You must define a function MonacoEnvironment.getWorkerUrl or MonacoEnvironment.getWorker
Error: Unexpected usage

[MarcusRiemer]

I am in the same situation and have found the most horrible workaround I can think of. If you import Monaco directly in your component (import * as Monaco from "monaco-editor";) you can use something like Monaco.Uri.parse(`/${this.modelUrlType}/${this.modelUrlId}`); to generate an instance that is compatible with the lazily loaded Monaco. It just adds something like ~ 7 Mb to your bundle size ...

[Jiehong]

Indeed, this is a strong regression we are also experiencing.