[wp-trac] [WordPress Trac] #13340: wpautop breaks inline MathML

[WordPress Trac]

#13340: wpautop breaks inline MathML
-------------------------------------------------+-------------------------
 Reporter:  nicholaswilson                       |       Owner:  joedolson
     Type:  defect (bug)                         |      Status:  accepted
 Priority:  normal                               |   Milestone:  6.2
Component:  Formatting                           |     Version:  2.9.2
 Severity:  normal                               |  Resolution:
 Keywords:  needs-dev-note has-patch has-        |     Focuses:
  testing-info                                   |  accessibility
-------------------------------------------------+-------------------------
Changes (by bgoewert):

 * keywords:  needs-dev-note has-patch => needs-dev-note has-patch has-
     testing-info


Comment:

 == Test Report

 Patch tested: [https://github.com/WordPress/wordpress-develop/pull/3847
 pr:3847]

 === Steps to Test
 1. Copy/Paste an ''inline'' example of MathML to a Paragraph block and a
 Custom HTML block.
 2. Create a new Classic Block, Edit as HTML, and paste an ''inline''
 example.
 3. Repeat first two steps for an example of ''block'' MathML.
 4. Install & activate the [https://wordpress.org/plugins/classic-editor/
 Classic Editor] plugin.
 5. Create a new post/page.
 6. Select the "Text" tab.
 7. Paste the inline and block examples.

 ''Inline Example:''
 {{{
 <math><mrow><msup><mi>a</mi><mn>2</mn></msup><mo>+</mo><msup><mi>b</mi><mn>2</mn></msup><mo>=</mo><msup><mi>c</mi><mn>2</mn></msup></mrow></math>
 }}}

 ''Block Example:''

 {{{
 <math
 display="block"><mtable><mtr><mtd><msup><mrow><mo>(</mo><mi>a</mi><mo>+</mo><mi>b</mi><mo>)</mo></mrow><mn>2</mn></msup></mtd><mtd><mo>=</mo></mtd><mtd><msup><mi>c</mi><mn>2</mn></msup><mo>+</mo><mn>4</mn><mo>⋅</mo><mo>(</mo><mfrac><mn>1</mn><mn>2</mn></mfrac><mi>a</mi><mi>b</mi><mo>)</mo></mtd></mtr><mtr><mtd><msup><mi>a</mi><mn>2</mn></msup><mo>+</mo><mn>2</mn><mi>a</mi><mi>b</mi><mo>+</mo><msup><mi>b</mi><mn>2</mn></msup></mtd><mtd><mo>=</mo></mtd><mtd><msup><mi>c</mi><mn>2</mn></msup><mo>+</mo><mn>2</mn><mi>a</mi><mi>b</mi></mtd></mtr><mtr><mtd><msup><mi>a</mi><mn>2</mn></msup><mo>+</mo><msup><mi>b</mi><mn>2</mn></msup></mtd><mtd><mo>=</mo></mtd><mtd><msup><mi>c</mi><mn>2</mn></msup></mtd></mtr></mtable></math>
 }}}

 Source: [https://developer.mozilla.org/en-
 US/docs/Web/MathML/Examples/MathML_Pythagorean_Theorem MDN Examples -
 Proving the Pythagorean theorem]

 Another Example: [https://developer.mozilla.org/en-
 US/docs/Web/MathML/Examples/Deriving_the_Quadratic_Formula MDN - Deriving
 the Quadratic Formula]

 === Expected Results
 - ✅ Inline MathML - Gutenberg
 - ✅ Block MathML - Gutenberg
 - ✅ Inline MathML - TinyMCE
 - ✅ Block MathML - TinyMCE

 === Environment

 * OS: Pop!_OS
 * Web Server: Docker-Desktop & wordpress-develop
 * Browser: Firefox 108, Chrome 109
 * PHP: 7.4.33
 * WordPress: 6.2-alpha-54642-src
 * Theme: Twenty Twenty-Three
 * Active Plugins: Classic Editor

 * OS: macOS Monterey (via LambdaTest)
 * Browser: Safari 16

 === Actual Results
 - ⚠ Inline MathML - Gutenberg: Custom HTML block only
 - ⚠ Block MathML - Gutenberg: Custom HTML block only
 - ⚠ Inline MathML - TinyMCE: Text Editor only
 - ⚠ Block MathML - TinyMCE: Text Editor only

 === Additional Notes
 - Twenty Twenty-Three does not apply margin to inline elements.
 - Swithcing TinyMCE to the Visual Editor after pasting to the Text Editor
 removes the markup.
 - While Gutenberg only parses this correctly using the Custom HTML block,
 I did also find that there is a [https://wordpress.org/plugins/mathml-
 block/ MathML block plugin].

 === Supplemental Artifacts

 ''Figure 1: Inline MathML - Gutenberg''
 [[Image(https://i.imgur.com/95peIRw.png)]]

 ''Figure 2: Block MathML - Gutenberg''
 [[Image(https://i.imgur.com/FAnBWem.png)]]

 ''Figure 3: TinyMCE''
 [[Image(https://i.imgur.com/pymZ0AF.png)]]

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/13340#comment:29>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform