* Line breaks for inline formulas
* Basic support for \allowbreak and \nobreak
* Fix spacing around \nobreak, and add documentation
* Backwards-compatibility _getBuilt to fix tests
* Put operator spacing on same line as operator
* One approach to ~
* Simplify \allowbreak/\nobreak, make ~/\nobreakspace prevent line breaks
* Adapt to #1295
* Prevent wrapping within a .base
* Implement \hspace* properly
* Fix flow error
* Update comment for regularSpace
* Update screenshots
* Move `width: min-content` from .katex into .base
* Fix screenshot
* Add min-width rule to .vlist-s
* Factor out hasClass method
* Cleanup nobreak test
* Pull out buildHTMLUnbreakable
* Fix \hspace* test (no longer the same as \hspace)
* Fix \nobreak handling
* Add screenshot test
* Fix \underbrace
Fix the vertical alignment so that it correctly takes into account the descender of the lower element.
Fixes issue 1303.
* Update screenshots
* Format buildHTML groupType definitions in preparation for adding types.
1) Collapse groupType definitions (a bunch of functions all of the same type
defined on the groupType object) into a single object in preparation for
putting types only on the base object.
2) Do minor reformatting to account for the +4 indent above which pushes some
lines past 80 characters.
3) Do other minor formatting changes for readability, taking advantage of ES6.
* Review fixes.
* Fix \nobreakspace, refactor "regular space" checking
Fix#1199 by adding \nobreakspace to the list of commands/symbols that
behave like a regular space character. Refactor to put that list in one
place, and use an object so it checks instantly instead of sequentially.
* Copy test from #1201
* Remove dummy spans for spacing around \href
Spacing around \href is handled in the `buildHTML`
* Make bin cancellation aware of children of fragment and anchor
+ Added getOutermostNode function
* Fix tight spacing not applied
* Add surrounding argument to html.buildExpression
It is an array consisting type of nodes that will be added to the left
and the right, and if given, will be used to determine bin cancellation
and spacings of outermost nodes.
* Fix html.buildExpression call in leftright
* Add dummy span only when given
* Update buildHTML.js
* Support Reaction Arrows
This PR is written to supply reaction arrows for a future `mhchem` extension. `mhchem` uses seven reaction arrows. Four of them correspond to extensible arrows already available in KaTeX. This PR creates the other three.
These arrows will also be useful to chemists writing about reactions when `mhchem` is unavailable.
Three new extensible arrows are introduced: `\xrightleftarrows`, `\xrightequilibrium`, and `\xleftequilibrium`.
These names are not `mhchem`’s user-facing function names. In `mhchem`, users would call these arrows with syntax such as: `\ce{A<-->B}`, or `\ce{A<=>>B}`, or `\ce{A<<=>B}`. I’ve provided names that look more like the other extensible arrow names. That’s probably worth some discussion.
* generate screenshots for ReactionArrows
* Increase overlap in arrow shaft
To prevent a small gap when rendering in very large font sizes.
* Adjust upper text vert alignment. Add warning.
* Limit alignment adjustment to \xleftequilibrium
* generate screenshots for reaction arrows
* Use JS for spacing between atoms instead of CSS
Summary:
This is the first step towards creating an intermediate representation
that can be used to generate HTML, SVG, and Canvas commands for rendering.
By generating spans that contain the width of the spaces instead of
relying on CSS sibling rules we'll be able to one day replaces the spans
with intermeidate 'Glue' nodes (in a later PR).
An added benefit of this approach is that is enables us to programmatically
change the values for thinspace, mediumspace, and thickspace which will
allow us to implement the \setlength command.
Test Plan:
- npm test
- dockers/Screenshotter/screenshotter.sh --verify
* fixed failures in BinCancellation, BoldSymbol, and OperatorName
* update screenshots
* don't use current size when determining size of spaces, update more screenshots
* fix spacing in SizingBaseline and StyleSwitching
* actually do the right thing for sizing groups
* fix \not for Chrome and Firefox
* do TODOs
* address feedback from the code review
* fix issue in delimsizing.js
* add TODO to think about a better solution in href.js
* fix typos, simplify href, be honest about paddingLeft for \not
* extract accent and accentunder into their own files
* cleanup how we apply custom styles to accentBody wrappers
* address feedback from code review
* fix typo
* define a flow type for a CSS style
* clone 'style' object passed to methods in domTree
* forgot that we don't support object spread yet
* Make accents zero width
Make the width of an accented character equal to the width of the character,
by making accents zero width. In particular, fixes#1028 (`\ddot\imath`).
This involved reworking all of the accent offset machinery, in particular
skew and accent-hungarian. A bit cleaner now.
Also added support for the new width character metrics in symbolNode.
* Update AccentsText test
* Fix comment
* Adding support for SansSerif-Bold
* Updating to include SansSerif Italic.
* WIP
* Working text stacking
* More robust screenshot.
* Don't want to break users :)
* Updating per PR comments.
* Fixing Unicode and updating snapshots.
* Adding suggested tests.
* Opting to use old method for unit testing.
* Adding TODO
* Refactor \kern, proper \mkern support, add \hskip
* Move \kern, \mkern into functions directory
* Add \hskip, \mskip support (but without supporting plus/minus)
* Properly separate \kern, \hskip from \mkern, \mskip.
(The former work in both modes, and don't support mu units.
The latter work only in math mode and only support mu units.)
* Render \kern etc. using MathML <mspace>
* Implement \TeX macro
* Implement \LaTeX
* New KaTeX logo \katex
* Rename hskip.js -> kern.js
* Tweak katex \kern to 0.16em
* \katex kern -.17em
* Compute A raise height in \LaTeX and \katex
* Switch mu unit errors to warnings
* LaTeX screenshot test
* Replace \KaTeX with macro definition
* Update screenshots with \KaTeX in them
* Fix font selection for \*TeX macros
* Change frac-line from border to full span
Change `frac-line` and `vertical-separator`. Instead of using span borders, fill entire span using a `box-shadow`.
This change will enable more dependable engagement of the `min-height` CSS.
* Fix indentation
* Fix indent again
* Change box shadow to inline SVG
* Fix lint error
* regenerate screenshots after switching to SVG for fraction bars
* Change buildCommon.makeVList params to struct for better type-safety.
This is towards #939.
The expected structure of the makeVList params depends on the `positionType`
parameter. To allow this to be strictly-typed using flow, this PR combines the
co-related parameters into a single struct.
* Add type for makeVList param in comments for documentation.
* Initial webpack config. Moving to ES6 modules. Some module cleanup.
* WIP
* WIP
* Removing commented out code.
* Removing old deps.
* Removing the build script (used for testing).
* Working tests.
* Switching to node api over cli.
* Updating per comments. Still need to fix server.js to properly run the selenium tests.
* Cleaning up the config.
* More cleanup.
* Bringing back server.js for selenium tests.
* Bringing back old dependencies.
* Adding back eslint rules for webpack config. Final cleanup for webpack config.
* Pointing to correct pre-existing module versions. Adding some extra logic to server.js to ensure it gets transpiled properly.
* Getting make build to work again. Updating package.json with some shortcut scripts.
* Resolving conflict.
* Reverting back to commonjs modules.
* Removing extra spaces in babelrc
* Implement \verb
* Implement @gagern's comments
* \verb: look up characters one at a time.
* Add screenshot test for \verb
* Add error tests for \verb
* Include space symbol in typewriter font, and fix single quotes
This is based on https://github.com/Khan/MathJax-dev/pull/2
which hasn't been accepted yet at the time this commit is made.
* Add \verb* tests
* \verb should use Typewriter-Regular font!
* Switch \verb to use text mode and no-break space.
* Screenshot update with Typewriter-Regular
* \verb test: fix *, add commas to make spaces clear
* Fix spaces and style handling
* Implement @kevinbarabash's comments
* Make error clearly an assertion failure
* verb screenshot for Chrome
* refactor defineEnvironment to also accept HTML and MathML builders, fixes#870
* make argTypes mandatory, remove unused props from EnvProps, use while(true)
* Fix \sqrt zoom in Safari
This PR evades a Safari bug which causes nested SVGs to zoom improperly. `\sqrt` and single-ended arrow SVGs have been modified.
These have been converted from nested SVGs to single level. Their long tails are now sliced off using CSS `overflow: hidden`.
Safari will still improperly zoom any double-ended stretchy arrows and horizontal braces.
* Fix \sqrt{}
Even if the function argument is empty, still render an SVG whose width equals the surd glyph.
* Fix tall \sqrt when scaled
* update screenshots affected by sqrt fixes
* more screenshots after changes to fix sqrt
* Pick up review comments
* Support \colorbox and \\fcolorbox
These are functions from the `color` package. They accept text, not math. They also have padding similar to `\fbox`.
Because of the padding, the code in `buildHTML` is intermixed with the `\fbox` code. I have not (yet) created a new file in the functions folder. This way, the reviewer gets a cleaner diff.
* Fix lint error
* colorbox screenshots
* Pick up review comments
* Improve SVG Performance
This PR introduces three new classes: `svgNode`, `pathNode`, and `lineNode`. SVG data is then loaded into the domTree exclusively via instances of these classes.
`innerHTML` is banished.
* Fix lint errors
* Fix \cancel typo
* Fix sqrt height
* Adjust min-lenght
Adjust some of the extensible arrows to get a min-length that matches glyph length of the long arrows in KaTeX Main font range from Unicode 27F5 to 27FC.
The accent arrows still get min-lengths that match the arrows in the Unicode 2100 range.
* regenerate screenshots after optimizing SVG code
* update DisplayStyle screenshot for Chrome
* update OverUnderset and Smash screenshots for Chrome as well
* Remove escapes from template strings
* Pick up review comments
* Fix lint errors
* Add comments
* Rough support for \raisebox
* Fix bounding box thanks to @kevinbarash and @ronkok
* Use calculateSize to support all currently supported units (ex, em, mu).
* Shift height and depth in all cases.
* Add screenshot test
* Rename transform -> raisebox
* Switch to normalsize in raisebox
* Attempt at using makeVList
* Significant rewrite, now working well
* rename textFunctionStyles to textFunctionFonts
* Add \smash, laps, spaces, and phantoms
1. Support `\smash`, including the optional argument from AMS.
2. Change `\llap` and `\rlap` so that they render in text style. Repeat: This *changes* KaTeX behavior.
3. Add `\mathllap` and `\mathrlap`. These will act as they do in `mathtools` and as in previous KaTeX versions of `\llap` and `\rlap`.
4. Add `\mathclap` and `\clap`.
5. Add `\hphantom` and \vphantom`.
6. Add `\thinspace`, `\medspace`, `\thickspace`
7. Add `\hspace`.
This work will resolve issue #270 and parts of #50 and #164.
A. Perlis has written a [concise description](https://www.math.lsu.edu/~aperlis/publications/mathclap/perlis_mathclap_24Jun2003.pdf) of items 1 thru 5. Except for `\smash`'s optional argument. It's described in the [AMS User's Guide](http://texdoc.net/texmf-dist/doc/latex/amsmath/amsldoc.pdf).
Item 6 also comes from the AMS User's Guide.
* Fix test spec
* Exploit makeVList for smash
* update smash and phantom screenshots for chrome
* Pick up review comments
* Change test from \llap to \mathlap
\llap is fundamentally a text-mode function. We should not expect it to work correctly when given math-mode arguments. So test \mathllap instead.
* Correct \llap macro
A correction. The previous macro returned an error if given an argument with math-mode content, such as x^2.
The corrected macro will not return an error. It will instead return well rendered math, but letters are in `\mathrm` font.
* update \llap, \rlap, \clap macros to use \textrm
* update Lap screenshots
src/functions.js was returning two properties referring to the base; since buildHTML runs `JSON.parse(JSON.stringify(tree))` to get an immutable copy, that meant we'd traverse and serialize and parse an exponentially-sized tree.
Test Plan: `\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{\breve{A}}}}}}}}}}}}}}}}}}}}}}}}}}}}}}}}}}` renders instantly; previously, it reliably timed out with even half that depth.
* Support for \' \` \^ \~ \= \u \. \" \r \H \v text-mode accents
* bug fix
* Possible Safari fix
* Forbid text accents in math mode
* Switch to noncombining characters for most accents. Revert Safari change.
* Add tests
* Found non-combining diaresis accent too
* Improve \sqrt
Make \sqrt out of inline SVGs to ensure a perfect match at the junction between surd and viniculum.
* Tweak for kern clarity
* Fix lint error
* regenerate screenshot tests with sqrts
* Correct advance
Edit the SVG paths so that they have the correct left bearing and advance width values.
This will correct the spacing on the left side of each surd and it will also improve the placment of a root indice.
* Revise scriptstyle surds
In the `main` size, delimiters *do* scale with scriptstyle and scriptscriptstyle.
* update screenshot images containing sqrts
* Use inline SVG for stretchy elements
Replace all background-images with inline SVG code.
Pros:
* `\color` works in all browsers, even IE/Edge
* Better printing
* Much simpler CSS
* No links to background-images
* No `mask`
* No browser-detection
* No external SVG files
* Faster first rendering
Cons
* No image caching
* Heavier HTML load
* Larger JavaScript file
* `\cancel` line is in `px` units, not `em` units
* Remove static/images from make file
* Change \cancel from px to em
* regenerate screenshots for functions using inline svg
* Improve rule coding.
* Rule widths (overline, underline, fraction, sqrt) actually scale
with the current font size in AMS-TeX. Implement that. (Sqrt is
a special case: the rule width depends on the font size *of the
surd*.)
* Change the CSS coding for rules. The old, complex coding prevented
variable-width lines and may have contributed to issues like #696.
Its purpose, according to 0a3a2271f4,
was IE8 support; but KaTeX no longer supports IE8.
* The 0.5px offset makes larger sizes better, smaller sizes worse.
Smaller sizes seem more important.
* Cleanup (intended to be squashed).
* Make KaTeX work in Quirks mode
Summary: In issue #601, it was noticed that the KaTeX bug with the fraction
bars overlapping the text was occuring with an XHTML doctype. This indicated
that the bug we were seeing was caused by both quirks mode and limited-quirks
mode (which is a version of quirks mode with fewer quirks and is enabled for
various doctypes including some XHTML ones).
Based on the [quirks spec](https://quirks.spec.whatwg.org/), it appears that
there are only two quirks in limited-quirks mode, both having to do with a
line-height calculation. @gagern figured out that if we added some zero-width
spaces in our elements, we would stop triggering the quirk, which would make
our fractions render correctly in limited-quirks mode.
I implemented that change, and ran the screenshotter in limited-quirks mode.
There were several other places that suffered from the same quirk, but were
also easily fixed via adding zero-width spaces. I then ran the screenshotter in
quirks mode, and discovered that (once an appropriate meta charset was added),
everything looked correct still.
So, this diff fixes all of the places that the limited-quirks mode quirks
affect our rendering, and removes the warning about rendering in quirks mode.
I also added support to our screenshotter to render things in both no-quirks
and quirks mode, to ensure that things don't break in the future. I copied the
non-quirks images to the quirks images, and ran the screenshotter with
`--verify` to make sure that they look the same.
I have some thoughts that I'd like to hear opinions about:
- I'm not super happy with how the screenshot tests work. Ideally we'd test
both quirks mode and non-quirks mode against the same images, since we'd
like them to be the same. I'm not sure how to make that work well, though,
since then people wouldn't be able to tell if it's a quirks-mode problem or
not.
- I removed the doctype in the testing page file, so all testing would now be
done in quirks-mode. Not sure if we really want that.
- I need to test this in IE, but it looks like the trailing commas change we
made with eslinting is causing problems (cause IE doesn't like trailing
commas).
Test Plan:
- `./dockers/Screenshotter/screenshotter.sh --verify`
* Compare quirks mode against same screenshot files
Now the screenshotter itself can run more than one mode. It does serve the
HTML file from its own JavaScript code now, so that it can include different
doctype headers without needing distinct files for each. There is a
provision to mark specific tests as quirky in case they produce different
results depending on the mode.
* Some cleaning up and comments
* Restore access to the babelified version of the HTML page for screenshots
* Reference unicode fonts using absolute path names
This avoids issues caused by the fact that the dynamically generated
ss-render.html is mounted to a different location than the test.html from
which it is derived.
* do chrome screenshots first
* remove commented out code, simplify hadle_search_string call
TeX and CSS treat line heights in fundamentally different ways. In
TeX, every character is treated as a box of its precise height and
depth; the line height (\baselineskip) applies after characters have
been assembled into lines. In CSS, in contrast, every character
creates a "line box" corresponding to the accompanying font. When
characters of different fonts and sizes are placed into the same
span, the resulting line box contains the line boxes of all children.
This is unfortunate because, for example, we want `\frac{1}{2}` to
behave in vertical spacing contexts like it is exactly as tall and
deep as the visible fraction (which is the TeX behavior). Given CSS
constraints, though, in most contexts the fraction has extra vertical
space: the line boxes for the numerator and denominator create
padding. For small boxes, this isn't so bad. To really see the
problem put a tall rule in the denominator of a fraction, or check
out the VerticalSpacing screenshotter test, which has way more space
than it should.
Solving this problem in CSS is difficult. There is no easy way to get
rid of the extra line boxes.
But there is *a* way, namely tables. A table-cell with vertical-align
top, bottom, or middle is ignored for the purposes of line height
calculation.
So in this commit, makeVList puts its contents into a
vertical-align:bottom table-cell (to clear unwanted line boxes), with
an extra row used to represent depth.
Many Chrome screenshotter tests change. This is because Chrome rounds
table dimensions to integral numbers of pixels, while it uses
sub-pixel positioning for non-table displayed tabs. That makes many
vlists a fraction of a pixel wider than they used to be.
