Skip to content

Work around negative space bug in Chrome#1194

Merged
k4b7 merged 3 commits intoKaTeX:masterfrom
edemaine:negspace
Mar 9, 2018
Merged

Work around negative space bug in Chrome#1194
k4b7 merged 3 commits intoKaTeX:masterfrom
edemaine:negspace

Conversation

@edemaine
Copy link
Member

@edemaine edemaine commented Mar 3, 2018

Fix #984 and fix #1191 by working around this Chromium bug.

There seem to be two effects of the Chrome negative spacing bug:

  • Within a KaTeX equation, we get spans that are too wide (e.g. in the box). This is fixed by changing .mspace from display:inline-block to display:inline. Alas, while this fixes negative spaces, it breaks (destroys) positive spaces.
  • A non-display KaTeX equation leaves extra horizontal space on the right, affecting surrounding text. This is fixed by setting .base to have width: min-content as suggested by @ronkok in Avoid negative space in \bmod. #984.

Both are fixed by .katex to have width: min-content as suggested by @ronkok in #984. This is automatically inherited by all elements that don't define an explicit width like width: 100%.

The included screenshot test is still somewhat defective, showing a space before the period. This seems limited to the screenshotter, however, as it works fine in the tester via http://localhost:7936/?text=%5Cfbox%7B%5C%241%2C%5C!000%2C%5C!000%7D%5CKaTeX&display=0&after=. (with #1193 merged in for no-display-mode support). I tried upgrading the screenshotter (selenium/standalone-chrome from 2.48.2 to latest), but I could still not get the screenshotter to align with actual Chrome's rendering.

Here's an illustration of how it works with the tester:
image

Old screenshot test for comparison:
negativespace-chrome-bad

You can also see the problem in two places on the KaTeX front page (note space before colon!):

image

Manually changing the CSS in Chrome results in a good rendering:
image

@codecov
Copy link

codecov bot commented Mar 3, 2018

Codecov Report

Merging #1194 into master will not change coverage.
The diff coverage is n/a.

Impacted file tree graph

@@           Coverage Diff           @@
##           master    #1194   +/-   ##
=======================================
  Coverage   79.62%   79.62%           
=======================================
  Files          59       59           
  Lines        3882     3882           
  Branches      654      654           
=======================================
  Hits         3091     3091           
  Misses        658      658           
  Partials      133      133

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 06e0393...b6d4134. Read the comment docs.

@edemaine edemaine force-pushed the negspace branch 2 times, most recently from 0caffab to a69e20a Compare March 3, 2018 18:56
edemaine added 3 commits March 6, 2018 08:52
Fix KaTeX#984

The screenshot test is still somewhat defective, showing a space before
the "post" text (a period).  This seems limited to the screenshotter, however,
as it works fine in the tester via
http://localhost:7936/?text=%5Cfbox%7B%5C%241%2C%5C!000%2C%5C!000%7D%5CKaTeX&display=0&after=.
@k4b7
Copy link
Member

k4b7 commented Mar 9, 2018

I'm not sure why the circleci tests are failing but it doesn't matter b/c they aren't required checks.

Copy link
Member

@k4b7 k4b7 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@k4b7 k4b7 merged commit 20b5a58 into KaTeX:master Mar 9, 2018
@k4b7
Copy link
Member

k4b7 commented Mar 9, 2018

@edemaine thanks for the PR.

@ronkok ronkok mentioned this pull request Jun 19, 2018
@ylemkimon ylemkimon mentioned this pull request Aug 18, 2018
1 task
ylemkimon added a commit that referenced this pull request Jul 13, 2020
The new screenshot is correct as per #1194.
ronkok pushed a commit that referenced this pull request Jul 14, 2020
* Run screenshotter using Chrome 83 and Firefox 76

* Update screenshots

* Update NegativeSpace-chrome screenshot

The new screenshot is correct as per #1194.

* Update Units-chrome screenshot

The new screenshot is correct as per #732 and compared to Firefox.

* Update screenshots
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Inline \KaTeX is too wide in 0.9.0

2 participants