Commit Graph

88 Commits

Author SHA1 Message Date
Kevin Barabash
fd2d58fd80 Adds math commands, HTML rendering, and screenshotter tests.
This is part 2 of 3.  Part 1 added new fonts metrics.  Part 2 will add MathML support and unit tests.
2015-08-19 22:04:34 -06:00
Martin von Gagern
1846929110 Add tool to check symbol group types against LaTeX
At the moment, the tool isn't suitable for automatic regression tests yet,
since some symbols will require human verification.  That might change in
the future though, with a list of manually verified symbols which can be
skipped in automatic verification.  For this reason the file got placed into
the test directory.
2015-08-19 22:56:41 +02:00
Martin von Gagern
758f4a73d9 Merge remote-tracking branch 'origin/master' into ssYaml 2015-08-06 10:18:04 +02:00
Martin von Gagern
62a8b2d4e7 Whitelist keys to include in ss_data query strings 2015-08-03 22:45:22 +02:00
Kevin Barabash
b2d2df9bef Merge pull request #317 from JeffEverett/unsupported_commands
Added support for visual depiction of unsupported commands
2015-07-29 10:55:04 -07:00
Jeff Everett
9b0f42ea50 Fixed limit controls in textstyle 2015-07-28 15:22:30 -06:00
Jeff Everett
e1c221273c Added support for visual depiction of unsupported commands 2015-07-28 00:50:08 -06:00
Jeff Everett
5d83bb8cc0 Added support for \limits and \nolimits controls 2015-07-24 19:33:09 -06:00
Emily Eisenberg
ce99abd1f2 Update Dockerfile for ttfautohint, update metrics
Summary:
Update the MathJaxFonts `Dockerfile` to enable the use of
`ttfautohint` which hints our fonts better. Also, fix the location that
batik is downloaded from, update some formatting in the `Dockerfile`,
and update the fonts and metrics.

Test Plan:
 - Compare a rendered `= - A z 4 \Longrightarrow \Sigma \Biggl(` in
   Chrome on Windows at font sizes 10px to 20px before and after this
   change.
 - See that characters look about the same, or better.
 - See that the screenshot tests didn't change in firefox (maybe firefox
   runs the same autohinting algorithm that we do?), and don't visually
   change in chrome

Reviewers: kevinb, alpert

Reviewed By: kevinb, alpert

Differential Revision: https://phabricator.khanacademy.org/D18977
2015-07-16 12:01:26 -07:00
Martin von Gagern
fb403fa9eb Switch Screenshotter data from JSON to YAML
Escaping TeX in JSON as query strings is a pain: you have to double all the
\\, you have to escape the & and the #, you can't easily include line breaks
for readability, and so on.  YAML solves most of these problems for most of
the situations.  Now each test case can be structured, while simple test
cases only consist of a line of verbatim TeX code, with no escaping.

