Replace Console's ace editor

[cjcenizal]

Requirements

Support "enhanced JSON"

Enhanced JSON is a superset of standard JSON and Console has specific requirements for it. This type of enhanced JSON is also used by Search Profile and aspects of it have been requested in Watcher.

Inline HTTP requests

The JSON in the Console editor is always a request body preceded by a request method and path.

Multiple bodies for msearch requests

The msearch AP supports multiple headers and bodies separated by newlines. Example:

POST foo/_doc
{
  "foo": "foo"
}

POST bar/_doc
{
  "bar": "bar"
}

GET foo/_msearch
{}
{"query" : {"match_all" : {}}}
{"index" : "bar"}
{"query" : {"match_all" : {}}}

Multiple JSON blocks

Console supports multiple requests along with their JSON bodies.

Triple quoted strings escape quotes

Users have the option of escaping quotation marks by wrapping strings in triple quotes so they don't need to escape each individual quotation mark. Users can toggle this feature on and off.

Inline comments

Users can begin a line with a pound # to make that line a comment. Comments inside of JSON aren't supported but they've been requested (#11973).

Inline deprecation warnings

When a request is made using a deprecated feature, we print a warning into the response pane above the JSON.

Autocomplete

Console autocomplete will suggest different endpoints based on the method you've used and any input you've typed. Some users have complained that this matching logic is too liberal (#13361).

JSON autocompletion with placeholder fields

Autocomplete also works for the JSON body, and will complete with nested JSON objects with placeholder field names.

Dynamic autocomplete

Console can suggest indices, fields, and other things that the user has created. So we need the ability to update the autocomplete rules during run-time. In the example below, "test" is an index the user created.

Request-specific context menu

You can use this context menu to copy the request as cURL, open a documentation link for the relevant API, and auto-indent the request body.

Auto-indent

Auto-indent will format the request body so that it has indentation at each nesting level, and empty objects will be collapsed so that the opening and closing brackets are on the same line.

When auto-indented, the above becomes nicely formatted like this:

Auto-indenting again will condense the JSON so that it only occupies a single line and has no whitespace:

Subsequent auto-indents alternate between the condensed form and the nicely indented form.

Note that auto-indenting a triple-quoted string like this:

POST test/1
{
  "test": """a
  b"""
}

Will replace newlines with a newline character:

POST test/1
{"test":"a\n  b"}

Auto-indenting again will return to the original triple-quoted string form.

Collapsible blocks

JSON blocks can be collapsed and expanded.

Keyboard shortcuts

Console supports the following keyboard shortcuts:

Customizable font-size

Users can specify the font-size of the editor.

Nice-to-haves

Search highlighting in the content and scroll bar

#20142

[elasticmachine]

Pinging @elastic/es-ui

[cjcenizal]

CC @jloleysens @poffdeluxe

[cjcenizal]

Related to #57435

[cjcenizal]

Closing this in favor of issues to add test coverage to verify this behavior:

• Add tests for "extended JSON" (XJSON) #136055
• Add tests for Console's autocomplete #136056
• Add tests for Console's context menu and its actions #136057
• Add tests for misc Console behavior #136058