Аналіз Groovy-редакторів на відповідність ключовим вимогам

Функціональні сценарії

  • Створення та внесення змін до Groovy-скриптів бізнес-процесів

Приклади коду для редагування

def cephData = [:]
['name', 'edrpou'].each {
  cephData[it] = labResponse.responseBody.prop(it).stringValue()
}
execution.removeVariable('payload')
set_transient_variable('payload', S(cephData, 'application/json'))
def fullName = initiator().fullName
if (fullName == null) {
  fullName = completer('Activity_shared-subject-status-error').fullName
}
execution.setVariable('fullName', fullName)

Ключові вимоги до редактора

  • Авто-доповнення

  • Підтримка автодоповнення для кастомних функцій

  • Синтаксичний аналіз

Розглянуті рішення

Аналіз на відповідність вимогам

Критерій / Функціональність monaco-editor

Авто-доповнення

Так

Синтаксичний аналіз

Базовий функціонал відсутній, але потрібно розглянути рішення з взаємодією з Groovy Language Server

Підтримка автодоповнення для кастомних функцій

Так

Підтримка коментарів

Так

Можливість згортання та розгортання блока з кодом

Так

Рішення за результатами аналізу

Рекомендовано використовувати бібліотеку @monaco-editor/react. Наразі не підтримується функція синтаксичного аналіза кода, але буде розглянута можливість реалізації в наступних задачах(PoC).

Підтримка темування та стилізації

Бібліотека monaco-editor надає доступні варіанти теми "vs-dark" | «light». Також ми можемо визначати власні теми за допомогою monaco.editor.defineTheme Приклад

Підтримка автодоповнення

Бібліотека @monaco-editor надає наступне API для підтримки автодоповнення. Для цього ми викликаємо метод registerCompletionItemProvider() у об’єкта monaco.languages, який приймає два аргументи languageId(мова, на прикладі groovy) та об’єкт provider. В об’єкта provider є значення provideCompletionItems, в яке передаємо функцію, яка, в свою чергу, повертає об’єкт зі значенням suggestions - це масив елементів, в якому ми опишемо значення для автодоповнення.
На приклад:

monaco.languages.registerCompletionItemProvider('groovy', {
	provideCompletionItems: function () {
		return {
			suggestions: [
                {
                  label: "set_transient_variable",
                  kind: monaco.languages.CompletionItemKind.Keyword,
                  documentation: "",
                  insertText: "set_transient_variable(${1:arg}, ${2:arg2})",
                  insertTextRules:
                    monaco.languages.CompletionItemInsertTextRule.InsertAsSnippet
                }
            ]
		};
	}
});

На прикладі вищє, якщо користувач почне набирати символи які будуть співпадати з полем label, редактор запропонує вибрати це значення зі списку автодоповнення. Якщо користувач натисне на це слово, в редакторі автоматично підставиться значення з поля insertText.

Інтерфейс веб-редактора

Основний інтерфейс редактора

groovy

Авто-доповнення для кастомних функцій

groovy autocomplete