[Bug] colorizeElement method doesn't color the whole text if domNode has more than one #text child

[juanbomfim22]

Reproducible in vscode.dev or in VS Code Desktop?

• Not reproducible in vscode.dev or VS Code Desktop

Reproducible in the monaco editor playground?

• Not reproducible in the monaco editor playground

Monaco Editor Playground Link

No response

Monaco Editor Playground Code

No response

Reproduction Steps

It can be reproduced whenever appending one or more text nodes with document.createTextNode to a givendomNode. Tested with the latest monaco's version.

Here's a reproducible fiddle: https://jsfiddle.net/xw5zc4Lo/.

Actual (Problematic) Behavior

If you create an element with at least two #text, monaco.editor.colorizeElement will just colorize the firstChild's nodeValue as seen in the colorizeElement implementation.

public static colorizeElement(themeService: IStandaloneThemeService, languageService: ILanguageService, domNode: HTMLElement, options: IColorizerElementOptions): Promise<void> {
    // ...
    const text = domNode.firstChild ? domNode.firstChild.nodeValue : '';
    // ...
    return this.colorize(languageService, text || '', languageId, options).then(render, (err) => console.error(err));
}

A simple example is shown below. There's an initial text node and another one that is appended. After it happens, the colorize method is triggered, but it strips the newly added text node and just colorizes the first one.

Expected Behavior

It is expected that the attribute wholeText is used to color all text present in the node instead of nodeValue, because it will concatenate any following #text present after the firstChild. As per MDN,

The read-only wholeText property of the Text interface returns the full text of all Text nodes logically adjacent to the node. The text is concatenated in document order. This allows specifying any text node and obtaining all adjacent text as a single string.

Additional Context

No response