Border broken if enabled in tinymce preview_styles

[smerriman]

This affects any theme, but as a simple way to replicate in a fresh installation of WordPress / twentyfifteen:

1) In functions.php, add:

function twentyfifteen_tinymce_before_init( $init ) {
    unset($init['preview_styles']);
    return $init;
}
add_filter('tiny_mce_before_init', 'twentyfifteen_tinymce_before_init');

This resets back to TinyMCE's default preview styles, which includes border (WordPress' default excludes this for some reason).

2) In css/editor-style, add a border to h2:

h2 {border-bottom:1px solid #000;}

3) If you now load the visual editor, click toolbar toggle, and look at the h2 in the block formats dropdown, you do not see a border. If you look at the dropdown element in inspector, you will see broken CSS for border, border-radius, and outline:

style='font-family:"Noto Serif",serif;font-size:29px;font-weight:700;font-style:normal;text-decoration:none;text-transform:none;color:rgb(51, 51, 51);border:;border-radius:;outline:;text-shadow:none;

Is this a bug in TinyMCE, or a compatibility bug with WordPress code somewhere? Given border is part of the default preview styles and WordPress removed it, I'm guessing a bug in WordPress somewhere.

[azaozz]

The preview_styles setting for TinyMCE was added in the WP implementation exactly for that reason: it doesn't work well in many cases, and on the (old) Edit Post screen.

Closing as wontfix, feel free to reopen with a patch if this still needs fixing in the classic editor.