quarto-dev / quarto-dev/quarto-cli

Anomalous HTML line break for inline equations within quotes or followed by punctuation

Open
#5,920 20 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug html math pandoc-lua
Dominant language
JavaScript
Stars
6k
Forks
458
Avg merge
1d 9h
Merged PRs (30d)
41

Description

Bug description

In HTML output, an inline formula within quotes, for example some text "$a=b$" some text or some text $a=b$, some text may at times get a line break right after the initial quote, or right before the final quote or comma or full-stop.

Steps to reproduce
  1. Save this example document testquotes.qmd:
---
title: "Test quotes"
format:
  html:
    html-math-method: mathjax
---

test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" test "$a=b$" 

test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$, test $a=b$,
  1. Render the document to HTML:
quarto render testquotes.qmd --to html
  1. Open the rendered HTML file testquotes.html in a browser. Browsers tested: Firefox 114.0.1 (64-bit), Chromium 114.0.5735.106 (Official Build) snap (64-bit) on Ubuntu 20.04.

  2. Slowly resize the browser window, enlarging or shrinking it, paying attention at where the adapted line breaks appear. You should be able to see the situation as in this screenshot; see the purple squares:
    html_output

Expected behavior

Line breaks shouldn't occurr after opening quotes, or before closing quotes or commas or full-stops.

Actual behavior

Line breaks sometimes occurr after opening quotes, or before closing quotes or commas or full-stops around an inline equation.

Your environment
  • IDE: GNU Emacs 28.1 (build 1, x86_64-pc-linux-gnu, GTK+ Version 3.24.20, cairo version 1.16.0) of 2022-07-28
  • OS: Ubuntu 20.04 64-bit, Kernel Version: 5.14.0-1059-oem
Quarto check output
[✓] Checking versions of quarto binary dependencies...
      Pandoc version 3.1.1: OK
      Dart Sass version 1.55.0: OK
[✓] Checking versions of quarto dependencies......OK
[✓] Checking Quarto installation......OK
      Version: 1.3.353
      Path: /opt/quarto/bin

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

[✓] Checking Python 3 installation....OK
      Version: 3.8.10
      Path: /usr/bin/python3
      Jupyter: (None)

      Jupyter is not available in this Python installation.
      Install with python3 -m pip install jupyter

[✓] Checking R installation...........OK
      Version: 4.3.0
      Path: /usr/lib/R
      LibPaths:
        - /usr/local/lib/R/site-library
        - /usr/lib/R/site-library
        - /usr/lib/R/library
      knitr: 1.43
      rmarkdown: 2.22

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

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 by rendering the supplied testquotes.qmd with quarto render testquotes.qmd --to html, then inspect testquotes.html while resizing the browser window. Compare the HTML output around inline MathJax equations, quotes, commas, and full stops; done means those punctuation-adjacent line breaks no longer appear.

Written by the indexing model from the issue text.

Assessment

Tech stack
html, javascript
Domain
frontend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.