Syntax highlighting breaks when using nullish coalescing operator (??) in template literals.

[DiriectorDoc]

Description

There seems to be a bug with the syntax highlighting. I'm not sure what's going on here, but this is not the first time I've seen a problem like this. My former IDE (Adobe Brackets) had this same issue.

Input

The code looked like this before beautification:

var variable;
if (someCondition()) {
    variable = 4
}

var result = `The result is ${valuable ?? 5}`;

function someFunction(a) {
    // do something with `a`
    return a
}

Expected Output

The code should have looked like this after beautification:

Actual Output

The code actually looked like this after beautification:

Environment

OS: Windows 10 (10.0.19044) Browser: Google Chrome Version 105 (105.0.5195.127)

Settings

{
  "indent_size": "4",
  "indent_char": " ",
  "max_preserve_newlines": "5",
  "preserve_newlines": true,
  "keep_array_indentation": false,
  "break_chained_methods": false,
  "indent_scripts": "normal",
  "brace_style": "collapse",
  "space_before_conditional": true,
  "unescape_strings": false,
  "jslint_happy": false,
  "end_with_newline": false,
  "wrap_line_length": "0",
  "indent_inner_html": false,
  "comma_first": false,
  "e4x": false,
  "indent_empty_lines": false
}

[bitwiseman]

Highlights on the site are provided by CodeMirror and not part of this project. We are using an older version, so this might be fixed already somewhere.

The failed highlight just means that that component doesn't understand the nullish operator.