Skip to content

Commit ed187a3

Browse files
Evan-CTLEvan-CTL
authored
Merge pull request #3121 from ccnmtl/mathjax-changes
Migrate to better-react-mathjax
2 parents a70a9b8 + cf3b577 commit ed187a3

16 files changed

+238
-148
lines changed

‎jest.config.cjs‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@ const config = {
88
},
99
transformIgnorePatterns: [],
1010
testPathIgnorePatterns: [
11-
// Temporary workaround for mathjax3-react issue:
12-
// https://github.com/asnunes/mathjax3-react/issues/30
11+
// Temporary workaround for better-react-mathjax issue:
12+
// https://github.com/fast-reflexes/better-react-mathjax/issues/62
1313
"media/js/src/form-components/RangeEditor.test.js",
1414
"media/js/src/JXGBoard.test.js",
1515
"media/js/src/GraphEditor.test.js",

‎media/js/src/Editor.test.js‎

Lines changed: 35 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -3,38 +3,51 @@
33
import React from 'react';
44
import TestRenderer from 'react-test-renderer';
55
import ReactTestUtils from 'react-dom/test-utils';
6+
import { MathJaxContext } from 'better-react-mathjax';
67
import Editor from './Editor.jsx';
78
import { exportGraph } from './GraphMapping.js';
89

910
it('renders without crashing', () => {
10-
TestRenderer.create(<Editor />);
11+
TestRenderer.create(
12+
<MathJaxContext>
13+
<Editor />
14+
</MathJaxContext>
15+
);
1116
});
1217

1318
it('renders with children in the expected visibility state', () => {
14-
TestRenderer.create(<Editor />, function() {
15-
expect(this.gp.current.props.showing).toBe(true);
16-
expect(this.ge.current.props.showing).toBe(false);
19+
TestRenderer.create(
20+
<MathJaxContext>
21+
<Editor />
22+
</MathJaxContext>,
23+
function() {
24+
expect(this.gp.current.props.showing).toBe(true);
25+
expect(this.ge.current.props.showing).toBe(false);
1726

18-
expect(ReactTestUtils.isCompositeComponent(this.gp.current)).toBe(true);
19-
expect(ReactTestUtils.isCompositeComponent(this.ge.current)).toBe(true);
27+
expect(ReactTestUtils.isCompositeComponent(this.gp.current)).toBe(true);
28+
expect(ReactTestUtils.isCompositeComponent(this.ge.current)).toBe(true);
2029

21-
expect(this.state.step).toBe(0);
22-
expect(this.state.gType).toBe(null);
23-
ReactTestUtils.Simulate.click(this.gp.current.b1);
24-
// expect(this.state.step).toBe(1);
25-
});
30+
expect(this.state.step).toBe(0);
31+
expect(this.state.gType).toBe(null);
32+
ReactTestUtils.Simulate.click(this.gp.current.b1);
33+
// expect(this.state.step).toBe(1);
34+
});
2635
});
2736

2837
it('exports its graph state', () => {
29-
TestRenderer.create(<Editor />, function() {
30-
let o = exportGraph(this.state);
31-
expect(o.graph_type).toBe(null);
32-
expect(o.show_intersection).toBe(true);
33-
expect(o.line_1_slope).toBe(1);
34-
expect(o.line_2_slope).toBe(-1);
35-
expect(o.line_1_label).toBe('');
36-
expect(o.line_2_label).toBe('');
37-
expect(o.y_axis_label).toBe('');
38-
expect(o.x_axis_label).toBe('');
39-
});
38+
TestRenderer.create(
39+
<MathJaxContext>
40+
<Editor />
41+
</MathJaxContext>,
42+
function() {
43+
let o = exportGraph(this.state);
44+
expect(o.graph_type).toBe(null);
45+
expect(o.show_intersection).toBe(true);
46+
expect(o.line_1_slope).toBe(1);
47+
expect(o.line_2_slope).toBe(-1);
48+
expect(o.line_1_label).toBe('');
49+
expect(o.line_2_label).toBe('');
50+
expect(o.y_axis_label).toBe('');
51+
expect(o.x_axis_label).toBe('');
52+
});
4053
});

‎media/js/src/JXGBoard.jsx‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
import React from 'react';
44
import PropTypes from 'prop-types';
5-
import { MathJaxProvider, MathJaxFormula } from 'mathjax3-react';
5+
import { MathJax } from 'better-react-mathjax';
66
import JXG from 'jsxgraph';
77
import {graphTypes} from './graphs/graphTypes.js';
88
import {mkNonLinearDemandSupply} from './graphs/NonLinearDemandSupplyGraph.js';
@@ -589,14 +589,14 @@ export default class JXGBoard extends React.Component {
589589
const func1 = String.raw`MP_${this.props.gNName} = (1 - \alpha)${this.props.gCobbDouglasAName}${this.props.gCobbDouglasKName}^\alpha ${this.props.gNName}^{-\alpha}`;
590590
const func2 = String.raw`MP_${this.props.gCobbDouglasKName} = \alpha ${this.props.gCobbDouglasAName}${this.props.gCobbDouglasKName}^{\alpha - 1} ${this.props.gNName}^{1 - \alpha}`;
591591
math1 = (
592-
<MathJaxProvider>
593-
<MathJaxFormula formula={'$$' + func1 + '$$'} />
594-
</MathJaxProvider>
592+
<MathJax>
593+
{'$$' + func1 + '$$'}
594+
</MathJax>
595595
);
596596
math2 = (
597-
<MathJaxProvider>
598-
<MathJaxFormula formula={'$$' + func2 + '$$'} />
599-
</MathJaxProvider>
597+
<MathJax>
598+
{'$$' + func2 + '$$'}
599+
</MathJax>
600600
);
601601
}
602602
figure2 = false;

‎media/js/src/JXGBoard.test.js‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,16 @@
22

33
import React from 'react';
44
import TestRenderer from 'react-test-renderer';
5+
import { MathJaxContext } from 'better-react-mathjax';
56
import JXGBoard from './JXGBoard.jsx';
67

78
it('renders without crashing', () => {
89
TestRenderer.create(
9-
<JXGBoard
10-
id={'id-test'}
11-
gType={0}
12-
gShowIntersection={true} />);
10+
<MathJaxContext>
11+
<JXGBoard
12+
id={'id-test'}
13+
gType={0}
14+
gShowIntersection={true} />
15+
</MathJaxContext>
16+
);
1317
});

