mathjax / mathjax/MathJax

Add or document rendering hints for MathML Core input

Open
#3,540 3 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Code Example Expected Behavior
Dominant language
JavaScript
Stars
10.9k
Forks
1.2k
PR merge metrics
No merged PRs in 30d

Description

Is your feature request related to a problem? Please describe.
When converting from TeX to MathML MathJax generates data attributes such as data-mjx-smallmatrix. However, I got the impression that those properties are not used when existing MathML has those properties.

Describe the solution you'd like
MathJax should read the data-mjx properties and render (for example SVG output) as it's done when the rendering is triggered from TeX. For the concrete problem at hand I am trying to render smallmatrix.
MathML is

<math
	xmlns="http://www.w3.org/1998/Math/MathML" class="mwe-math-element mwe-math-element-inline">
	<mrow data-mjx-texclass="ORD">
		<mstyle displaystyle="true" scriptlevel="0">
			<mo maxsize="1.2em" minsize="1.2em" data-mjx-texclass="OPEN">(</mo>
			<mrow data-mjx-texclass="ORD">
				<mo data-mjx-texclass="OPEN"></mo>
				<mtable class="mwe-math-smallmatrix">
					<mtr>
						<mtd>
							<mi>a</mi>
						</mtd>
						<mtd>
							<mi>b</mi>
						</mtd>
					</mtr>
					<mtr>
						<mtd>
							<mi>c</mi>
						</mtd>
						<mtd>
							<mi>d</mi>
						</mtd>
					</mtr>
				</mtable>
				<mo fence="true" stretchy="true" symmetric="true" data-mjx-texclass="CLOSE"></mo>
			</mrow>
			<mo maxsize="1.2em" minsize="1.2em" data-mjx-texclass="CLOSE">)</mo>
		</mstyle>
	</mrow>
</math>

(Adding the data-mjx-smallmatrix attribute to the mtable element does not make a difference.)

mtable.mwe-math-smallmatrix mtd {
	math-depth: add( 1 );
	padding: 0 0.1665em 0 0.1665em;
}

(This CSS is also not fully optimal as rowspacing and columnspacing is no longer supported and no polyfill exists https://github.com/w3c/mathml/issues/534 but it looks quite okay.)
Also adding the attribute scriptlevel=1 to mtable did not help (in the MathJax reference implementation, there was an additional mstyle element sourounding the mtable, but it should not make a difference if mstyle or if the attribute is put to the mtable element directly https://www.w3.org/TR/mathml-core/#dfn-mstyle .

Describe alternatives you've considered
As a quick solution I Implemented a postfilter

mml: {
		postFilters: [
			( { data } ) => {
				const hasAncestorClass = ( element, targetClass ) => {
					// Walk up the ancestor chain
					let current = element.parent;
					while ( current ) {
						if ( current.isKind( 'mtable' ) ) {
							if ( current.attributes.isSet( 'class' ) &&
								current.attributes.get( 'class' ).split( /\s+/ ).includes( targetClass ) ) {
								current.attributes.set( 'scriptlevel', '1' );
								current.attributes.set( 'rowspacing', '.2em' );
								current.attributes.set( 'columnspacing', '0.333em' );
								return true;
							} else {
								return false;
							}
						}
						current = current.parent; // Move to the next ancestor
					}
					return false;
				};
				data.walkTree( ( node ) => {
					if ( node.attributes.isSet( 'scriptlevel' ) && hasAncestorClass( node, 'mwe-math-smallmatrix' ) ) {
						// Modify attributes of the `mtd` element
						node.attributes.set( 'scriptlevel', Math.min( 2, node.attributes.get( 'scriptlevel' ) + 1 ) );
					}

...

However, that feels like an anti-pattern. So any suggestions are highly welcome.

Additional context
Upstream task: MathJax rendering of smallmatrix too big
Actual code

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the MathML input and SVG rendering path, using the reported mml postFilters example and smallmatrix markup as the reproduction case. Determine how existing data-mjx properties and MathML attributes are handled, then verify that smallmatrix renders consistently with the TeX-triggered output without requiring an external postfilter.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, javascript
Domain
frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.