Summary:
Use the TeX definitions of `\root` to get the optional `\sqrt`
argument in the right place. Also add the MathML version.
Fixes#48
Test Plan:
- `make test`
- See that the images look good
Reviewers: kevinb, alpert
Reviewed By: alpert
Differential Revision: https://phabricator.khanacademy.org/D17236
Summary:
The greediness of the `\color` function wasn't set correctly,
leading to expressions like `\color{red}\text{a}` parsing correctly,
when they shouldn't. (This is based on how MathJax parses, since TeX
doesn't have a `\color` function, so MathJax is the standard).
Test Plan:
- Make test
- See that `\color{red}\text{a}` doesn't parse (like MathJax)
- See that `\color{red}{\text{a}}` does parse (like MathJax)
- See that `\color{red}\frac12` doesn't parse (like MathJax)
- See that `\color{red}{\frac12}` does parse (like MathJax)
- See that `\red\text{a}` doesn't parse (like MathJax)
- See that `\red{\text{a}}` does parse (like MathJax)
- See that `\red\frac12` doesn't parse (like MathJax)
- See that `\red{\frac12}` does parse (like MathJax)
Reviewers: alpert
Reviewed By: alpert
Differential Revision: https://phabricator.khanacademy.org/D17130
Summary:
Using \phantom with non-phantom math in Perseus doesn't render to be the
same size because \phantom uses MathJax and the non-phantom math uses KaTeX.
Implementing \phantom in KaTeX should solve this alignment issue.
Test Plan:
[x] write (and run) unit tests
[x] create (and run) screenshotter tests
Reviewers: emily
Reviewed By: emily
Differential Revision: https://phabricator.khanacademy.org/D16720
Summary:
Create our own screenshotting script which takes screenshots. This
improves over huxley for a couple reasons:
- It makes the screenshots the correct size (for some reason, huxley struggles
with this).
- Its configuration matches more with what we want (we don't need multiple
screenshots or interaction, we just want a single static shot)
- It runs faster
I also changed the docs to reflect this change.
Test Plan:
- Make sure all of the tests that were in the Huxleyfile are now in ss_data.json
- Run the screenshotter docker
- Make sure all of the images look reasonable and don't change (except
sometimes the Lap test, which has some strange pixel-positioning
differences...)
Reviewers: kevinb
Reviewed By: kevinb
Differential Revision: https://phabricator.khanacademy.org/D16731
Summary:
This adds support for rendering KaTeX to both HTML and MathML
with the intent of improving accessibility. To accomplish this, both
MathML and HTML are rendered, but with the MathML visually hidden and
the HTML spans aria-hidden. Hopefully, this should produce much better
accessibility for KaTeX.
Should fix/improve #38Closes#189
Test Plan:
- Ensure all the tests, and the new tests, still pass.
- Ensure that for each of the group types in `buildHTML.js`, there is a
corresponding one in `buildMathML.js`.
- Ensure that the huxley screenshots didn't change (except for
BinomTest, which changed because I fixed a bug in `buildHTML` where
`genfrac` didn't have a `groupToType` mapping).
- Run ChromeVox on the test page, render some math. (for example,
`\sqrt{x^2}`)
- Ensure that a mathy-sounding expression is read. (I hear "group
square root of x squared math").
- Ensure that nothing else is read (like no "x" or "2").
- Ensure that MathML markup is generated correctly and is interpreted
by the browser correctly by running
`document.getElementById("math").innerHTML =
katex.renderToString("\\sqrt{x^2}");` and seeing that the same speech
is read.
Reviewers: john, alpert
Reviewed By: john, alpert
Subscribers: alpert, john
Differential Revision: https://phabricator.khanacademy.org/D16373
Summary:
Add the ability to pass in options to the render calls which contain information about the parse. This information is passed around to the parser and builder, which parse and render differently depending on the options. Currently, this includes an option to render the math in display mode (i.e. centered, block level, and in displaystyle).
Also added some changes to make it easier to add new data to functions (now that new data doesn't need to be copied into the ParseFuncOrArg data structure, it is looked up when it is needed) and has more sane support for the `'original'` argType (as suggested by pull request #93).
Test Plan:
- Make sure tests and lint pass
- Make sure huxley screenshots didn't change, and new screenshot looks correct
Reviewers: alpert
Reviewed By: alpert
Differential Revision: https://phabricator.khanacademy.org/D13810
Summary:
Add correct parsing of optional arguments. Now, things like `\rule` can shift
based on its argument, and parsing of `\sqrt[3]{x}` fails (correctly) because we
don't support that yet.
Also, cleaned up the lexing code a bit. There was a vestige of the old types in
the lexer (they have now been completely moved to symbols.js). As a byproduct,
this made it hard to call `expect("]")`, because it would look at the type of
the Token and the type for "]" was "close". Now, all functions just look at the
text of the parsed token, and in special occasions (like in the dimension lexer)
it can return some data along with it.
Test Plan:
- Make sure tests still work, and new tests work
- Make sure no huxley screenshots changed
- Make EXTRA SURE `\sqrt[3]{x}` fails.
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D13505
changed stopType (string) parameter to breakOnInfix (boolean)
renamed rewriteInfixNodes to handleInfixNodes
added a test for {1 \over 2} \over 3, fixed some grammar, and added code in the parser to squash superfluous ordgroups
removed squashOrdGroups and instead don't create an "ordgroup" if one already exists
removed unnecessary variable
moved variable declarations out of "if" statements
removed comment
Fixed style issue with where variables are declared and remove unnecessary comment from functions.js
Summary:
Create a fonts.less file which generates identical css to fonts.css, but using
less rules to be more understandable and customizable. For example, add the
ability to change where the fonts directory is located (instead of mandating it
be located next to the less file), and add the ability to disable specific font
formats (like disable EOTs when IE8 support isn't needed).
Test Plan:
- Ensure that the test page and huxley page still work
- Ensure that the output of `./node_modules/.bin/lessc static/fonts.less` is
the same as the original css by running both through
`./node_modules/.bin/cleancss` and diffing them.
- Ensure that the huxley screenshots haven't changed
- Ensure that the build step still works
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D13326
Update huxley, and then use the Dockerfile to create new huxley screenshots.
Test plan:
- Make sure generating new huxley screenshots works
- Ensure that re-generating huxley screenshots produces no changes
Auditors: alpert
Summary:
Improve the build process by combining the CSS files, automatically
selecting font files to include, and building .tar.gz and .zip files.
Test Plan:
- Make sure tests work
- Make sure huxley screenshots didn't change
- Make sure zip and tar.gz files contain only files we want to distribute
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D13159
Summary:
Add support for math-mode accents. This involves a couple changes.
First, in order to correctly position the accents, we must know the kern between
every character and the "skewchar" in that font. To do this, we improve our tfm
parser to run the mini-kern-language and calculate kerns. We then export these
into fontMetrics.js.
Then, we add normal support for accents. In particular, we do some special
handling for supsubs around accents. This involves building the supsub
separately without the accent, and then replacing its base with the built
accent.
Finally, the character in the fonts for the \vec command is a combining unicode
character, so it is shifted to the left, but none of the other characters do
this. We add some special handling for \vec to account for this.
Fixes#7
Test Plan:
- Make sure tests pass
- Make sure no huxley screenshots changed, and the new one looks good
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D13157
Test Plan: Ran unit tests. Looked at `\blue{\displaystyle \left(\dfrac{a^\sigma}{\sin \theta}\right\Updownarrow \intop_{1/2}^{z^z} \sum_{i=0}^\infty x \,dx}` in Chrome and saw the future in my eyes.
Reviewers: emily
Reviewed By: emily
Subscribers: jessie
Differential Revision: http://phabricator.khanacademy.org/D13154
Summary:
Add support for all of the other operators, including the ones with symbols and
limits. This also fixes the bug where subscripts were shifted the same amount as
subscripts.
To accomplish this, the domTree.textNode has been repurposed into symbolNode
which is no longer an actual text node, but instead represents an element with a
single symbol in it. This lets us access properties like the italic correction
of a symbol in a reasonable manner without having to recursively look through
children of spans.
Depends on D13082
Fixes#8
Test Plan:
- Make sure tests work
- Make sure huxley screenshots didn't change much, and new screenshot looks good
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D13122
Summary:
Add a way to automatically build vlists correctly. Previously, we built
vlists manually in ~4 different places, which made it difficult to manage
changes, and led to a large amount of duplication in the less. This also fixes
the vlist construction in safari, where the `display: inline-table` wasn't being
applied because of CSS specificity. This leads to the only significant change in
the huxley tests, with the vertical spacing.
Test Plan:
- Make sure the tests still work
- Make sure most of the huxley screenshots didn't change, and that the new
changes are insignificant.
- Make sure vlists now work in Safari
- Make sure the change to the VerticalSpacing screenshot is caused by the
fix-baseline span now correctly applying `display: inline-table` by creating
the construct in master and adding `display: inline-table !important` to the
`.fix-ie` css rule
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D13082
Summary:
Move dom creation into katex.js so our tests can test non-dom things, and add
some buildTree tests. Add some checks make utils.js work in node. Add support
for jasmine-node, to allow for command line unit testing.
Test Plan:
- Make sure tests work, in both the browser and with `make test`
- Make sure huxley screenshots didn't change
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D13125
Summary:
Add \displaystyle, \textstyle, \scriptstyle, and \scriptscriptstyle commands.
Added tests and huxley screenshots for everything that looks different in
displaystyle vs normal style.
Fixes#24.
Test Plan:
- See new tests work, and old tests still work
- See no huxley screenshots changed, and new screenshot looks good
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D13079
Fix the \frac and \overline lines so they actually render at the correct sizes
(i.e. don't get smaller when in script and scriptscript sizes). This also seems
to fix#33.
Test Plan:
- Make sure new huxley screenshot look good.
- Render
\frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} =
1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}}
{1+\frac{e^{-8\pi}} {1+...} } } }
at small font sizes like 30pt and smaller, see that it looks much better
Auditors: alpert
Summary:
Rewrote the parser to make this work, and added a bunch of tests to make sure
this does work. In the process, refactored all of our functions into a separate
file, functions.js. Added a bunch of comments to Parser.js. Also, update jasmine
so we can make our tests better, and add a lint_blacklist.txt to not lint bad
jasmine stuff.
Fixes#10Fixes#12
Test Plan:
- Make sure all of the tests still work, and all of the new ones work also
- Make sure huxley screenshots didn't change
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D12989
Summary:
Follow the TeXbook instructions on how to construct square roots. Using
makeCustomSizedDelim, this becomes nearly trivial.
Test Plan:
- Make sure normal tests work
- Make sure the new huxley test looks good, and other huxley tests haven't changed.
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D12918
Summary:
Added stacked delimiter support for more delimiters. Split out delimiter
functions into its own file, and split out some tree building functions into a
common file. Supports the empty `.` delimiter with \left and \right, and doesn't
try to produce huge /, \backslash, <, or > delimiters. Depends on D7844
Test input:
\left( \left) \left[ \left\lbrack \left] \left\rbrack \left\{ \left\lbrace
\left\} \left\rbrace \left\lfloor \left\rfloor \left\lceil \left\rceil
\left\langle \left\rangle \left/ \left\backslash \left| \left\vert \left\|
\left\Vert \left\uparrow \left\Uparrow \left\downarrow \left\Downarrow
\left\updownarrow \left\Updownarrow {x^{x^{x^{x^{x^{x^{x^{x^{x^{x^x}}}}}}}}}}
\right.\right.\right.\right.\right.\right.\right.\right.\right.\right.
\right.\right.\right.\right.\right.\right.\right.\right.\right.\right.
\right.\right.\right.\right.\right.\right.\right.\right.
Test Plan:
- Run the test input, see that it works
- Run the tests, see that they work
- Look at huxley screenshots (not here yet :( ) and make sure they look good
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D11602
Summary:
This incorporates the changes to add a KA copyright, and to generate the woffs
from the ttfs, not the otfs.
Test Plan:
- Run huxley tests, see very little has changed (it looks like all the images
shifted back down ~1/2 pixel, the opposite of what happened in ad97dab19c
when we started making our own woffs, which means we probably are now
generating woffs the same way fontsquirrel does)
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D12889
Summary:
I don't know why we originally used 2/3em for scriptstyle, but both TeX
and MathJax use 0.7em for the scriptstyle size.
Test Plan:
- Look at huxley tests, make sure everything that changed is due to the change
in font size
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D12869
Summary:
Instead of using the metrics from our generated TTF files, use the fonts that
TeX ships with. Pull the mapping out of the MathJax-dev repo from makeFF to get
the correct mapping of metrics to font characters, and use our own tfm reader to
extract metrics out of the tfm files into a useable format. Add a README and
Makefile rule to make this process easier in the future.
Also remove the silly 0.05em we put on supsubs because our italic correction
works now.
Test Plan:
- Run huxley tests, see that changes are because of font metric changes.
- See that the extension piece of `\bigl |` now extends above the top, as it is
supposed to.
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D12867
Summary:
Supports the 'ex' and 'em' units for sizes. Doesn't support the optional depth
argument.
Test Plan:
- See that the huxley test looks good, and nothing else changed
- See that the tests pass
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D12777
Summary: Plain TeX assigns `\scriptspace=0.5pt`, which is used in Rules 18bcd in the TeXbook's Appendix G.
Test Plan:
- Look at `x^{x^{x_{x_{x_{x_x}}}}}\biggr|`, see a gap that looks similar to the one produced by real TeX.
- Look at the huxley tests, see that they look reasonable. Make sure that all changes to other huxley tests are now correct, and only changed because of this.
Reviewers: emily
Reviewed By: emily
Subscribers: jessie
Differential Revision: http://phabricator.khanacademy.org/D12763
Summary:
In LaTeX, large delimiters are the same font size as they are at a normal size,
regardless of the actual size. This means that we need to scale up the font size
in the inner nodes, which is annoying because we run into the same problem we
had with \Huge, etc in those nodes. Thus, this fixes both problems at once.
The problem was that when we used our baseline-align-hack and then increased the
font size inside of one of the middle (display: block and height: 0) nodes, the
node with the increased font size would shift downards (misaligning its
baseline). To fix this, we add a method for calculating the maximum font size
used in each of the nodes, and adding a small node with this font size to each
of the other nodes (including the fix-ie node). This shifts all of the nodes
down the same amount, and gets their baselines aligned.
Test Plan:
- Do dumb things by putting \Huge and \big in places they shouldn't be, and
make sure they behave responsibly
- Do the same thing in IE 8, 9, 10, 11, Safari, Firefox, and make sure they all
behave the same (to some approximation)
- Make sure the new huxley image looks good, and the images that changed don't
have significant changes
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D12684
Summary:
Also, rename all of our uses of fonts to use the uppercased versions. We want to
use the uppercase versions because it makes updating and modifying the fonts
much easier (since the font names inside the actual font files are uppercased).
Test Plan:
- Make sure the huxley screenshots look good (You can compare a diff of them
on github at
f90d093361
By my eye, it seems like some things have moved up ~1/2 pixel, and some of
the fonts have maybe slightly changed shape, like the large `b` in
SizingBaseline)
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D11979
Summary:
Follow the instructions in the TeX book for drawing \overlines. This uses the
same code as fractions to produce the bars. Also added the ability to cramp
styles (i.e. T -> T' and T' -> T').
Test Plan:
- Look at `\overline{x}`, `\overline{\dfrac{x}{y}+z}`, and
`\blue{\overline{x}}` to make sure they look good.
- Make sure the tests work
- Make sure the huxley tests look good (Not here yet :( )
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D11604
Summary:
Make delimiter sizing work. This involved
- Adding the symbols for the remaining delimiters (like `\lfloor` and `\{`)
- Adding metrics for the size1, size2, size3, and size4 fonts
- Parsing delimiter sizing functions
- Using the big fonts when possible, otherwise building large copies of the
delimiters from scratch
Test Plan:
- See that
`\bigl\uparrow\Bigl\downarrow\biggl\updownarrow\Biggl\Uparrow
\Biggr\Downarrow\biggr\Updownarrow\bigm/\Bigm\backslash\biggm|
\Biggm|\big\lceil\Big\rceil\bigg\langle\Bigg\rangle\bigl(\Bigl)
\biggl[\Biggl]\Biggr\{\biggr\}\Bigr\lfloor\bigr\rfloor`
parses correctly (this contains all of the delimiters, and all of the sizing
modes)
- See that the huxley tests didn't change, and the new one looks good
- See the normal tests work
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D7844
These are the current screenshots using the docker created with this Dockerfile:
https://gist.github.com/xymostech/68d885cb6a4ff7a6e2ed
The screenshots are deterministic, so this will be the preferred way to create
huxley screenshots from now on.
Auditors: alpert
Huxley had some strange problems where screenshots kept getting messed up by
becoming different sizes than they were before. Node-huxley seems to have fixed
this problem, so we'll try using that instead.
Also, fix the sizing tests to the new syntax.
Auditors: alpert
Summary:
Implicit groups are objects that act like groups but don't have brackets around
them. This is used for things like sizing functions or font-change functions
that can occur in the middle of the group, but act like they apply to a group
after them which stops when the current group stops. E.g. `Hello {world \Large
hello} world` produces normal, normal, Large, normal text. (Note, I just came up
with the name implicit group, I don't think this is actually how it is parsed in
LaTeX but it fits nicely with the current parsing scheme and seems to work
well).
For now, apply this to the sizing functions (we don't have any other functions
that act like this). Also note that this doesn't really do much practically
because we limit sizing functions to only be on the top level of the expression,
but it does let people do `\Large x` and get a large `x`, without having to add
braces.
Test Plan:
- Run the tests, see they work
- Make sure `abc \Large abc` looks correct
Reviewers: alpert
Reviewed By: alpert
Differential Revision: http://phabricator.khanacademy.org/D10876
Summary:
In something like `\text {hello, world}` we want to ignore the first space but not the second. This suggests to me that perhaps we shouldn't be in text-lexing mode until we actually see the first curly brace, so this changes us to do that.
Note that this disallows doing unbraced text things now; it seemed nontrivial to lex a single text character while ignoring spaces. We should probably fix it sometime, but for now we'll fall back to MathJax anyway so I'm not super concerned.
We should also add a huxley test for this.
Test Plan: `\text {2x 2}` rendered `2x 2` in a non-italic font.
Reviewers: jack, emily
Reviewed By: emily
Differential Revision: http://phabricator.khanacademy.org/D9376
Summary:
In rule 18a. of the TeX book, it says we're supposed to set `u` and `v` to 0 if
the nucleus is a character box. Character boxes are loosely defined, but through
experimentation they are anything that contains a single character, including
ordgroups with a single element in them. This change makes KaTeX follow this
rule, and fixes T2404.
Test Plan:
- Make sure the new huxley screenshot looks good
- Make sure none of the huxley tests have changed
Reviewers: alpert
Reviewed By: alpert
Maniphest Tasks: T2404
Differential Revision: http://phabricator.khanacademy.org/D8275
For some reason, when you have a nested elements that look like
`display: inline-block; > position: relative; > position: absolute;`
then the `position: absolute;` element is shifted down a bunch. If there is
anything* else inside either of the other two elements, then this behavior
disappears. (This can be seen at [this fiddle](http://jsfiddle.net/qZXRr/). We
have this structure when we create `\llap` and `\rlap`s, and this weird behavior
So, to fix this I added an empty `display: inline-block;` span inside the llap
to fix this.
Test plan:
- See that the new huxley image looks good
- Test this in a bunch of browsers and see they also look good
Auditors: alpert
Add in the missing `'sizing'` entry, put the `'text'` entry in the correct
place, and replace `groupToType.ord` (a null value) with `groupToType.mathord`
(something real).
Test Plan:
- See that `^3+` now puts the correct space before the `+`
- See the new huxley test works, and nothing else has changed
Auditors: alpert