Unexpected and undesired HTML and CSS when using lists.

If you select text in the WYSIWYG editor, click the ordered or unordered list button to convert the text to an HTML list, then click the button again to revert (ie. unlist) the text, the WYSIWYG converts the text to a span and a bunch of CSS styles.

Original HTML:

<p>item 1<br>item 2<br>item 3</p>

Update HTML (after clicking the list button once):

<p><ul><li>item 1</li><li>item 2</li><li>item 3</li></ul></p>

Reverted HTML (after clicking the list button again):

<p></p><span style="background-color: rgba(var(--mdb-white-rgb), var(--mdb-bg-opacity)) ; font-size: var(--mdb-body-font-size); font-weight: var(--mdb-body-font-weight); text-align: var(--mdb-body-text-align);">item 1</span><br><span style="background-color: rgba(var(--mdb-white-rgb), var(--mdb-bg-opacity)) ; font-size: var(--mdb-body-font-size); font-weight: var(--mdb-body-font-weight); text-align: var(--mdb-body-text-align);">item 2</span><br><span style="background-color: rgba(var(--mdb-white-rgb), var(--mdb-bg-opacity)) ; font-size: var(--mdb-body-font-size); font-weight: var(--mdb-body-font-weight); text-align: var(--mdb-body-text-align);">item 3</span><br><p></p>