The most troublesome items remaining are lines starting in { since in YAML
these would denote inline mapping types. We use block notation for these.
2015-07-16 08:57:17 +02:00
Martin von Gagern
b7e1581869 Update chrome screenshots
I forgot to re-create these after rebasing.
2015-07-15 15:40:31 +02:00
Martin von Gagern
6f65f685f3 Add screenshots taken from Chrome 2015-07-14 18:09:58 +02:00
Martin von Gagern
5d155c75db Switch from own docker image to standard selenium images
Since the Selenium images are available for download, and downloading them
is usually faster than building them from scratch, this makes taking
screenshots easier.  Furthermore, since the Selenium image is not specific
to KaTeX, it could as well be used for other purposes, thus saving space
since a single image can be used in multiple projects.

This change also deals with the non-determinism in the Lap screenshot:
We detect the one known (and accepted) alternate rendering and change the
output file name to Lap_alt in this case.  So either Lap or Lap_alt gets
saved to, and if the image is different from both, then one of these files
will show a modification.  On the other hand, if it is equal to either of
these, then the matching one will get overwritten, showing no change.
2015-07-14 18:09:58 +02:00
Martin von Gagern
6362e0f8f2 Test case demonstrating the desired spacing around an array 2015-07-10 17:37:53 +02:00
Martin von Gagern
7dc8b68092 Improve horizontal spacing of fractions
A fraction is surrounded by a box of width \nulldelimiterspace on either side.
That size is 1.2pt and does not scale with the style or font size.
Furthermore, a \frac creates a brace-enclosed group which results in a
\mathord, not a \mathinner.
2015-07-07 10:03:34 +02:00
Martin von Gagern
c562813afa Take snapshots of formulas rendered by LaTeX and compute visual diffs
The same test cases we use for our screenshots from Firefox are now also
being rendered by pdflatex, so the resulting images can be used as reference
for how things are supposed to look (if we concentrate on compatibility with
LaTeX).  To make comparisons even easier, the differences between LaTeX and
Firefox snapshots are rendered in a visual way, using different colors.

Discussed in pull request #268.
2015-07-06 15:54:14 +02:00
Martin von Gagern
758bdba31e Implement cases environment
See issue #278.  Although the official definition makes use of @{…}
notation, we use custom spacing instead, since that seems easier for now.
2015-07-01 08:05:08 +02:00
Martin von Gagern
2f7a54877a Implement environments, for arrays and matrices in particular
This commit introduces environments, and implements the parser
infrastructure to handle them, even including arguments after the
“\begin{name}” construct.  It also offers a way to turn array-like data
structures, i.e. delimited by “&” and “\\”, into nested arrays of groups.
Environments are essentially functions which call back to the parser to
parse their body.  It is their responsibility to stop at the next “\end”,
while the parser takes care of verifing that the names match between
“\begin” and “\end”.  The environment has to return a ParseResult, to
provide the position that goes with the resulting node.

One application of this is the “array” environment.  So far, it supports
column alignment, but no column separators, and no multi-column shorthands
using “*{…}”.  Building on the same infrastructure, there are “matrix”,
“pmatrix”, “bmatrix”, “vmatrix” and “Vmatrix” environments.  Internally
these are just “\left..\right” wrapped around an array with no margins at
its ends.  Spacing for arrays and matrices was derived from the LaTeX
sources, and comments indicate the appropriate references.

Now we have hard-wired breaks in parseExpression, to always break on “}”,
“\end”, “\right”, “&”, “\\” and “\cr”.  This means that these symbols are
never PART of an expression, at least not without some nesting.  They may
follow AFTER an expression, and the caller of parseExpression should be
expecting them.  The implicit groups for sizing or styling don't care what
ended the expression, which is all right for them.  We still have support
for breakOnToken, but now it is only used for “]” since that MAY be used to
terminate an optional argument, but otherwise it's an ordinary symbol.
2015-06-18 22:24:40 +02:00
hathix
9869d59cad Added new exercise colors as macros
Summary:
On https://app.asana.com/0/34646644303310/33935538887378, @eater requested we add some new colors to KaTeX, which lives in the spin-off Khan/KaTeX open source project. (See screenshot for colors.) I added these colors to KaTeX so math typesetting tools in exercises have access to them.

I used "blueA", "blueB", etc. because dashes and numbers aren't supported in KaTeX/LaTeX functions.

The actual mapping of color name => hex value is in "Options", and the listing of colors available for typesetting is in "functions".

See also https://phabricator.khanacademy.org/D18158 for the related additions to utils/math.js and KAthJax.

