reveal.js: r-fit-text and LaTeX don't play well with each other

[mroavi]

Bug description

Apparently, r-fit-text takes into account the LaTeX "source" characters instead of the displayed ones when calculating the size of the text.

I am running quarto in preview mode, which might have to do with this issue.

The following example illustrates the problem:

---
format:
  revealjs:
    center: true
---

## Title

::: {.r-fit-text}
r-fit-text and LaTeX don't play well with each other: $\mathcal{N}(\mathcal{a},\mathcal{b},\mathcal{c})$
:::

::: {.r-fit-text}
r-fit-text and LaTeX don't play well with each other: N(a,b,c)
:::

Output:

Edit: I just noticed that if the slide in question is not being currently displayed in the browser (e.g. another slide or tab is being displayed) then the line with LaTeX output is displayed correctly. This makes me think that there might be a race condition related to the time MathJax takes to render the LaTeX equations.

System info

quarto-cli git version: d7a4cf1cc

❯ quarto check

[✓] Checking Quarto installation......OK
      Version: 99.9.9
      Path: /home/mroavi/repos/quarto-cli/package/dist/bin

[✓] Checking basic markdown render....OK

[✓] Checking Python 3 installation....OK
      Version: 3.10.4
      Path: /usr/bin/python3
      Jupyter: 4.10.0
      Kernels: julia-1.5, julia-1.7, python3

[✓] Checking Jupyter engine render....OK

[✓] Checking R installation...........(None)

      Unable to locate an installed version of R.
      Install R from https://cloud.r-project.org/

I'm not using RStudio IDE.

My system:

OS: Manjaro Linux x86_64
Host: XPS 13 9360
Kernel: 5.15.36-1-rt41-MANJARO

Checklist

• formatted your issue so it is easier for us to read?
• included a minimal, self-contained, and reproducible example?
• documented the quarto version you're running, by providing the output produced by quarto check in a terminal in your issue?
• documented the RStudio IDE version you're running (if applicable), by providing the value displayed in the "About RStudio" main menu dialog?
• documented which operating system you're running? If on Linux, please provide the specific distribution as well.
• upgraded to the latest version, including your versions of R, the RStudio IDE, and relevant R packages?

[jjallaire]

Thanks for reporting this. I'm not sure there is anything we can to do resolve this since it's revealjs feature. We will take a closer look after our v1.0 release.

[mcanouil]

It does not seem to be the case under latest Quarto

Going ahead and closing.

[cderv]

This is still happening:

Seems like a revealjs problem anyway...

Regarding your example, it seems there is a problem in your math rendering and maybe why this is not reproducing on your side

[cscheid]

I would be very surprised if this problem sorted itself out somehow. The issue here is that r-fit-text uses the fitty Javascript library for determining text size:

https://github.com/hakimel/reveal.js/blob/master/js/controllers/slidecontent.js#L205-L211

Three observations:

• math rendering in Reveal happens dynamically and at runtime, through JavaScript. This means that it will mutate the DOM at some point after the page is loaded.
• the call that RevealJS makes fitty doesn't observe mutations of the DOM
• I expect math rendering to happen after Reveal is initialized (after all, it is Reveal that sets up math rendering). As a result, I'm fairly sure that revealjs will call fitty too early, and there's no easy way around it without changing RevealJS itself.