Uploaded image for project: 'Runtime'
  1. Runtime
  2. RUNTIME-3442

Replace the script editor with Monaco editor

    XMLWordPrintable

    Details

    • Type: New Feature
    • Status: Open
    • Priority: Major
    • Resolution: Unresolved
    • Affects Version/s: None
    • Fix Version/s: 4.4.0
    • Component/s: None
    • Labels:
      None

      Description

      It'll allow type inference, code completion, ...

      for instance, a code snippet usable in the Monaco playground:

      
      async function setup() {
      
          // Add additonal d.ts files to the JavaScript language service and change.
          // Also change the default compilation options.
          // The sample below shows how a class Facts is declared and introduced
          // to the system and how the compiler is told to use ES6 (target=2).
      
          // validation settings
          monaco.languages.typescript.javascriptDefaults.setDiagnosticsOptions({
              noSemanticValidation: false,
              noSyntaxValidation: false
          });
      
          // compiler options
          monaco.languages.typescript.javascriptDefaults.setCompilerOptions({
              target: monaco.languages.typescript.ScriptTarget.ES6,
              allowNonTsExtensions: true
          });
      
          // extra libraries
      
          const response = await fetch("https://raw.githubusercontent.com/microsoft/TypeScript/master/lib/lib.es5.d.ts");
          const libes5 = await response.text();
      
      
      
          monaco.languages.typescript.javascriptDefaults.addExtraLib(libes5, "defaultLib:lib.d.ts");
      
          monaco.languages.typescript.javascriptDefaults.addExtraLib([
              'declare class Session {',
              '    /**',
              '     * Returns the node by identifier',
              '     */',
              '    getNodeByUUID(uuid:string):Node',
              '}',
              'declare class Node {',
              '    /**',
              '     * Returns the value',
              '     */',
              '    getProperty(propertyName:string):string',
              '}',
              'let session:Session;'
          ].join('\n'), 'ts:filename/facts.d.ts');
      
          var jsCode = [
              'session'
          ].join('\n');
      
      
      
          monaco.editor.create(document.getElementById("container"), {
              value: jsCode,
              language: "javascript"
          });
      
      }
      
      setup();
      
      

      This code add standard JS through defaultLib and allow to add part of Ametys API available to the scripts.

        Attachments

          Issue Links

            Activity

              People

              • Assignee:
                Unassigned
                Reporter:
                cedric Cédric Damioli
              • Votes:
                0 Vote for this issue
                Watchers:
                1 Start watching this issue

                Dates

                • Created:
                  Updated: