Syntax Highlighting for HTML block/ Code block and HTML editor

[youknowriad]

Syntax highlighting as implemented today is not great. We should aim to provide a consistent behavior across blocks while keeping the bundle size as small as possible:

• It should be lazy-loadable
• It should be generic enough to be used as an npm dependency
• It should be consistent.

Also, nowadays, alternative editors like "Monaco Editor" do a better job than CodeMirror, we should try to explore it and see how it fits.

[mor10]

Just for clarity: There is no syntax highlighting at all in 4.0 RC1, correct? I remember there used to be, but now both the code and html blocks show plain unformatted text.

[chrisvanpatten]

@mor10 it had to be removed due for technical reasons but the hope is to bring it back at some point. I forget the ticket number but I’m sure someone else can dig it up!

[youknowriad]

@mor10 yes, that's true. The html block used to have it, but we removed it for the moment. We were not satisfied with the implementation and it was not consistent. This will be back at some point though.

[Clorith]

Looking forward to the return :)

I would like to interject that it was mentioned that we might use something other than CodeMirror in Gutenberg, this seems like a poor choice, given that core comes bundled with CodeMirror. This means the package size doesn't affect us at the very least, it's not the smallest library, so it would be a shame to not use it when it's bundled and "always there" for us. Hopefully we can come up with an implementation that is workable with it.

[xy0]

Please bring it back, I found it really useful and didn't experience any issues except for unwanted end tags being created sometimes. The plain text box that exists now is pretty much exactly the same as the shortcode and code blocks.

[PeterBooker]

The Monaco editor is not supported in mobile browsers or mobile web frameworks. microsoft.github.io/monaco-editor/

CodeMirror is currently being rewritten, as CodeMirror 6 (sponsored by Automattic too), which looks like it might meet the OP requirements. It might be worth reaching out/contributing to ensure that it does.

[willdelphia]

any chance this will be fixed by the 5.0 release?

[noisysocks]

@willdelphia: No, this will not be in the 5.0 release.

[willdelphia]

Is there a place where people can vote for upcoming features to take priority over others? If so, this has my vote.

[willdelphia]

https://wordpress.org/plugins/ace-html-block/