‎media/js/src/editor-main.js‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,12 @@
11
import React from 'react';
22
import { createRoot } from 'react-dom/client';
3+
import { MathJaxContext } from 'better-react-mathjax';
34
import Editor from './Editor.jsx';
45

56
const container = document.getElementById('root');
67
const root = createRoot(container);
7-
root.render(<Editor />);
8+
root.render(
9+
<MathJaxContext>
10+
<Editor />
11+
</MathJaxContext>
12+
);

‎media/js/src/editors/CobbDouglasEditor.jsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
3-
import { MathJaxProvider, MathJaxFormula } from 'mathjax3-react';
3+
import { MathJax } from 'better-react-mathjax';
44
import RangeEditor from '../form-components/RangeEditor.js';
55
import EditableControl from '../form-components/EditableControl.jsx';
66
import { handleFormUpdate } from '../utils.js';
@@ -37,9 +37,9 @@ export default class CobbDouglasEditor extends React.Component {
3737
</div>
3838
)}
3939
<div className="col">
40-
<MathJaxProvider>
41-
<MathJaxFormula formula={'$$' + tex + '$$'} />
42-
</MathJaxProvider>
40+
<MathJax>
41+
{'$$' + tex + '$$'}
42+
</MathJax>
4343
</div>
4444
</div>
4545
<hr />

‎media/js/src/editors/CobbDouglasNLDSEditor.jsx‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
3-
import { MathJaxProvider, MathJaxFormula } from 'mathjax3-react';
3+
import { MathJax } from 'better-react-mathjax';
44
import RangeEditor from '../form-components/RangeEditor.js';
55
import EditableControl from '../form-components/EditableControl.jsx';
66
import { handleFormUpdate } from '../utils.js';
@@ -39,9 +39,9 @@ export default class CobbDouglasNLDSEditor extends React.Component {
3939
</div>
4040
)}
4141
<div className="col">
42-
<MathJaxProvider>
43-
<MathJaxFormula formula={'$$' + tex + '$$'} />
44-
</MathJaxProvider>
42+
<MathJax>
43+
{'$$' + tex + '$$'}
44+
</MathJax>
4545
</div>
4646
</div>
4747

