@pie-lib/math-rendering 3.2.2-next.4 → 3.3.1-beta.0

package/CHANGELOG.md

@@ -3,104 +3,84 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-## [3.2.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@3.2.0...@pie-lib/math-rendering@3.2.1) (2023-10-01)
+## [3.3.1-beta.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@3.2.1...@pie-lib/math-rendering@3.3.1-beta.0) (2025-07-20)
 
+**Note:** Version bump only for package @pie-lib/math-rendering
 
-### Bug Fixes
 
-* revert mathml-to-latex version as it seems to break math rendering ([46e841c](https://github.com/pie-framework/pie-lib/commit/46e841c00c2a04ff0e3442625870b3b457571a8e))
 
 
 
+# [3.3.0-beta.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@3.2.1...@pie-lib/math-rendering@3.3.0-beta.0) (2025-07-20)
 
+**Note:** Version bump only for package @pie-lib/math-rendering
 
-# [3.2.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@3.1.2...@pie-lib/math-rendering@3.2.0) (2023-09-27)
 
 
-### Features
-
-* update version ([f716545](https://github.com/pie-framework/pie-lib/commit/f716545d526dc856e2160619650787273a993f27))
 
 
+# [3.4.0-beta.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@3.2.1...@pie-lib/math-rendering@3.4.0-beta.0) (2025-07-15)
 
+**Note:** Version bump only for package @pie-lib/math-rendering
 
+# [3.3.0-beta.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@3.2.1...@pie-lib/math-rendering@3.3.0-beta.0) (2025-07-15)
 
-## [3.1.2](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@3.1.1...@pie-lib/math-rendering@3.1.2) (2023-09-27)
+**Note:** Version bump only for package @pie-lib/math-rendering
 
+## [3.2.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@3.2.0...@pie-lib/math-rendering@3.2.1) (2023-10-01)
 
 ### Bug Fixes
 
-* force publish ([489a242](https://github.com/pie-framework/pie-lib/commit/489a2421c109fb202b778680f1b57b942e49c86a))
-
-
+- revert mathml-to-latex version as it seems to break math rendering ([46e841c](https://github.com/pie-framework/pie-lib/commit/46e841c00c2a04ff0e3442625870b3b457571a8e))
 
+# [3.2.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@3.1.2...@pie-lib/math-rendering@3.2.0) (2023-09-27)
 
+### Features
 
-## [3.1.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@3.1.0...@pie-lib/math-rendering@3.1.1) (2023-09-25)
+- update version ([f716545](https://github.com/pie-framework/pie-lib/commit/f716545d526dc856e2160619650787273a993f27))
 
+## [3.1.2](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@3.1.1...@pie-lib/math-rendering@3.1.2) (2023-09-27)
 
 ### Bug Fixes
 
-* update mathml-to-latex version PD-3182, PD-3184 ([c019296](https://github.com/pie-framework/pie-lib/commit/c0192965a3a045e13993a3301dfc35e7e314a592))
-
+- force publish ([489a242](https://github.com/pie-framework/pie-lib/commit/489a2421c109fb202b778680f1b57b942e49c86a))
 
+## [3.1.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@3.1.0...@pie-lib/math-rendering@3.1.1) (2023-09-25)
 
+### Bug Fixes
 
+- update mathml-to-latex version PD-3182, PD-3184 ([c019296](https://github.com/pie-framework/pie-lib/commit/c0192965a3a045e13993a3301dfc35e7e314a592))
 
 # [3.1.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@3.0.0...@pie-lib/math-rendering@3.1.0) (2023-09-20)
 
-
 ### Features
 
-* use forked mathml-to-latex library, as it contains fixes PD-3011 ([8949ac2](https://github.com/pie-framework/pie-lib/commit/8949ac2ddf6664bf437a35dbe21555f18ac77426))
-
-
-
-
+- use forked mathml-to-latex library, as it contains fixes PD-3011 ([8949ac2](https://github.com/pie-framework/pie-lib/commit/8949ac2ddf6664bf437a35dbe21555f18ac77426))
 
 # [3.0.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@2.5.18...@pie-lib/math-rendering@3.0.0) (2023-09-20)
 
-
 ### Bug Fixes
 
-* update mathml-to-latex version ([1d101d2](https://github.com/pie-framework/pie-lib/commit/1d101d22298bd480a5aec638e4c9708d5aa52ce4))
-
+- update mathml-to-latex version ([1d101d2](https://github.com/pie-framework/pie-lib/commit/1d101d22298bd480a5aec638e4c9708d5aa52ce4))
 
 ### BREAKING CHANGES
 
-* updated mathml-to-latex version.
-
-
-
-
+- updated mathml-to-latex version.
 
 ## [2.5.18](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@2.5.17...@pie-lib/math-rendering@2.5.18) (2023-09-14)
 
-
 ### Bug Fixes
 
-* force v1.2.0 of mathml-to-latex, as v1.3.0 contains a braking change ([4792ed9](https://github.com/pie-framework/pie-lib/commit/4792ed965608ee5ff4c872e69dee9b3b59261cf0))
-
-
-
-
+- force v1.2.0 of mathml-to-latex, as v1.3.0 contains a braking change ([4792ed9](https://github.com/pie-framework/pie-lib/commit/4792ed965608ee5ff4c872e69dee9b3b59261cf0))
 
 ## [2.5.17](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@2.5.16...@pie-lib/math-rendering@2.5.17) (2023-06-24)
 
 **Note:** Version bump only for package @pie-lib/math-rendering
 
-
-
-
-
 ## [2.5.16](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@2.5.15...@pie-lib/math-rendering@2.5.16) (2023-06-13)
 
 **Note:** Version bump only for package @pie-lib/math-rendering
 
-
-
-
-
 ## [2.5.15](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-rendering@2.5.14...@pie-lib/math-rendering@2.5.15) (2023-06-12)
 
 ### Bug Fixes

package/NEXT.CHANGELOG.json

@@ -0,0 +1 @@
+[]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pie-lib/math-rendering",
-  "version": "3.2.2-next.4+23991a09",
+  "version": "3.3.1-beta.0",
   "description": "math rendering utilities",
   "publishConfig": {
     "access": "public"
@@ -10,11 +10,13 @@
   "author": "pie-framework developers",
   "license": "ISC",
   "dependencies": {
+    "@pie-framework/mathml-to-latex": "1.4.4",
     "debug": "^4.1.1",
     "lodash": "^4.17.11",
     "mathjax-full": "3.2.2",
-    "mathml-to-latex": "1.2.0"
+    "react": "^16.8.1",
+    "slate": "^0.36.2"
   },
-  "gitHead": "23991a09b77492c24dcb5235049667cdcc211d80",
+  "gitHead": "e2aa3ddac60f49bcb8c2562370f496323642f453",
   "scripts": {}
 }

package/src/__tests__/mml-to-latex.test.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import mmlToLatex from '../mml-to-latex';
+
+describe('mmlToLatex', () => {
+  it('should work', () => {
+    const mml =
+      '<math xmlns="http://www.w3.org/1998/Math/MathML">  <mn>2</mn>  <mi>x</mi>  <mtext>&#xA0;</mtext>  <mo>&#x2264;</mo>  <mn>4</mn>  <mi>y</mi>  <mtext>&#xA0;</mtext>  <mo>+</mo>  <mtext>&#xA0;</mtext>  <mn>8</mn> <msqrt>    <mi>h</mi>  </msqrt></math>';
+    // todo revisit this
+    // const latex = '2x\\text{ }\\leq4y\\text{ }+\\text{ }8\\sqrt{h}';
+    const latex = '2 x \\textrm{ } \\leq 4 y \\textrm{ } + \\textrm{ } 8 \\sqrt{h}';
+
+    expect(mmlToLatex(mml)).toEqual(latex);
+  });
+});

package/src/__tests__/normalization.test.js

@@ -0,0 +1,51 @@
+import React from 'react';
+import debug from 'debug';
+import { Data } from 'slate';
+import { BracketTypes, wrapMath, unWrapMath } from '../normalization';
+
+const log = debug('@pie-lib:math-rendering:test:normalization');
+
+describe('normalization', () => {
+  describe('unWrapMath', () => {
+    const assertUnWrap = (html, expected, wrapType) => {
+      it(`innerHTML: ${html} is unWrapped to: ${expected} with wrapType: ${wrapType}`, () => {
+        const out = unWrapMath(html);
+
+        expect(out).toEqual({
+          unwrapped: expected,
+          wrapType: wrapType,
+        });
+      });
+    };
+
+    assertUnWrap('$$<$$', '<', BracketTypes.DOLLAR);
+    assertUnWrap('$<$', '<', BracketTypes.DOLLAR);
+    assertUnWrap('\\(<\\)', '<', BracketTypes.ROUND_BRACKETS);
+    assertUnWrap('\\[<\\]', '<', BracketTypes.ROUND_BRACKETS);
+    assertUnWrap('latex', 'latex', BracketTypes.ROUND_BRACKETS);
+    assertUnWrap('\\displaystyle foo', 'foo', BracketTypes.ROUND_BRACKETS);
+  });
+
+  describe('wrapMath', () => {
+    const assertWrap = (latex, expectedHtml, wrapper) => {
+      wrapper = wrapper || BracketTypes.ROUND_BRACKETS;
+      it(`${latex} is wrapped to: ${expectedHtml}`, () => {
+        const out = wrapMath(latex, wrapper);
+
+        log('out: ', out);
+
+        expect(out).toEqual(expectedHtml);
+      });
+    };
+
+    assertWrap('latex', '\\(latex\\)', BracketTypes.ROUND_BRACKETS);
+    assertWrap('latex', '\\(latex\\)', BracketTypes.SQUARE_BRACKETS);
+    assertWrap('latex', '$latex$', BracketTypes.DOLLAR);
+    assertWrap('latex', '$latex$', BracketTypes.DOUBLE_DOLLAR);
+
+    /**
+     * Note that when this is converted to html it get's escaped - but that's an issue with the slate html-serializer.
+     */
+    assertWrap('<', '\\(<\\)');
+  });
+});

package/src/__tests__/render-math.test.js

@@ -0,0 +1,155 @@
+import React from 'react';
+import { mount } from 'enzyme';
+import renderMath, { fixMathElement } from '../render-math';
+import _ from 'lodash';
+
+jest.mock(
+  'mathjax-full/js/mathjax',
+  () => ({
+    mathjax: {
+      document: jest.fn().mockReturnThis(),
+      findMath: jest.fn().mockReturnThis(),
+      compile: jest.fn().mockReturnThis(),
+      getMetrics: jest.fn().mockReturnThis(),
+      typeset: jest.fn().mockReturnThis(),
+      updateDocument: jest.fn().mockReturnThis(),
+      clear: jest.fn().mockReturnThis(),
+      handlers: {
+        handlesDocument: jest.fn().mockReturnThis(),
+      },
+      handleRetriesFor: jest.fn().mockImplementation((callback) => callback()),
+    },
+  }),
+  {
+    virtual: false,
+  },
+);
+
+jest.mock('mathjax-full/js/input/mathml', () => {
+  const mock = jest.fn().mockReturnThis();
+  mock.setMmlFactory = jest.fn();
+  return {
+    MathML: () => mock,
+  };
+});
+
+jest.mock('mathjax-full/js/input/tex', () => ({
+  TeX: jest.fn(),
+}));
+jest.mock('mathjax-full/js/core/MmlTree/MmlFactory', () => {
+  const instance = {
+    setMmlFactory: jest.fn(),
+    defaultNodes: {},
+  };
+  return {
+    MmlFactory: () => instance,
+  };
+});
+
+const mockMathInstance = {
+  document: jest.fn().mockReturnThis(),
+  findMath: jest.fn().mockReturnThis(),
+  compile: jest.fn().mockReturnThis(),
+  enrich: jest.fn().mockReturnThis(),
+  addMenu: jest.fn().mockReturnThis(),
+  attachSpeech: jest.fn().mockReturnThis(),
+  assistiveMml: jest.fn().mockReturnThis(),
+  getMetrics: jest.fn().mockReturnThis(),
+  typeset: jest.fn().mockReturnThis(),
+  updateDocument: jest.fn().mockReturnValue({
+    math: {
+      list: undefined,
+    },
+    clear: jest.fn().mockReturnThis(),
+  }),
+  clear: jest.fn().mockReturnThis(),
+  handlers: {
+    handlesDocument: jest.fn().mockReturnThis(),
+  },
+  handleRetriesFor: jest.fn().mockImplementation((callback) => callback()),
+};
+
+const mockHtml = {
+  findMath: jest.fn().mockReturnValue(mockMathInstance),
+};
+
+const mockEnrichHandlerInstance = {
+  create: jest.fn().mockImplementation(() => mockHtml),
+};
+
+jest.mock('mathjax-full/js/a11y/semantic-enrich', () => {
+  return {
+    EnrichHandler: () => mockEnrichHandlerInstance,
+  };
+});
+
+jest.mock('mathjax-full/js/a11y/assistive-mml', () => {
+  return {
+    AssistiveMmlHandler: () => {},
+  };
+});
+
+jest.mock('mathjax-full/js/ui/menu/MenuHandler', () => {
+  return {
+    MenuHandler: () => {},
+  };
+});
+
+jest.mock('mathjax-full/js/output/chtml', () => ({
+  CHTML: jest.fn(),
+}));
+
+jest.mock('mathjax-full/js/adaptors/browserAdaptor', () => ({
+  browserAdaptor: jest.fn(),
+}));
+
+jest.mock('mathjax-full/js/handlers/html', () => ({
+  RegisterHTMLHandler: jest.fn(),
+}));
+
+jest.mock('mathjax-full/js/core/MmlTree/SerializedMmlVisitor', () => ({
+  SerializedMmlVisitor: jest.fn(),
+}));
+
+describe('render-math', () => {
+  it('calls classFactory.create once', () => {
+    const div = document.createElement('div');
+
+    _.times(10).forEach((i) => renderMath(div));
+
+    expect(mockEnrichHandlerInstance.create).toHaveBeenCalledTimes(1);
+  });
+
+  it('calls MathJax render', () => {
+    const div = document.createElement('div');
+
+    renderMath(div);
+    expect(mockEnrichHandlerInstance.create).toHaveBeenCalledTimes(1);
+    expect(mockHtml.findMath).toHaveBeenCalledWith({ elements: [div] });
+  });
+
+  it('call render math for an array of elements', () => {
+    const divOne = document.createElement('div');
+    const divTwo = document.createElement('div');
+
+    renderMath([divOne, divTwo]);
+
+    expect(mockEnrichHandlerInstance.create).toHaveBeenCalledTimes(1);
+    expect(mockHtml.findMath).toHaveBeenCalledWith({
+      elements: [divOne, divTwo],
+    });
+  });
+
+  it('wraps the math containing element the right way', () => {
+    const wrapper = mount(
+      <div>
+        <span data-latex="">{'420\\text{ cm}=4.2\\text{ meters}'}</span>
+      </div>,
+    );
+    const spanElem = wrapper.instance();
+
+    fixMathElement(spanElem);
+
+    expect(spanElem.textContent).toEqual('\\(420\\text{ cm}=4.2\\text{ meters}\\)');
+  });
+});

package/src/mml-to-latex.js

@@ -1,2 +1,2 @@
-import Mathml2latex from 'mathml-to-latex';
-export default (mathml) => Mathml2latex.convert(mathml);
+import { MathMLToLaTeX } from '@pie-framework/mathml-to-latex';
+export default (mathml) => MathMLToLaTeX.convert(mathml);

package/src/mstack/__tests__/__snapshots__/chtml.test.js.snap

@@ -0,0 +1,9 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`chtml implicit one row 1`] = `"<table><tr><td></td><td>1</td></tr></table>"`;
+
+exports[`chtml one row 1`] = `"<table><tr><td></td><td>1</td></tr></table>"`;
+
+exports[`chtml two rows 1`] = `"<table><tr><td></td><td>1</td></tr><tr><td></td><td>2</td></tr></table>"`;
+
+exports[`chtml two rows with operator 1`] = `"<table><tr><td></td><td>1</td></tr><tr><td class=\\"inner\\">mo:+</td><td>2</td></tr></table>"`;

package/src/mstack/__tests__/chtml.test.js

@@ -0,0 +1,104 @@
+import { getStackData, Line, Row, CHTMLmstack } from '../chtml';
+// import { CHTMLWrapper, instance } from 'mathjax-full/js/output/chtml/Wrapper';
+import { JSDOM } from 'jsdom';
+
+jest.mock('mathjax-full/js/output/chtml/Wrapper', () => {
+  const instance = {
+    adaptor: {
+      document: {
+        createElement: jest.fn(),
+      },
+    },
+    standardCHTMLnode: jest.fn(),
+  };
+
+  return {
+    instance,
+    CHTMLWrapper: class {
+      constructor() {
+        this.adaptor = { document: { createElement: jest.fn() } };
+        this.document = {};
+        // return instance;
+      }
+    },
+  };
+});
+
+const node = (kind, extras) => ({ kind, childNodes: [], ...extras });
+
+const textNode = (text) => node('text', { text, node: { kind: 'text', text } });
+const mn = (text) => node('mn', { childNodes: [textNode(text)] });
+const mo = (text) =>
+  node('mo', {
+    childNodes: [textNode(text)],
+  });
+
+const mco = (text) => ({
+  ...mo(text),
+
+  toCHTML: (n) => {
+    const t = `mo:${text}`;
+    n.textContent = t;
+  },
+});
+
+const msrow = (...childNodes) => node('msrow', { childNodes });
+const mstack = (...rows) => node('mstack', { childNodes: rows });
+const msline = () => node('msline');
+describe('getStackData', () => {
+  it.each`
+    input                                                 | expected
+    ${mstack(msrow(mo('+'), mn('111')))}                  | ${[new Row(['1', '1', '1'], mo('+'))]}
+    ${mstack(msrow(mn('111')))}                           | ${[new Row(['1', '1', '1'])]}
+    ${mstack(msrow(mn('1'), mn('1')))}                    | ${[new Row(['1', '1'])]}
+    ${mstack(msrow(mn('1')), mn('1'))}                    | ${[new Row(['1']), new Row(['1'])]}
+    ${mstack(msline())}                                   | ${[new Line()]}
+    ${mstack(mn('1'), msline(), msrow(mo('+'), mn('1')))} | ${[new Row(['1']), new Line(), new Row(['1'], mo('+'))]}
+    ${mstack(mn('1'), mn('1'))}                           | ${[new Row(['1']), new Row(['1'])]}
+  `('$input => $expected', ({ input, expected }) => {
+    const d = getStackData(input);
+    // console.log('d:', d);
+    // console.log('e:', expected);
+    expect({ ...d }).toEqual({ ...expected });
+  });
+});
+
+describe('Row', () => {
+  describe('pad', () => {
+    it.each`
+      cols   | count | expected
+      ${[]}  | ${0}  | ${[]}
+      ${[1]} | ${1}  | ${[1]}
+      ${[1]} | ${2}  | ${['__pad__', 1]}
+      ${[1]} | ${3}  | ${['__pad__', '__pad__', 1]}
+    `('pads to the right', ({ cols, count, expected }) => {
+      const r = new Row(cols);
+      const p = r.pad(count, 'right');
+      expect(p).toEqual(expected);
+    });
+  });
+});
+
+describe.each`
+  label                       | tree
+  ${'one row'}                | ${[msrow(mn('1'))]}
+  ${'implicit one row'}       | ${[mn('1')]}
+  ${'two rows'}               | ${[msrow(mn('1')), msrow(mn('2'))]}
+  ${'two rows with operator'} | ${[msrow(mn('1')), msrow(mco('+'), mn('2'))]}
+`('chtml', ({ label, tree }) => {
+  let html;
+
+  beforeEach(() => {
+    const chtml = new CHTMLmstack({}, {});
+    const dom = new JSDOM(`<!DOCTYPE html><body></body>`);
+    chtml.standardCHTMLnode = (parent) => parent;
+    chtml.ce = dom.window.document.createElement.bind(dom.window.document);
+    chtml.childNodes = tree;
+    chtml.toCHTML(dom.window.document.body);
+    html = dom.window.document.body.innerHTML;
+  });
+
+  it(label, () => {
+    expect(html).toMatchSnapshot();
+  });
+});