Added support for bold italic symbols#1011

aterenin · 2017-12-06T20:25:15Z

This adds support for \boldsymbol, as requested in #633 and #585.

It uses the bold italic fonts already present in KaTeX. It works with both Greek and Latin letters.

khanbot · 2017-12-06T20:25:24Z

Hey @aterenin,

Thanks for the PR! Mind signing our Contributor License Agreement?

When you've done so, go ahead and comment [clabot:check] and I'll check again.

Yours truly,
khanbot

aterenin · 2017-12-06T20:27:24Z

[clabot:check]

khanbot · 2017-12-06T20:27:25Z

CLA signature looks good 👍

k4b7 · 2017-12-06T21:03:06Z

@aterenin thanks for the PR. I thought for some reason we didn't have the fonts or the metrics but apparently we have both. This could probably use a screenshot test. Please see https://github.com/Khan/KaTeX/blob/master/CONTRIBUTING.md#screenshot-tests for details.

aterenin · 2017-12-06T22:48:30Z

Tests implemented.

I'm currently in the middle of travel (coded up this PR while on a flight) so I'm not equipped to install docker to run the screenshotter at the moment. It'd be great if someone could run it and add to the PR, otherwise I'll handle it later.

k4b7 · 2017-12-06T22:55:04Z

test/katex-spec.js

+        expect(markup).toContain("<mi mathvariant=\"bold-italic\">\u03A9</mi>");  // \Omega
+        expect(markup).toContain("<mi>\u0131</mi>");                              // \imath
+        expect(markup).toContain("<mo>+</mo>");
+    });


We've started using snapshot tests for testing MathML markup, see mathml-spec.js. Can you add a test there instead?

I do not understand what those tests do or how they work. There are no similar tests implemented for \mathbf or any similar command. Could you either provide reference on how to implement that or accept as-is and move to mathml-spec.js later, when \mathbf is moved there too?

it("should render \\boldsymbol{" + contents + "} with the correct mathvariants", () => { const tex = "\\boldsymbol{" + contents + "}"; const tree = getParsed(tex); const markup = buildMathML(tree, tex, defaultOptions).toMarkup(); expect(markup).toMatchSnapshot(); });

You'll need to run the tests once locally in order to update the katex-spec.js.snap. Include the changes to that file in this diff and you should be good.

The tests work by comparing the output of future runs agains the snapshot. The snapshot can also be regenerated. I should add more detail to https://github.com/Khan/KaTeX/blob/master/CONTRIBUTING.md#jest-tests along with an npm script to regenerate the snapshots when things change.

I've added a task for myself: #1013.

k4b7 · 2017-12-06T22:55:57Z

test/screenshotter/ss_data.yaml

    \end{array}
 BinomTest: \dbinom{a}{b}\tbinom{a}{b}^{\binom{a}{b}+17}
 BoldSpacing: \mathbf{A}^2+\mathbf{B}_3*\mathscr{C}'
+BoldSymbol: \boldsymbol{\omega}+\boldsymbol{\Omega}+\boldsymbol{A}+\boldsymbol{x}


You'll need to generate screenshots and include those files as well. Let me know if you have issues running make screenshots.

make screenshots does not work. I get the following:

/Users/aterenin/Git/KaTeX/node_modules/selenium-webdriver/lib/promise.js:654 throw error; ^ Error: Timed out waiting for the WebDriver server at http://127.0.0.1:49315/hub at onError (/Users/aterenin/Git/KaTeX/node_modules/selenium-webdriver/http/util.js :87:11) ...

@aterenin did docker start correctly?

Figured out the problem: I previously didn't install the correct docker.

Screenshots added and pushed.

@aterenin cool. I take it npm install docker installs a client. I should update the README.md for the Screenshot to point to link docker's download page or homepage so there's less confusion.

It might be good to include some other symbols in this such as \sum and \int.

jeanm · 2017-12-06T23:20:28Z

Great stuff! Would it be possible to add \bm as an alias, too?

k4b7 · 2017-12-07T00:12:26Z

@jeanm \bm and \boldsymbol are not the same. https://tex.stackexchange.com/questions/3238/bm-package-versus-boldsymbol

jeanm · 2017-12-07T01:55:25Z

Not in LaTeX, true, but do these differences still apply here? And even in LaTeX, the differences are so minimal that they don't matter in the majority of real-world use cases I see in papers in my field.

It would be annoying to have to rewrite a bunch of formulae that use \bm. An alias to \boldsymbol supported out-of-the-box, even just as a temporary fix, would avoid that.

k4b7 · 2017-12-07T02:04:31Z

@jeanm we'd like avoid implementing commands where the semantics don't match LaTeX's as much as possible. See https://github.com/khan/KaTeX#rendering-options for how to define your own macros.

