MathJax3 provides additional unwanted spacing with display_matrix macro from PGmatrixmacros.pl

[somiaj]

I have noticed an issue with MathJax3 causing spacing differences (compared to MathJax2) when using display_matrix from PGmatrixmacros.pl. The relevant code from my .pg problem is:

\{ 
mbox(
  "\( \boldsymbol{\vec{s}^{\,\prime}} = \)",
  display_matrix([
  [$multians1->ans_rule(5),$multians1->ans_rule(5)], 
  [$multians1->ans_rule(5),$multians1->ans_rule(5)]
  ], align=>'cc'),
  "\( \boldsymbol{\vec{s}} \)"
);
\}

On my old server with MathJax2 I get the the matrix appearing as expected, but on my new server with MathJax3 I get an extra space before the open/close bracket of the matrix. I have attached two images to show the difference.

When inspecting the element it appears that there is some in-line css

<table class="matrix" style="border-collapse: separate; border-spacing:10px 0px;" border="0">

Modifying the border-spacing does remove the extra spacing from the matrix brackets, but also puts the answer boxes too close together. It appears that MathJax3 is amplifying this spacing somehow.

[somiaj]

Additional note, I don't see this issue with matrices using $Matrix->ans_array(), and notice that they are using spans vs tables to display the matrix with the answer boxes.

[somiaj]

Here is a crude fix that works for my setup when I use the display_matrix macro.

diff --git a/macros/PGmatrixmacros.pl b/macros/PGmatrixmacros.pl
index 8a55753..d863cfb 100644
--- a/macros/PGmatrixmacros.pl
+++ b/macros/PGmatrixmacros.pl
@@ -300,6 +300,12 @@ sub dm_mat_left {
                 $erh = "\\end{rawhtml}";
         }

+       # Fix extra spacing in MathJax3
+       my $fixspacing = "";
+       if ( $main::displayMode eq 'HTML_MathJax' ) {
+               $fixspacing = ' style="border-spacing: 0;"';
+       }
+
         if( $main::displayMode eq 'HTML_MathJax'
                       or $main::displayMode eq 'HTML_dpng'
                       or $main::displayMode eq 'HTML_tth'
@@ -308,7 +314,7 @@ sub dm_mat_left {
                       or $main::displayMode eq 'HTML_LaTeXMathML'
                       or $main::displayMode eq 'HTML'
                       or $main::displayMode eq 'HTML_img') {
-                $out .= "$brh<tr valign=\"center\"><td nowrap=\"nowrap\" align=\"left\" rowspan=\"$numrows\">$erh";
+                $out .= "$brh<tr valign=\"center\"><td nowrap=\"nowrap\" align=\"left\" rowspan=\"$numrows\"$fixspacing>$erh";
                 $out .= dm_image_delimeter($numrows, $opts{'left'});
 #               $out .= "$brh<td><table border=0  cellspacing=5>\n$erh";
                 return $out;
@@ -337,6 +343,12 @@ sub dm_mat_right {
                 return "";
         }

+        # Fix extra spacing in MathJax3
+        my $fixspacing = "";
+        if ( $main::displayMode eq 'HTML_MathJax' ) {
+               $fixspacing = ' style="border-spacing: 0;"';
+        }
+
         if( $main::displayMode eq 'HTML_MathJax'
                       or $main::displayMode eq 'HTML_dpng'
                       or $main::displayMode eq 'HTML_tth'
@@ -345,7 +357,7 @@ sub dm_mat_right {
                       or $main::displayMode eq 'HTML_LaTeXMathML'
                       or $main::displayMode eq 'HTML'
                       or $main::displayMode eq 'HTML_img') {
-                $out .= "$brh<td nowrap=\"nowrap\" align=\"right\" rowspan=\"$numrows\">$erh";
+                $out .= "$brh<td nowrap=\"nowrap\" align=\"right\" rowspan=\"$numrows\"$fixspacing>$erh";

                 $out.= dm_image_delimeter($numrows, $opts{'right'});
                 return $out;

[dpvc]

This turns out to be due to the border-spacing explicit style on the element

<table class="matrix" border="0" style="border-collapse: separate; border-spacing:10px 0px;">

generated by the display_matrix() macro. MathJax v3 uses display: inline-table for its internal arrays (and one is created by display_matrix() to get the needed height for the brackets), so it gets the extra spacing specified by the border-spacing.

One solution would be to add the following CSS:

mjx-mtable {
  border-spacing: initial
}

or

mjx-mtable {
  border-spacing: 0
}

[somiaj]

I confirmed that both of those CSS entries also fix the issue. Though unsure if it is better to fix this in the display_matrix() macro or to include the CSS (would this CSS have consequences in other situations MathJax v3).

[dpvc]

would this CSS have consequences in other situations MathJax v3

No, this what MathJax expects the values to be. The outer table was changing the defaults, and that bled through to the MathJax output.