patrick/KaTeX
1
0
Fork 0
mirror of https://github.com/Smaug123/KaTeX synced 2025-10-05 03:08:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

Use JS for spacing between atoms instead of CSS (#1070)

Browse Source 
* 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
This commit is contained in:
Kevin Barabash
2018-01-24 23:03:36 -05:00
committed by GitHub
parent d82424c618
commit 63f541b6e6
24 changed files with 252 additions and 232 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
test/katex-spec.js
View File

@@ -1841,7 +1841,8 @@ describe("A bin builder", function() {
it("should create mbins normally", function() {
const built = getBuilt("x + y");
expect(built[1].classes).toContain("mbin");
// we add glue elements around the '+'
expect(built[2].classes).toContain("mbin");
});
it("should create ords when at the beginning of lists", function() {
@@ -1852,17 +1853,17 @@ describe("A bin builder", function() {
});
it("should create ords after some other objects", function() {
expect(getBuilt("x + + 2")[2].classes).toContain("mord");
expect(getBuilt("( + 2")[1].classes).toContain("mord");
expect(getBuilt("= + 2")[1].classes).toContain("mord");
expect(getBuilt("\\sin + 2")[1].classes).toContain("mord");
expect(getBuilt(", + 2")[1].classes).toContain("mord");
expect(getBuilt("x + + 2")[4].classes).toContain("mord");
expect(getBuilt("( + 2")[2].classes).toContain("mord");
expect(getBuilt("= + 2")[2].classes).toContain("mord");
expect(getBuilt("\\sin + 2")[2].classes).toContain("mord");
expect(getBuilt(", + 2")[2].classes).toContain("mord");
});
it("should correctly interact with color objects", function() {
expect(getBuilt("\\blue{x}+y")[1].classes).toContain("mbin");
expect(getBuilt("\\blue{x+}+y")[1].classes).toContain("mbin");
expect(getBuilt("\\blue{x+}+y")[2].classes).toContain("mord");
expect(getBuilt("\\blue{x}+y")[2].classes).toContain("mbin");
expect(getBuilt("\\blue{x+}+y")[2].classes).toContain("mbin");
expect(getBuilt("\\blue{x+}+y")[4].classes).toContain("mord");
});
});
@@ -2291,15 +2292,15 @@ describe("A phantom builder", function() {
it("should make the children transparent", function() {
const children = getBuilt("\\phantom{x+1}");
expect(children[0].style.color).toBe("transparent");
expect(children[1].style.color).toBe("transparent");
expect(children[2].style.color).toBe("transparent");
expect(children[4].style.color).toBe("transparent");
});
it("should make all descendants transparent", function() {
const children = getBuilt("\\phantom{x+\\blue{1}}");
expect(children[0].style.color).toBe("transparent");
expect(children[1].style.color).toBe("transparent");
expect(children[2].style.color).toBe("transparent");
expect(children[4].style.color).toBe("transparent");
});
});