Code editor is bugged in a couple of ways

[SteidleSolutions]

The code editor module seems to be bugged in a few ways. The first is that you can't edit or type in it until you hit save changes and it refreshes the page. What you have typed in the editor also doesn't show until you click the box and when it shows the CSS is all messed up.

Initial load:

After clicking the editor (but can't type):

After clicking save changes and it reloads (now fully functional):

Then the next is that it doesn't seem to be saving some chracters correctly. Notably <> and ''.
For example, if I put in
<script>console.log('loaded in header');</script>
When I try and put that into the header it outputs as
<script>&lt;script&gt;console.log(&#039;loaded in header&#039;);&lt;/script&gt;</script>

No matter which way I try and echo or insert into the header it doesn't seem to ever want to show correctly.

This can also be observed if using the code editor to collect CSS. If you enter code such as

#test > .test {
color: red;
}

The > will be replaced with < and break the CSS.

I thought I could get around it by just using a textarea box but those sanatize the input and remove tons of characters.

[leichim]

Thanks SteidleSolutions for the clear explanation.

Input from the code field is indeed sanitized, where slashes and html entities are converted to prevent authenticated XSS.

At the moment I am too occupied to fix this in a short term, but feel free to initiate a PR with the suggested improvements for the code.

In the meantime, you could use the ''wp_custom_fields_sanitized_value' filter to overwrite the default output for the code field (or any other type of field). (See src/Validate.php:453)

There are also two filters in the src/Frame.php class which you can use to overwrite behaviour for the Code field.
wp_custom_fields_field_class
wp_custom_fields_field_form