Test Plan:
- Set up the KaTeX dev environment (instructions taken from https://github.com/Khan/KaTeX/blob/master/CONTRIBUTING.md):
```
cd KaTeX
make setup
make serve
```
- Now that the server is up and running, visit http://localhost:7936/ to try live typesetting. Enter the following LaTeX code to try the new colors:
```
\blueE{e=mc^2}
```
- Try other new colors including \redD, \mintC, \grayH, \kaBlue, etc.
- Old colors like \orange should still work.
- Run the Jasmine test suite at http://localhost:7936/test/test.html.

Reviewers: emily

Reviewed By: emily

Subscribers: nataliefitzgerald, eater, cameron, david

Differential Revision: https://phabricator.khanacademy.org/D18152
2015-05-26 19:07:51 -07:00
John Resig
b9eb8c74e0 Expose a new .__parse() method for generating a parse tree from a math expression. 2015-05-04 15:59:18 -04:00
Emily Eisenberg
af8c1307f7 Add better lint checking.
Summary:
Make the lint checker check more files. Also, make arc run the
linter.

Test Plan:
 - `arc lint`
 - `make lint`

Reviewers: kevinb, alpert

Reviewed By: alpert

Differential Revision: https://phabricator.khanacademy.org/D17509
2015-04-22 18:55:20 -07:00
Emily Eisenberg
c48de165e8 Add optional arguments to \sqrt
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
2015-04-22 15:26:10 -07:00
Emily Eisenberg
99a81aca50 Fix the greediness of the \color function
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
2015-04-01 15:29:04 -07:00
Kevin Barabash
39f5bcb042 Add support for \phantom
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
2015-03-13 16:24:04 -06:00
Emily Eisenberg
51d751f96d Make text operators <mi>s
Summary: According to the MathML spec [about
identifiers](http://www.w3.org/TR/MathML3/chapter3.html#id.3.2.3.3),
text function names should be <mi>s. This fixes that.

Fixes #202

Test plan:
 - `make test`

Auditors: alpert
2015-03-13 08:11:21 -07:00
Emily Eisenberg
2f552af02d Make our own screenshotting script instead of using huxley
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
2015-03-12 16:40:15 -07:00
Emily Eisenberg
aaeab1200c Add MathML rendering to improve accessibility
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 #38

Closes #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
2015-03-01 18:33:20 -08:00
Emily Eisenberg
fd18f6979e Add an optional settings argument to render calls
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
2015-02-19 15:26:57 -08:00
Ben Alpert
2cbee18010 Add \choose support
Test Plan: Looked at `1 + 2\choose {3 \over 4}`, npm tested.

Reviewers: emily

Reviewed By: emily

Differential Revision: http://phabricator.khanacademy.org/D13903
2014-10-15 16:05:58 -07:00
Ben Alpert
006a0a761c Add support for \{,d,t}binom
Test Plan: `\binom xy^{\binom xy^{\binom xy}}` looks like something. `\dbinom` and `\tbinom` also seem to work.

Reviewers: emily

Reviewed By: emily

Subscribers: jessie

Differential Revision: http://phabricator.khanacademy.org/D13315
2014-10-14 17:01:19 -07:00
Emily Eisenberg
def1a47935 Add optional arguments
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
2014-10-01 14:20:47 -07:00
Emily Eisenberg
5722b45633 Merge pull request #101 from kevinb7/over
added support for \over
2014-09-27 01:32:30 -07:00
Kevin Barabash
c566ae6888 added support for \over
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
2014-09-26 15:31:45 -06:00
Emily Eisenberg
a18adfdfad Merge pull request #104 from kevinb7/error.position
added position property to ParseError
2014-09-23 14:04:17 -07:00
Kevin Barabash
afaec30d0a added position property to ParseError 2014-09-23 14:38:41 -06:00
Emily Eisenberg
bd6f762f94 Improve the fonts.less experience
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
2014-09-22 14:23:23 -07:00
Emily Eisenberg
824fb7fd2f Update huxley screenshots
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
2014-09-22 13:58:19 -07:00
Emily Eisenberg
35d9d972fd Move js files into src/
Test plan:
- Make sure huxley tests, jasmine tests, make build, make metrics, make test all
  still work.

Auditors: alpert
2014-09-15 02:50:34 -07:00
Emily Eisenberg
6b674873ea Rename katex.process to katex.render
Test plan:
 - Make sure tests work and huxley tests didn't change

Auditors: alpert
2014-09-14 21:20:27 -07:00
Emily Eisenberg
9dc767041d Improve build process
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
2014-09-14 19:31:38 -07:00
Emily Eisenberg
0dca731da6 Add accents
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
2014-09-13 21:30:35 -07:00
Emily Eisenberg
90573fcaf2 Fix rendering of lists in \left/\right
Test plan:
 - Make sure tests work
 - Make sure screenshots didn't change, and new screenshot looks good

Auditors: alpert
2014-09-13 16:56:15 -07:00
Ben Alpert
7df5b4bba8 Add code for generating HTML
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
2014-09-12 17:59:26 -07:00
Emily Eisenberg
f52c84c187 Add limit operators
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
2014-09-12 14:58:58 -07:00
Emily Eisenberg
29b00ee6b7 Add vlist builder for more consistent stacking
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
2014-09-12 14:41:31 -07:00
Emily Eisenberg
403dca64ab Improve testing
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
2014-09-12 13:30:30 -07:00
Emily Eisenberg
0be77d4e6f Add style changing functions
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
2014-09-10 17:10:38 -07:00
Emily Eisenberg
a76f6eb985 Make all the lines the correct sizes
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
2014-09-10 16:30:38 -07:00
Emily Eisenberg
0c9e9738c3 Fix our parsing strategy so it is the same as (or very similar to) TeX's
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 #10
Fixes #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
2014-09-09 23:18:37 -07:00
Emily Eisenberg
925c96dbe2 Add square roots (\sqrt)
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
2014-09-06 15:08:23 -07:00