[FIX] web_editor: prevent several blocks in one column on convert grid

The following structure is not always properly rendered in mail clients:

```html
<table>
    <tbody>
        <tr>
            <td>
                <h1>Text</h1>
                <p>Text</p>
            </td>
        </tr>
    </tbody>
</table>
```

where the h1 and p can be any block-level element.

This prevents that from happening by wrapping each block in a separate
row/column combo like so:

```html
<table>
    <tbody>
        <tr>
            <td>
                <h1>Text</h1>
            </td>
        <tr>
            <td>
                <p>Text</p>
            </td>
        </tr>
    </tbody>
</table>
```

X-original-commit: 01404499277b63dc64a5a26a93bc419cca092440
Part-of: odoo/odoo#80621

addons/web_editor/static/src/js/backend/convert_inline.js

@@ -2,7 +2,7 @@
 'use strict';
 
 import FieldHtml from 'web_editor.field.html';
-import { rgbToHex } from '../../../lib/odoo-editor/src/utils/utils';
+import { isBlock, rgbToHex } from '../../../lib/odoo-editor/src/utils/utils';
 
 const SELECTORS_IGNORE = /(^\*$|:hover|:before|:after|:active|:link|::|'|\([^(),]+[,(])/;
 
@@ -426,6 +426,9 @@ function bootstrapToTable($editable) {
 
 
         // ROWS
+        // First give all siblings of rows a separate row/col parent combo.
+        $table.children().filter((i, child) => isBlock(child) && !$(child).hasClass('row')).wrap('<div class="row"><div class="col-12"/></div>');
+
         const $bootstrapRows = $table.children().filter('.row');
         for (const bootstrapRow of $bootstrapRows) {
             const $bootstrapRow = $(bootstrapRow);