edemaine · 2017-12-07T16:53:42Z

@aterenin Awesome feature addition! Thanks for working on this.

In #585, I concluded that we should aim to support \bm, as it seems to be the main option recommended these days. This visual comparison suggests \bm and \boldsymbol are extremely close, perhaps only differing in italic correction? Personally I'd be in favor of adding an alias within KaTeX making \bm and \boldsymbol the same, and when we have time, we can try to implement the subtle nuance between the two...

k4b7 · 2017-12-07T16:57:16Z

I guess I'm okay with the alias too as long as we communicate the short coming and at the very least have an issue in github to track the issue with which command is non-compliant.

aterenin · 2017-12-07T17:48:59Z

There's something to be said for simplicity, especially given people can define a macro for \bm if they want to use that command instead.

I can easily add an alias for \bm if the consensus is to add that in. Let me know if people want this.

k4b7 · 2017-12-08T04:21:41Z

I can easily add an alias for \bm if the consensus is to add that in. Let me know if people want this.

It's sounds like the general consensus to add the alias.

aterenin · 2017-12-08T19:59:51Z

Alias added.

k4b7 · 2017-12-08T23:54:40Z

test/__snapshots__/mathml-spec.js.snap

+        <mo>
+          +
+        </mo>
+      </mrow>


I think everything in this row should have mathvariant="bold-italic" set.

Are you sure? These include the imaginary number symbol, as well as the plus symbol, for which mathvariant="bold" is not set even for \mathbf.

Rendering the following on quicklatex.com:

\boldsymbol{Ax2k\omega\Omega\imath+} \\ Ax2k\omega\Omega\imath+

results in:

The symbols for \imath and + that are present in the font looks as follows.

This is from inspecting the element and manually adding \boldsymbol to the CSS. I don't know how to make KaTeX do that, and given the symbols don't match, should this be done at this stage?

Update: the problem is that bold italic symbols for \imath, +, and 2 are contained in a different font: KaTeX-main. See screenshot below.

Turns out the same situation occurs for \mathit - using that as a template, I was able to implement \imath and 2. + is still not correct, because for some reason the font doesn't get applied to it, will look at that shortly.

Done. Please see new screenshots that have been pushed.

k4b7 · 2017-12-08T23:58:09Z

Thanks for adding the snapshot test. Almost there, just need to add mathvariant="bold-italic" to a few of items in the MathML tree. Use npm run jest -- -u to update the snapshot.

aterenin · 2017-12-09T02:11:21Z

Test updated.

k4b7 · 2017-12-10T03:51:42Z

src/buildCommon.js

+    "\\imath",   // dotless i
+    "\\jmath",   // dotless j
+    "+",  // plus symbol
+    "-",  // minus symbol


I looked at the font file for KaTeX_MainBold and realized that there are more symbols in it that we should show in bold, e.g. =, <, >, etc. We could use lookupSymbol to determine whether we have a bold variant or not, that way we can include all of them without the extra table.

Agreed; this should ideally not be hard coded.

I've removed the hardcoded symbols - this was done for mathit so I copied the approach - and am now using lookupSymbol.

k4b7 · 2017-12-10T03:52:24Z

src/buildCommon.js

