Display is broken when wp_text_diff() is used in the admin screen

[mt8.biz]

If I use the following code, the output will be different between 5.6.5 and later versions.

<?php

add_action( 'wp_dashboard_setup', function () {
        wp_add_dashboard_widget(
        'wp_text_diff_test',
        'Test of wp_text_diff()',
        function() {
            print wp_text_diff( 'a' , 'b' );
        } 
    );  
});

[mt8.biz]

5.6.5

[mt8.biz]

5.8.1

[mt8.biz]

patch for this issue

[mt8.biz]

This problem is caused by the following commit, which removes $this->emptyLine() and no longer outputs an empty td.

​https://github.com/WordPress/WordPress/commit/35aaaacc044c12e1b4c4a3cd3b90578a7e79a65e

The second of the td's had a CSS to make it 4% wide.

I suggest remove the CSS code in the patch as it is not needed.

[mt8.biz]

Out put codes

5.6.5

<tr>
  <td class="diff-deletedline">
    <span aria-hidden="true" class="dashicons dashicons-minus"></span>
    <span class="screen-reader-text">Deleted: </span>a
  </td>
  <td>&nbsp;</td>
  <td class="diff-addedline">
    <span aria-hidden="true" class="dashicons dashicons-plus"></span>
    <span class="screen-reader-text">Added: </span>b
  </td>
</tr>

5.8.1

<tr>
  <td class="diff-deletedline">
    <span aria-hidden="true" class="dashicons dashicons-minus"></span>
    <span class="screen-reader-text">Deleted: </span>a
  </td>
  <td class="diff-addedline">
    <span aria-hidden="true" class="dashicons dashicons-plus"></span>
    <span class="screen-reader-text">Added: </span>b
  </td>
</tr>

[SergeyBiryukov]

Introduced in [50034].

[Hareesh Pillai]

Attached patch looks good to me.

[mukesh27]

Patch does not affect revision screen.

[joedolson]

In 51972:

Widgets: Remove unused CSS breaking wp_text_diff layout.

Remove CSS used in version of wp_text_diff prior to [50034]. Orphaned CSS breaks default layout of function output, but is overridden in the revisions screen.

Props mt8.biz, hareesh-pillai, mukesh27.
Fixes #54140.