Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

^F search highlight broken #3354

Open
nabijaczleweli opened this issue Apr 6, 2025 · 2 comments
Open

^F search highlight broken #3354

nabijaczleweli opened this issue Apr 6, 2025 · 2 comments
Labels
Expected Behavior This is how MathJax works v3

Comments

@nabijaczleweli
Copy link

nabijaczleweli commented Apr 6, 2025

Steps to Reproduce:

  1. Go to https://www.mathjax.org/#demo
  2. Paste in $\Sigma t = 423378$
  3. ^F, write "4"

Behold:

Image

Image

Image

Technical details:

  • MathJax Version: 3.2.2/whatever the demo is
  • Client OS: Windows 10, Bookworm
  • Browser: Nightly 139.0a1 (2025-04-02) (64-bit)/ESR 128.6.0esr (64-bit)/DevEd 87.0b9 (64-bit)

I am using the following MathJax configuration:

MathJax = {
  tex: {
    inlineMath:  [['[​[​',  '​]​]']],
    displayMath: [['[​![​', '​]!​]']]
  },

  // https://github.com/mathjax/MathJax/issues/3345#issuecomment-2731197248
  startup: {
    ready() {
      const {mathjax} = MathJax._.mathjax;
      const {STATE} = MathJax._.core.MathItem;
      const {Menu} = MathJax._.ui.menu.Menu;
      Menu.prototype.rerender = function rerender(start = STATE.TYPESET) {
        this.rerenderStart = Math.min(start, this.rerenderStart);
        const startup = MathJax.startup;
        if(!Menu.loading)
          startup.promise = startup.promise.then(
            () => mathjax.handleRetriesFor(
              () => {
                if (this.rerenderStart <= STATE.COMPILED)
                  this.document.reset({inputJax: []});
                this.document.rerender(this.rerenderStart);
                this.rerenderStart = STATE.LAST;
              }
            )
          );
      };
      MathJax.startup.defaultReady();
    }
  }
}

and loading MathJax via

<script id="MathJax-script" defer src="//cdn.jsdelivr.net/npm/mathjax@3.2.2/es5/tex-chtml.js"></script>

This is a MathJax bug, since this doesn't happen with either raw MathML input or with extracting the rendered blob from the page:

Image

<!doctype html>
<math xmlns="http://www.w3.org/1998/Math/MathML">
  <mi mathvariant="normal">&#x3A3;</mi>
  <mi>t</mi>
  <mo>=</mo>
  <mn>423378</mn>
</math>

<figcaption><mjx-container class="MathJax CtxtMenu_Attached_0" jax="CHTML" style="font-size: 119.6%; position: relative;" tabindex="0" ctxtmenu_counter="103"><mjx-math class="MJX-TEX" aria-hidden="true"><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D442 TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n"><mjx-c class="mjx-c28"></mjx-c></mjx-mo></mjx-math><mjx-assistive-mml unselectable="on" display="inline"><math xmlns="http://www.w3.org/1998/Math/MathML"><mi>O</mi><mo stretchy="false">(</mo></math></mjx-assistive-mml></mjx-container><mjx-container class="MathJax CtxtMenu_Attached_0" jax="CHTML" style="font-size: 119.6%; position: relative;" tabindex="0" ctxtmenu_counter="104"><mjx-math class="MJX-TEX" aria-hidden="true"><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D45F TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c3D"></mjx-c></mjx-mo><mjx-mn class="mjx-n" space="4"><mjx-c class="mjx-c30"></mjx-c><mjx-c class="mjx-c2E"></mjx-c><mjx-c class="mjx-c30"></mjx-c><mjx-c class="mjx-c32"></mjx-c></mjx-mn><mjx-mo class="mjx-n"><mjx-c class="mjx-c2C"></mjx-c></mjx-mo></mjx-math><mjx-assistive-mml unselectable="on" display="inline"><math xmlns="http://www.w3.org/1998/Math/MathML"><mi>r</mi><mo>=</mo><mn>0.02</mn><mo>,</mo></math></mjx-assistive-mml></mjx-container> <mjx-container class="MathJax CtxtMenu_Attached_0" jax="CHTML" style="font-size: 119.6%; position: relative;" tabindex="0" ctxtmenu_counter="105"><mjx-math class="MJX-TEX" aria-hidden="true"><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D45D TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D44E TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D459 TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D452 TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D452 TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n"><mjx-c class="mjx-c29"></mjx-c></mjx-mo></mjx-math><mjx-assistive-mml unselectable="on" display="inline"><math xmlns="http://www.w3.org/1998/Math/MathML"><mi>p</mi><mi>a</mi><mi>l</mi><mi>e</mi><mi>t</mi><mi>t</mi><mi>e</mi><mo stretchy="false">)</mo></math></mjx-assistive-mml></mjx-container><br> <mjx-container class="MathJax CtxtMenu_Attached_0" jax="CHTML" style="font-size: 119.6%; position: relative;" tabindex="0" ctxtmenu_counter="106"><mjx-math class="MJX-TEX" aria-hidden="true"><mjx-mi class="mjx-n"><mjx-c class="mjx-c3A3"></mjx-c></mjx-mi><mjx-mi class="mjx-i"><mjx-c class="mjx-c1D461 TEX-I"></mjx-c></mjx-mi><mjx-mo class="mjx-n" space="4"><mjx-c class="mjx-c3D"></mjx-c></mjx-mo><mjx-mn class="mjx-n" space="4"><mjx-c class="mjx-c34"></mjx-c><mjx-c class="mjx-c34"></mjx-c><mjx-c class="mjx-c30"></mjx-c><mjx-c class="mjx-c31"></mjx-c><mjx-c class="mjx-c33"></mjx-c><mjx-c class="mjx-c33"></mjx-c></mjx-mn></mjx-math><mjx-assistive-mml unselectable="on" display="inline"><math xmlns="http://www.w3.org/1998/Math/MathML"><mi mathvariant="normal">Σ</mi><mi>t</mi><mo>=</mo><mn>440133</mn></math></mjx-assistive-mml></mjx-container></figcaption>
@dpvc
Copy link
Member

dpvc commented Apr 7, 2025

This is due to the non-standard height and depth of the MathJax fonts. Those are set to make placement of the character easier, but does have the side-effect of not highlighting the full height of the characters, as seen in your images. The v4 fonts handle this differently, so you should get better results from that, when it is officially released.

For now, this is how MathJax works.

@dpvc dpvc added the Expected Behavior This is how MathJax works label Apr 7, 2025
@dpvc
Copy link
Member

dpvc commented Apr 7, 2025

PS, the reason your extracted version doesn't show this is because you are not including the CSS that MathJax inserts into the page, and so are not getting the MathJax fonts with the atypical font metrics. Your final image is using your browser's default fonts instead.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Expected Behavior This is how MathJax works v3
Projects
None yet
Development

No branches or pull requests

2 participants