Accent gap

I don’t know if this is just due to buggy browser implementations, but Chrome and Safari both do not have any gap between the base and the accent. (And given that these two follow the Core specification more closely than Firefox does, at the moment, this leads me to think that they are following the spec here and Firefox doesn’t.)

Consider this snippet (MDN playground):

<math display="block">
  <mover accent="true">
    <mi>x</mi>
    <mo stretchy="true">&#x2D9;</mo>
  </mover>
</math>

(The stretchy="true" is there just to work around a Safari bug.)

Chrome and Safari display it like this on my Mac, using the default math font (STIX2):

While Firefox displays it like this:

One can fix the problem in Chrome and Safari with this CSS (MDN playground):

mover[accent="true" i] > mo:nth-child(2) {
  transform: translateY(-0.2ex);
}

where I chose -0.2ex because it roughly looks to me like what the gap in LaTeX is. (EDIT: though perhaps 0.15ex is a better value and perhaps using margin-bottom is better than using transform.)

It then looks like this:

Should such an accent gap be part of the spec?

There is an existing similar issue: #254 but it doesn't really articulate this particular problem well.

There have also been reports about this elsewhere: https://github.com/arXiv/html_feedback/issues/4007

Start by reviewing the MathML Core behavior for accented movers, then compare the Chrome, Safari, and Firefox examples in the issue. Read the related issue #254 and the linked arXiv report for context. Done means reaching and documenting a specification decision about whether an accent gap is required and what behavior should be interoperable.