+): {| fontName: string, fontClass: string |} {
+    if (/[0-9]/.test(value.charAt(0)) ||
+            // glyphs for \imath and \jmath do not exist in Math-BoldItalic so
+            // we need to use Main-BoldItalic instead


nit: Main-BoldItalic -> Main-Bold

k4b7 · 2017-12-13T03:50:12Z

src/buildCommon.js

+    // "mathit" and "boldsymbol" are missing because they require the use of two
+    // fonts: Main-Italic and Math-Italic for "mathit", and Math-BoldItalic and
+    // Main-Bold for "boldsymbol".  This is handled by a special case in makeOrd
+    // which ends up calling mathit and boldsymbol.


nice comment

k4b7

LGTM. Thanks for all the revisions.

k4b7 · 2017-12-13T04:06:01Z

@aterenin thanks for fixing my lint. 😅

aterenin · 2017-12-13T04:08:10Z

No worries. I pushed a 1-character fix to make CI happy. Any idea when this'll make it into the release? With this added, I can now switch the live version of my blog from MathJax to KaTeX.

Only thing missing for me now is auto equation numbering, which I've no doubt will make it in eventually. And if I'm allowed to wish for things MathJax can't do autobreak would be awesome.

k4b7 · 2017-12-13T04:11:10Z

@aterenin thanks for this PR. \bm/\boldsymbol have been requested by lots of people and I'm pretty sure we use it at KA as well so I'm excited that this is finally in KaTeX.

stapeleliz · 2018-01-07T01:54:04Z

I'm using KaTeX from the CDN, which is using version 0.9.0-alpha2.

Am I correct that support for bolded italics has not yet been included in the CDN?

Thank you!

k4b7 · 2018-01-07T17:23:52Z

@stapeleliz that's right. I need to publish a new release.

matteoipri · 2018-01-22T00:35:09Z

Hi all,
using the latest version from CDN, I found that the boldsymbol (great and appreciated feature) renders capital Greek letters in italic, while LaTeX does not.

LaTeX code:

$a, b, c, x, y, \alpha, A, \beta, B, \gamma, \Gamma, \sigma, \Sigma, \sum$

$\boldsymbol{a}, \boldsymbol{b}, \boldsymbol{c}, \boldsymbol{x}, \boldsymbol{y}, \boldsymbol{\alpha}, \boldsymbol{A}, \boldsymbol{\beta}, \boldsymbol{B}, \boldsymbol{\gamma}, \boldsymbol{\Gamma}, \boldsymbol{\sigma}, \boldsymbol{\Sigma}, \boldsymbol{\sum}$.

PDF output:

KaTeX output (using Chromium on Arch Linux):

MathJax output (v 2.7.1 from CDN on Chromium on Arch Linux) for comparison:

Note that MathJax renders all capital Greek letters, both normal and bold, as italic, which is wrong, but consistent.

Would it be possible to make KaTeX behave like LaTeX for capital Greek letters? It seems that this is the last missing bit, since it works as expected for other letters and operators (like \sum).

Thank you very much for your attention and all the work put in KaTeX.

added support for \boldsymbol

0c70cb0

added \boldsymbol tests

10054f3

k4b7 requested changes Dec 6, 2017

View reviewed changes

aterenin added 2 commits December 7, 2017 17:50

added \boldsymbol screenshots

6103e5e

Merge branch 'master' into master

8ae294a

added \bm, snapshot, updated screenshots

16960fa

aterenin force-pushed the master branch from 2a23b09 to 16960fa Compare December 8, 2017 20:11

k4b7 reviewed Dec 8, 2017

View reviewed changes

updated snapshot for \boldsymbol

36ef8f2

aterenin added 2 commits December 9, 2017 14:33

properly display \imath and 2 in boldsymbol

165809d

implemented \boldsymbol for +

4fe075e

aterenin force-pushed the master branch from 1cf74f0 to 4fe075e Compare December 10, 2017 00:11

k4b7 reviewed Dec 10, 2017

View reviewed changes

Ryan Randall and others added 3 commits December 12, 2017 17:10

Merge branch 'master' into master

6e2aec5

fix typo, remove boldsymbolLetters hardcode

136b689

Merge branch 'master' of https://github.com/aterenin/KaTeX

f741c2f

aterenin force-pushed the master branch from 801f94f to f741c2f Compare December 13, 2017 02:26

k4b7 reviewed Dec 13, 2017

View reviewed changes

make comment about using Main-Bold more general

fdd231e

k4b7 approved these changes Dec 13, 2017

View reviewed changes

fixed trailing space CI error

a7b1d13

k4b7 merged commit cf23517 into KaTeX:master Dec 13, 2017

sapitts mentioned this pull request Jan 11, 2018

Katexify tensor mech eqns idaholab/moose#10503

Merged

Paalon mentioned this pull request Feb 2, 2018

Suggestion: Use MathJax instead of KaTeX BoostIO/BoostNote-Legacy#1473

Closed

Uh oh!

Comments

Conversation

aterenin commented Dec 6, 2017

Uh oh!

khanbot commented Dec 6, 2017

Uh oh!

aterenin commented Dec 6, 2017

Uh oh!

khanbot commented Dec 6, 2017

Uh oh!

k4b7 commented Dec 6, 2017

Uh oh!

aterenin commented Dec 6, 2017

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jeanm commented Dec 6, 2017

Uh oh!

k4b7 commented Dec 7, 2017

Uh oh!

jeanm commented Dec 7, 2017

Uh oh!

k4b7 commented Dec 7, 2017

Uh oh!

edemaine commented Dec 7, 2017

Uh oh!

k4b7 commented Dec 7, 2017

Uh oh!

aterenin commented Dec 7, 2017

Uh oh!

k4b7 commented Dec 8, 2017

Uh oh!

aterenin commented Dec 8, 2017

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

aterenin Dec 9, 2017 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

k4b7 commented Dec 8, 2017

Uh oh!

aterenin commented Dec 9, 2017

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

aterenin Dec 9, 2017 •

edited

Loading

stapeleliz commented Jan 7, 2018 •

edited

Loading