@@ -63,9 +63,9 @@ export default class CobbDouglasNLDSEditor extends React.Component {
6363
value={0}
6464
checked={this.props.gFunctionChoice === 0} />
6565
<label className="form-check-label" htmlFor="gFunctionChoice1">
66-
<MathJaxProvider>
67-
<MathJaxFormula formula={'$$' + func1 + '$$'} />
68-
</MathJaxProvider>
66+
<MathJax>
67+
{'$$' + func1 + '$$'}
68+
</MathJax>
6969
</label>
7070
</div>
7171
</div>
@@ -81,9 +81,9 @@ export default class CobbDouglasNLDSEditor extends React.Component {
8181
value={1}
8282
checked={this.props.gFunctionChoice === 1} />
8383
<label className="form-check-label" htmlFor="gFunctionChoice2">
84-
<MathJaxProvider>
85-
<MathJaxFormula formula={'$$' + func2 + '$$'} />
86-
</MathJaxProvider>
84+
<MathJax>
85+
{'$$' + func2 + '$$'}
86+
</MathJax>
8787
</label>
8888
</div>
8989
</div>

‎media/js/src/editors/ConsumptionLeisureEditor.jsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
3-
import { MathJaxProvider, MathJaxFormula } from 'mathjax3-react';
3+
import { MathJax } from 'better-react-mathjax';
44
import RangeEditor from '../form-components/RangeEditor.js';
55
import EditableControl from '../form-components/EditableControl.jsx';
66
import { handleFormUpdate } from '../utils.js';
@@ -21,9 +21,9 @@ export default class ConsumptionLeisureEditor extends React.Component {
2121
<h2>Function</h2>
2222
<div className="row">
2323
<div className="col-auto">
24-
<MathJaxProvider>
25-
<MathJaxFormula formula={'$$' + tex + '$$'} />
26-
</MathJaxProvider>
24+
<MathJax>
25+
{'$$' + tex + '$$'}
26+
</MathJax>
2727
</div>
2828
</div>
2929
<hr />

‎media/js/src/editors/ConsumptionSavingEditor.jsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
3-
import { MathJaxProvider, MathJaxFormula } from 'mathjax3-react';
3+
import { MathJax } from 'better-react-mathjax';
44
import RangeEditor from '../form-components/RangeEditor.js';
55
import EditableControl from '../form-components/EditableControl.jsx';
66
import { handleFormUpdate } from '../utils.js';
@@ -15,9 +15,9 @@ export default class ConsumptionSavingEditor extends React.Component {
1515
<React.Fragment>
1616
<h2>Function</h2>
1717
<div className="row ml-2 mb-2">
18-
<MathJaxProvider>
19-
<MathJaxFormula formula={'$$' + tex + '$$'} />
20-
</MathJaxProvider>
18+
<MathJax>
19+
{'$$' + tex + '$$'}
20+
</MathJax>
2121
</div>
2222
</React.Fragment>
2323
}

‎media/js/src/editors/NonLinearDemandSupplyEditor.jsx‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from 'react';
22
import PropTypes from 'prop-types';
3-
import { MathJaxProvider, MathJaxFormula } from 'mathjax3-react';
3+
import { MathJax } from 'better-react-mathjax';
44
import RangeEditor from '../form-components/RangeEditor.js';
55
import EditableControl from '../form-components/EditableControl.jsx';
66
import AreaConfiguration from './AreaConfiguration.jsx';
@@ -26,9 +26,9 @@ export default class NonLinearDemandSupplyEditor extends React.Component {
2626
checked={this.props.gFunctionChoice === 0} />
2727

2828
<label className="form-check-label" htmlFor="gFunctionChoice1">
29-
<MathJaxProvider>
30-
<MathJaxFormula formula={'$$' + func1 + '$$'} />
31-
</MathJaxProvider>
29+
<MathJax>
30+
{'$$' + func1 + '$$'}
31+
</MathJax>
3232
</label>
3333
</div>
3434
<div className="form-check">
@@ -40,9 +40,9 @@ export default class NonLinearDemandSupplyEditor extends React.Component {
4040
value={1}
4141
checked={this.props.gFunctionChoice === 1} />
4242
<label className="form-check-label" htmlFor="gFunctionChoice2">
43-
<MathJaxProvider>
44-
<MathJaxFormula formula={'$$' + func2 + '$$'} />
45-
</MathJaxProvider>
43+
<MathJax>
44+
{'$$' + func2 + '$$'}
45+
</MathJax>
4646
</label>
4747
</div>
4848
<hr />

0 commit comments

Comments
 (0)