@pie-lib/editable-html-tip-tap 2.2.0-beta.6 → 2.2.0-beta.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/extensions/math.js.map +1 -1
- package/package.json +3 -3
- package/src/extensions/__tests__/math.test.js +2 -6
- package/src/extensions/math.js +1 -5
- package/lib/__tests__/EditableHtml.test.js +0 -831
- package/lib/__tests__/EditableHtml.test.js.map +0 -1
- package/lib/__tests__/constants.test.js +0 -21
- package/lib/__tests__/constants.test.js.map +0 -1
- package/lib/__tests__/div-to-paragraph-conversion.test.js +0 -213
- package/lib/__tests__/div-to-paragraph-conversion.test.js.map +0 -1
- package/lib/__tests__/extensions.test.js +0 -209
- package/lib/__tests__/extensions.test.js.map +0 -1
- package/lib/__tests__/index.test.js +0 -250
- package/lib/__tests__/index.test.js.map +0 -1
- package/lib/__tests__/size-utils.test.js +0 -57
- package/lib/__tests__/size-utils.test.js.map +0 -1
- package/lib/__tests__/theme.test.js +0 -17
- package/lib/__tests__/theme.test.js.map +0 -1
- package/lib/components/__tests__/AltDialog.test.js +0 -201
- package/lib/components/__tests__/AltDialog.test.js.map +0 -1
- package/lib/components/__tests__/CharacterPicker.test.js +0 -455
- package/lib/components/__tests__/CharacterPicker.test.js.map +0 -1
- package/lib/components/__tests__/CssIcon.test.js +0 -58
- package/lib/components/__tests__/CssIcon.test.js.map +0 -1
- package/lib/components/__tests__/DragInTheBlank.test.js +0 -295
- package/lib/components/__tests__/DragInTheBlank.test.js.map +0 -1
- package/lib/components/__tests__/ExplicitConstructedResponse.test.js +0 -345
- package/lib/components/__tests__/ExplicitConstructedResponse.test.js.map +0 -1
- package/lib/components/__tests__/ImageToolbar.test.js +0 -185
- package/lib/components/__tests__/ImageToolbar.test.js.map +0 -1
- package/lib/components/__tests__/InlineDropdown.test.js +0 -839
- package/lib/components/__tests__/InlineDropdown.test.js.map +0 -1
- package/lib/components/__tests__/InsertImageHandler.test.js +0 -171
- package/lib/components/__tests__/InsertImageHandler.test.js.map +0 -1
- package/lib/components/__tests__/MediaDialog.test.js +0 -433
- package/lib/components/__tests__/MediaDialog.test.js.map +0 -1
- package/lib/components/__tests__/MediaToolbar.test.js +0 -126
- package/lib/components/__tests__/MediaToolbar.test.js.map +0 -1
- package/lib/components/__tests__/MediaWrapper.test.js +0 -96
- package/lib/components/__tests__/MediaWrapper.test.js.map +0 -1
- package/lib/components/__tests__/MenuBar.test.js +0 -502
- package/lib/components/__tests__/MenuBar.test.js.map +0 -1
- package/lib/components/__tests__/RespArea.test.js +0 -171
- package/lib/components/__tests__/RespArea.test.js.map +0 -1
- package/lib/components/__tests__/TableIcons.test.js +0 -153
- package/lib/components/__tests__/TableIcons.test.js.map +0 -1
- package/lib/components/__tests__/TextAlign.test.js +0 -209
- package/lib/components/__tests__/TextAlign.test.js.map +0 -1
- package/lib/components/__tests__/TiptapContainer.test.js +0 -196
- package/lib/components/__tests__/TiptapContainer.test.js.map +0 -1
- package/lib/components/__tests__/characterUtils.test.js +0 -178
- package/lib/components/__tests__/characterUtils.test.js.map +0 -1
- package/lib/components/__tests__/choice.test.js +0 -213
- package/lib/components/__tests__/choice.test.js.map +0 -1
- package/lib/components/__tests__/custom-popper.test.js +0 -108
- package/lib/components/__tests__/custom-popper.test.js.map +0 -1
- package/lib/components/__tests__/done-button.test.js +0 -72
- package/lib/components/__tests__/done-button.test.js.map +0 -1
- package/lib/components/__tests__/toolbar-buttons.test.js +0 -277
- package/lib/components/__tests__/toolbar-buttons.test.js.map +0 -1
- package/lib/components/respArea/DragInTheBlank/__tests__/choice.test.js +0 -90
- package/lib/components/respArea/DragInTheBlank/__tests__/choice.test.js.map +0 -1
- package/lib/components/respArea/__tests__/MathTemplated.test.js +0 -217
- package/lib/components/respArea/__tests__/MathTemplated.test.js.map +0 -1
- package/lib/extensions/__tests__/css.test.js +0 -214
- package/lib/extensions/__tests__/css.test.js.map +0 -1
- package/lib/extensions/__tests__/custom-toolbar-wrapper.test.js +0 -175
- package/lib/extensions/__tests__/custom-toolbar-wrapper.test.js.map +0 -1
- package/lib/extensions/__tests__/divNode.test.js +0 -108
- package/lib/extensions/__tests__/divNode.test.js.map +0 -1
- package/lib/extensions/__tests__/ensure-empty-root-div.test.js +0 -50
- package/lib/extensions/__tests__/ensure-empty-root-div.test.js.map +0 -1
- package/lib/extensions/__tests__/ensure-list-item-content-is-div.test.js +0 -60
- package/lib/extensions/__tests__/ensure-list-item-content-is-div.test.js.map +0 -1
- package/lib/extensions/__tests__/extended-list-item.test.js +0 -13
- package/lib/extensions/__tests__/extended-list-item.test.js.map +0 -1
- package/lib/extensions/__tests__/extended-table-cell.test.js +0 -15
- package/lib/extensions/__tests__/extended-table-cell.test.js.map +0 -1
- package/lib/extensions/__tests__/extended-table.test.js +0 -200
- package/lib/extensions/__tests__/extended-table.test.js.map +0 -1
- package/lib/extensions/__tests__/image-component.test.js +0 -432
- package/lib/extensions/__tests__/image-component.test.js.map +0 -1
- package/lib/extensions/__tests__/image.test.js +0 -313
- package/lib/extensions/__tests__/image.test.js.map +0 -1
- package/lib/extensions/__tests__/math.test.js +0 -1411
- package/lib/extensions/__tests__/math.test.js.map +0 -1
- package/lib/extensions/__tests__/media-node-view.test.js +0 -307
- package/lib/extensions/__tests__/media-node-view.test.js.map +0 -1
- package/lib/extensions/__tests__/media.test.js +0 -292
- package/lib/extensions/__tests__/media.test.js.map +0 -1
- package/lib/extensions/__tests__/responseArea.test.js +0 -736
- package/lib/extensions/__tests__/responseArea.test.js.map +0 -1
- package/lib/utils/__tests__/helper.test.js +0 -107
- package/lib/utils/__tests__/helper.test.js.map +0 -1
- package/lib/utils/__tests__/toolbar.test.js +0 -38
- package/lib/utils/__tests__/toolbar.test.js.map +0 -1
|
@@ -1,1411 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
var _typeof3 = require("@babel/runtime/helpers/typeof");
|
|
5
|
-
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
|
|
6
|
-
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
|
|
7
|
-
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
|
|
8
|
-
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
9
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
10
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
|
-
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
12
|
-
var _react = _interopRequireDefault(require("react"));
|
|
13
|
-
var _react2 = require("@testing-library/react");
|
|
14
|
-
var _math = require("../math");
|
|
15
|
-
var toolbarUtils = _interopRequireWildcard(require("../../utils/toolbar"));
|
|
16
|
-
var _excluded = ["children"];
|
|
17
|
-
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof3(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
|
|
18
|
-
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
19
|
-
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
20
|
-
jest.mock('@tiptap/react', function () {
|
|
21
|
-
return {
|
|
22
|
-
NodeViewWrapper: function NodeViewWrapper(_ref) {
|
|
23
|
-
var children = _ref.children,
|
|
24
|
-
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
25
|
-
return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
|
|
26
|
-
"data-testid": "node-view-wrapper"
|
|
27
|
-
}, props), children);
|
|
28
|
-
},
|
|
29
|
-
ReactNodeViewRenderer: jest.fn(function (component) {
|
|
30
|
-
return component;
|
|
31
|
-
})
|
|
32
|
-
};
|
|
33
|
-
});
|
|
34
|
-
var mockCreatePortal = jest.fn(function (node) {
|
|
35
|
-
return node;
|
|
36
|
-
});
|
|
37
|
-
jest.mock('react-dom', function () {
|
|
38
|
-
return _objectSpread(_objectSpread({}, jest.requireActual('react-dom')), {}, {
|
|
39
|
-
createPortal: function createPortal() {
|
|
40
|
-
return mockCreatePortal.apply(void 0, arguments);
|
|
41
|
-
}
|
|
42
|
-
});
|
|
43
|
-
});
|
|
44
|
-
jest.mock('@pie-lib/math-toolbar', function () {
|
|
45
|
-
var React = require('react');
|
|
46
|
-
return {
|
|
47
|
-
MathPreview: function MathPreview(_ref2) {
|
|
48
|
-
var latex = _ref2.latex;
|
|
49
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
50
|
-
"data-testid": "math-preview"
|
|
51
|
-
}, latex);
|
|
52
|
-
},
|
|
53
|
-
MathToolbar: function MathToolbar(_ref3) {
|
|
54
|
-
var latex = _ref3.latex,
|
|
55
|
-
_onChange = _ref3.onChange,
|
|
56
|
-
onDone = _ref3.onDone;
|
|
57
|
-
var _React$useState = React.useState(latex),
|
|
58
|
-
_React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
|
|
59
|
-
localLatex = _React$useState2[0],
|
|
60
|
-
setLocalLatex = _React$useState2[1];
|
|
61
|
-
return /*#__PURE__*/React.createElement("div", {
|
|
62
|
-
"data-testid": "math-toolbar"
|
|
63
|
-
}, /*#__PURE__*/React.createElement("input", {
|
|
64
|
-
"data-testid": "math-input",
|
|
65
|
-
value: localLatex,
|
|
66
|
-
onChange: function onChange(e) {
|
|
67
|
-
setLocalLatex(e.target.value);
|
|
68
|
-
_onChange(e.target.value);
|
|
69
|
-
}
|
|
70
|
-
}), /*#__PURE__*/React.createElement("button", {
|
|
71
|
-
"data-testid": "done-button",
|
|
72
|
-
onClick: function onClick() {
|
|
73
|
-
return onDone(localLatex);
|
|
74
|
-
}
|
|
75
|
-
}, "Done"));
|
|
76
|
-
}
|
|
77
|
-
};
|
|
78
|
-
});
|
|
79
|
-
jest.mock('@pie-lib/math-rendering', function () {
|
|
80
|
-
return {
|
|
81
|
-
wrapMath: function wrapMath(latex, wrapper) {
|
|
82
|
-
return latex;
|
|
83
|
-
}
|
|
84
|
-
};
|
|
85
|
-
});
|
|
86
|
-
jest.mock('@tiptap/core', function () {
|
|
87
|
-
return {
|
|
88
|
-
Node: {
|
|
89
|
-
create: jest.fn(function (config) {
|
|
90
|
-
return config;
|
|
91
|
-
})
|
|
92
|
-
}
|
|
93
|
-
};
|
|
94
|
-
});
|
|
95
|
-
jest.mock('prosemirror-state', function () {
|
|
96
|
-
return {
|
|
97
|
-
Plugin: jest.fn(function (config) {
|
|
98
|
-
return config;
|
|
99
|
-
}),
|
|
100
|
-
PluginKey: jest.fn(function (key) {
|
|
101
|
-
this.key = key;
|
|
102
|
-
}),
|
|
103
|
-
TextSelection: {
|
|
104
|
-
create: jest.fn(function (doc, pos) {
|
|
105
|
-
return {
|
|
106
|
-
type: 'text',
|
|
107
|
-
pos: pos
|
|
108
|
-
};
|
|
109
|
-
})
|
|
110
|
-
},
|
|
111
|
-
NodeSelection: {
|
|
112
|
-
create: jest.fn(function (doc, pos) {
|
|
113
|
-
return {
|
|
114
|
-
type: 'node',
|
|
115
|
-
pos: pos
|
|
116
|
-
};
|
|
117
|
-
})
|
|
118
|
-
}
|
|
119
|
-
};
|
|
120
|
-
});
|
|
121
|
-
describe('MathNode', function () {
|
|
122
|
-
describe('configuration', function () {
|
|
123
|
-
it('has correct name', function () {
|
|
124
|
-
expect(_math.MathNode.name).toBe('math');
|
|
125
|
-
});
|
|
126
|
-
it('is inline', function () {
|
|
127
|
-
expect(_math.MathNode.inline).toBe(true);
|
|
128
|
-
});
|
|
129
|
-
it('is in inline group', function () {
|
|
130
|
-
expect(_math.MathNode.group).toBe('inline');
|
|
131
|
-
});
|
|
132
|
-
it('is atomic', function () {
|
|
133
|
-
expect(_math.MathNode.atom).toBe(true);
|
|
134
|
-
});
|
|
135
|
-
});
|
|
136
|
-
describe('addAttributes', function () {
|
|
137
|
-
it('returns required attributes', function () {
|
|
138
|
-
var attributes = _math.MathNode.addAttributes();
|
|
139
|
-
expect(attributes).toHaveProperty('latex');
|
|
140
|
-
expect(attributes).toHaveProperty('wrapper');
|
|
141
|
-
expect(attributes).toHaveProperty('html');
|
|
142
|
-
expect(attributes.latex).toEqual({
|
|
143
|
-
"default": ''
|
|
144
|
-
});
|
|
145
|
-
expect(attributes.wrapper).toEqual({
|
|
146
|
-
"default": null
|
|
147
|
-
});
|
|
148
|
-
expect(attributes.html).toEqual({
|
|
149
|
-
"default": null
|
|
150
|
-
});
|
|
151
|
-
});
|
|
152
|
-
});
|
|
153
|
-
describe('parseHTML', function () {
|
|
154
|
-
it('returns parsing rules for latex', function () {
|
|
155
|
-
var rules = _math.MathNode.parseHTML();
|
|
156
|
-
expect(Array.isArray(rules)).toBe(true);
|
|
157
|
-
expect(rules).toHaveLength(2);
|
|
158
|
-
expect(rules[0]).toHaveProperty('tag', 'span[data-latex]');
|
|
159
|
-
});
|
|
160
|
-
it('returns parsing rules for mathml', function () {
|
|
161
|
-
var rules = _math.MathNode.parseHTML();
|
|
162
|
-
expect(rules[1]).toHaveProperty('tag', 'span[data-type="mathml"]');
|
|
163
|
-
});
|
|
164
|
-
});
|
|
165
|
-
describe('renderHTML', function () {
|
|
166
|
-
it('renders mathml when html attribute is present', function () {
|
|
167
|
-
var result = _math.MathNode.renderHTML({
|
|
168
|
-
HTMLAttributes: {
|
|
169
|
-
html: '<math><mi>x</mi></math>'
|
|
170
|
-
}
|
|
171
|
-
});
|
|
172
|
-
expect(result[0]).toBe('span');
|
|
173
|
-
expect(result[1]).toHaveProperty('data-type', 'mathml');
|
|
174
|
-
});
|
|
175
|
-
it('renders latex when html attribute is not present', function () {
|
|
176
|
-
var result = _math.MathNode.renderHTML({
|
|
177
|
-
HTMLAttributes: {
|
|
178
|
-
latex: 'x^2'
|
|
179
|
-
}
|
|
180
|
-
});
|
|
181
|
-
expect(result[0]).toBe('span');
|
|
182
|
-
expect(result[1]).toHaveProperty('data-latex', '');
|
|
183
|
-
expect(result[1]).toHaveProperty('data-raw', 'x^2');
|
|
184
|
-
});
|
|
185
|
-
});
|
|
186
|
-
describe('addCommands', function () {
|
|
187
|
-
it('returns insertMath command', function () {
|
|
188
|
-
var commands = _math.MathNode.addCommands();
|
|
189
|
-
expect(commands).toHaveProperty('insertMath');
|
|
190
|
-
expect((0, _typeof2["default"])(commands.insertMath)).toBe('function');
|
|
191
|
-
});
|
|
192
|
-
it('insertMath opens the toolbar after inserting a math node', function () {
|
|
193
|
-
var setToolbarOpenedSpy = jest.spyOn(toolbarUtils, 'setToolbarOpened');
|
|
194
|
-
var mathNode = {
|
|
195
|
-
type: {
|
|
196
|
-
name: 'math'
|
|
197
|
-
},
|
|
198
|
-
nodeSize: 1
|
|
199
|
-
};
|
|
200
|
-
var tr = {
|
|
201
|
-
insert: jest.fn().mockReturnThis(),
|
|
202
|
-
setSelection: jest.fn().mockReturnThis(),
|
|
203
|
-
doc: {}
|
|
204
|
-
};
|
|
205
|
-
var editor = {
|
|
206
|
-
view: {
|
|
207
|
-
state: {
|
|
208
|
-
schema: {
|
|
209
|
-
nodes: {
|
|
210
|
-
math: {
|
|
211
|
-
create: jest.fn(function () {
|
|
212
|
-
return mathNode;
|
|
213
|
-
})
|
|
214
|
-
}
|
|
215
|
-
}
|
|
216
|
-
},
|
|
217
|
-
selection: {
|
|
218
|
-
$from: {
|
|
219
|
-
pos: 1
|
|
220
|
-
}
|
|
221
|
-
}
|
|
222
|
-
}
|
|
223
|
-
}
|
|
224
|
-
};
|
|
225
|
-
var dispatch = jest.fn();
|
|
226
|
-
var insertMath = _math.MathNode.addCommands().insertMath('x^2');
|
|
227
|
-
insertMath({
|
|
228
|
-
tr: tr,
|
|
229
|
-
editor: editor,
|
|
230
|
-
dispatch: dispatch
|
|
231
|
-
});
|
|
232
|
-
expect(tr.insert).toHaveBeenCalledWith(1, mathNode);
|
|
233
|
-
expect(tr.setSelection).toHaveBeenCalled();
|
|
234
|
-
expect(dispatch).toHaveBeenCalledWith(tr);
|
|
235
|
-
expect(setToolbarOpenedSpy).toHaveBeenCalledWith(editor, true);
|
|
236
|
-
setToolbarOpenedSpy.mockRestore();
|
|
237
|
-
});
|
|
238
|
-
});
|
|
239
|
-
describe('addNodeView', function () {
|
|
240
|
-
it('returns ReactNodeViewRenderer result', function () {
|
|
241
|
-
var result = _math.MathNode.addNodeView();
|
|
242
|
-
expect(result).toBeDefined();
|
|
243
|
-
});
|
|
244
|
-
});
|
|
245
|
-
describe('addProseMirrorPlugins', function () {
|
|
246
|
-
it('registers ensure-text-after-math and zero-width-space plugins', function () {
|
|
247
|
-
var plugins = _math.MathNode.addProseMirrorPlugins();
|
|
248
|
-
expect(plugins).toHaveLength(2);
|
|
249
|
-
expect(plugins[0].appendTransaction).toBeDefined();
|
|
250
|
-
expect(plugins[1].props.handleKeyDown).toBeDefined();
|
|
251
|
-
});
|
|
252
|
-
});
|
|
253
|
-
});
|
|
254
|
-
describe('EnsureTextAfterMathPlugin', function () {
|
|
255
|
-
it('inserts a zero-width space after a math node when no text follows', function () {
|
|
256
|
-
var plugin = (0, _math.EnsureTextAfterMathPlugin)('math');
|
|
257
|
-
var textNode = {
|
|
258
|
-
type: {
|
|
259
|
-
name: 'text'
|
|
260
|
-
}
|
|
261
|
-
};
|
|
262
|
-
var mathNode = {
|
|
263
|
-
type: {
|
|
264
|
-
name: 'math'
|
|
265
|
-
},
|
|
266
|
-
nodeSize: 3
|
|
267
|
-
};
|
|
268
|
-
var tr = {
|
|
269
|
-
insert: jest.fn()
|
|
270
|
-
};
|
|
271
|
-
var newState = {
|
|
272
|
-
schema: {
|
|
273
|
-
text: jest.fn(function (value) {
|
|
274
|
-
return {
|
|
275
|
-
type: textNode.type,
|
|
276
|
-
text: value
|
|
277
|
-
};
|
|
278
|
-
})
|
|
279
|
-
},
|
|
280
|
-
tr: tr,
|
|
281
|
-
doc: {
|
|
282
|
-
descendants: function descendants(cb) {
|
|
283
|
-
return cb(mathNode, 5);
|
|
284
|
-
},
|
|
285
|
-
nodeAt: jest.fn(function () {
|
|
286
|
-
return null;
|
|
287
|
-
})
|
|
288
|
-
}
|
|
289
|
-
};
|
|
290
|
-
var result = plugin.appendTransaction([{
|
|
291
|
-
docChanged: true
|
|
292
|
-
}], {}, newState);
|
|
293
|
-
expect(tr.insert).toHaveBeenCalledWith(8, expect.anything());
|
|
294
|
-
expect(result).toBe(tr);
|
|
295
|
-
});
|
|
296
|
-
it('does not insert when text already follows the math node', function () {
|
|
297
|
-
var plugin = (0, _math.EnsureTextAfterMathPlugin)('math');
|
|
298
|
-
var tr = {
|
|
299
|
-
insert: jest.fn()
|
|
300
|
-
};
|
|
301
|
-
var mathNode = {
|
|
302
|
-
type: {
|
|
303
|
-
name: 'math'
|
|
304
|
-
},
|
|
305
|
-
nodeSize: 3
|
|
306
|
-
};
|
|
307
|
-
var newState = {
|
|
308
|
-
schema: {
|
|
309
|
-
text: jest.fn()
|
|
310
|
-
},
|
|
311
|
-
tr: tr,
|
|
312
|
-
doc: {
|
|
313
|
-
descendants: function descendants(cb) {
|
|
314
|
-
return cb(mathNode, 5);
|
|
315
|
-
},
|
|
316
|
-
nodeAt: jest.fn(function () {
|
|
317
|
-
return {
|
|
318
|
-
type: {
|
|
319
|
-
name: 'text'
|
|
320
|
-
}
|
|
321
|
-
};
|
|
322
|
-
})
|
|
323
|
-
}
|
|
324
|
-
};
|
|
325
|
-
var result = plugin.appendTransaction([{
|
|
326
|
-
docChanged: true
|
|
327
|
-
}], {}, newState);
|
|
328
|
-
expect(tr.insert).not.toHaveBeenCalled();
|
|
329
|
-
expect(result).toBeNull();
|
|
330
|
-
});
|
|
331
|
-
it('returns null when the document did not change', function () {
|
|
332
|
-
var plugin = (0, _math.EnsureTextAfterMathPlugin)('math');
|
|
333
|
-
var result = plugin.appendTransaction([{
|
|
334
|
-
docChanged: false
|
|
335
|
-
}], {}, {});
|
|
336
|
-
expect(result).toBeNull();
|
|
337
|
-
});
|
|
338
|
-
});
|
|
339
|
-
describe('ZeroWidthSpaceHandlingPlugin', function () {
|
|
340
|
-
var createDocWithMathAndZwsp = function createDocWithMathAndZwsp() {
|
|
341
|
-
var resolveOverrides = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
342
|
-
return {
|
|
343
|
-
resolve: jest.fn(function (pos) {
|
|
344
|
-
return _objectSpread({
|
|
345
|
-
nodeAfter: null,
|
|
346
|
-
nodeBefore: null,
|
|
347
|
-
pos: pos
|
|
348
|
-
}, resolveOverrides[pos]);
|
|
349
|
-
}),
|
|
350
|
-
nodeAt: jest.fn(function (pos) {
|
|
351
|
-
if (pos === 1) {
|
|
352
|
-
return {
|
|
353
|
-
type: {
|
|
354
|
-
name: 'text'
|
|
355
|
-
},
|
|
356
|
-
textContent: "\u200B"
|
|
357
|
-
};
|
|
358
|
-
}
|
|
359
|
-
if (pos === 0) {
|
|
360
|
-
return {
|
|
361
|
-
type: {
|
|
362
|
-
name: 'math'
|
|
363
|
-
},
|
|
364
|
-
nodeSize: 1
|
|
365
|
-
};
|
|
366
|
-
}
|
|
367
|
-
return null;
|
|
368
|
-
})
|
|
369
|
-
};
|
|
370
|
-
};
|
|
371
|
-
var createDocWithRegularTextBeforeCursor = function createDocWithRegularTextBeforeCursor() {
|
|
372
|
-
return {
|
|
373
|
-
resolve: jest.fn(function (pos) {
|
|
374
|
-
return {
|
|
375
|
-
nodeAfter: null,
|
|
376
|
-
nodeBefore: null,
|
|
377
|
-
pos: pos
|
|
378
|
-
};
|
|
379
|
-
}),
|
|
380
|
-
nodeAt: jest.fn(function (pos) {
|
|
381
|
-
if (pos === 1) {
|
|
382
|
-
return {
|
|
383
|
-
type: {
|
|
384
|
-
name: 'text'
|
|
385
|
-
},
|
|
386
|
-
textContent: 'a'
|
|
387
|
-
};
|
|
388
|
-
}
|
|
389
|
-
return null;
|
|
390
|
-
})
|
|
391
|
-
};
|
|
392
|
-
};
|
|
393
|
-
var createView = function createView() {
|
|
394
|
-
var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
|
|
395
|
-
_ref4$state = _ref4.state,
|
|
396
|
-
stateOverrides = _ref4$state === void 0 ? {} : _ref4$state;
|
|
397
|
-
var dispatch = jest.fn();
|
|
398
|
-
var tr = {
|
|
399
|
-
"delete": jest.fn().mockReturnThis(),
|
|
400
|
-
setSelection: jest.fn().mockReturnThis()
|
|
401
|
-
};
|
|
402
|
-
return {
|
|
403
|
-
state: _objectSpread({
|
|
404
|
-
selection: {
|
|
405
|
-
from: 2,
|
|
406
|
-
empty: true
|
|
407
|
-
},
|
|
408
|
-
doc: createDocWithMathAndZwsp(),
|
|
409
|
-
tr: tr
|
|
410
|
-
}, stateOverrides),
|
|
411
|
-
dispatch: dispatch
|
|
412
|
-
};
|
|
413
|
-
};
|
|
414
|
-
describe('Backspace', function () {
|
|
415
|
-
it('deletes the inline node and zero-width space before the cursor', function () {
|
|
416
|
-
var view = createView();
|
|
417
|
-
var handled = _math.ZeroWidthSpaceHandlingPlugin.props.handleKeyDown(view, {
|
|
418
|
-
key: 'Backspace'
|
|
419
|
-
});
|
|
420
|
-
expect(handled).toBe(true);
|
|
421
|
-
expect(view.state.tr["delete"]).toHaveBeenCalledWith(0, 2);
|
|
422
|
-
expect(view.dispatch).toHaveBeenCalledWith(view.state.tr);
|
|
423
|
-
});
|
|
424
|
-
it('returns false when regular text precedes the cursor', function () {
|
|
425
|
-
var view = createView({
|
|
426
|
-
state: {
|
|
427
|
-
doc: createDocWithRegularTextBeforeCursor()
|
|
428
|
-
}
|
|
429
|
-
});
|
|
430
|
-
var handled = _math.ZeroWidthSpaceHandlingPlugin.props.handleKeyDown(view, {
|
|
431
|
-
key: 'Backspace'
|
|
432
|
-
});
|
|
433
|
-
expect(handled).toBe(false);
|
|
434
|
-
expect(view.state.tr["delete"]).not.toHaveBeenCalled();
|
|
435
|
-
expect(view.dispatch).not.toHaveBeenCalled();
|
|
436
|
-
});
|
|
437
|
-
});
|
|
438
|
-
describe('ArrowLeft', function () {
|
|
439
|
-
it('selects the inline node before a zero-width space', function () {
|
|
440
|
-
var mathNode = {
|
|
441
|
-
nodeSize: 3
|
|
442
|
-
};
|
|
443
|
-
var view = createView({
|
|
444
|
-
state: {
|
|
445
|
-
doc: createDocWithMathAndZwsp({
|
|
446
|
-
0: {
|
|
447
|
-
nodeAfter: mathNode,
|
|
448
|
-
nodeBefore: null,
|
|
449
|
-
pos: 0
|
|
450
|
-
}
|
|
451
|
-
})
|
|
452
|
-
}
|
|
453
|
-
});
|
|
454
|
-
var _require = require('prosemirror-state'),
|
|
455
|
-
NodeSelection = _require.NodeSelection;
|
|
456
|
-
var handled = _math.ZeroWidthSpaceHandlingPlugin.props.handleKeyDown(view, {
|
|
457
|
-
key: 'ArrowLeft'
|
|
458
|
-
});
|
|
459
|
-
expect(handled).toBe(true);
|
|
460
|
-
expect(view.state.doc.resolve).toHaveBeenCalledWith(0);
|
|
461
|
-
expect(NodeSelection.create).toHaveBeenCalledWith(view.state.doc, 0);
|
|
462
|
-
expect(view.dispatch).toHaveBeenCalled();
|
|
463
|
-
});
|
|
464
|
-
it('moves the text cursor before the zero-width space when no inline node precedes it', function () {
|
|
465
|
-
var view = createView();
|
|
466
|
-
var _require2 = require('prosemirror-state'),
|
|
467
|
-
TextSelection = _require2.TextSelection;
|
|
468
|
-
var handled = _math.ZeroWidthSpaceHandlingPlugin.props.handleKeyDown(view, {
|
|
469
|
-
key: 'ArrowLeft'
|
|
470
|
-
});
|
|
471
|
-
expect(handled).toBe(true);
|
|
472
|
-
expect(view.state.doc.resolve).toHaveBeenCalledWith(0);
|
|
473
|
-
expect(TextSelection.create).toHaveBeenCalledWith(view.state.doc, 0);
|
|
474
|
-
expect(view.dispatch).toHaveBeenCalled();
|
|
475
|
-
});
|
|
476
|
-
it('returns false when regular text precedes the cursor', function () {
|
|
477
|
-
var view = createView({
|
|
478
|
-
state: {
|
|
479
|
-
doc: createDocWithRegularTextBeforeCursor()
|
|
480
|
-
}
|
|
481
|
-
});
|
|
482
|
-
var handled = _math.ZeroWidthSpaceHandlingPlugin.props.handleKeyDown(view, {
|
|
483
|
-
key: 'ArrowLeft'
|
|
484
|
-
});
|
|
485
|
-
expect(handled).toBe(false);
|
|
486
|
-
expect(view.state.tr.setSelection).not.toHaveBeenCalled();
|
|
487
|
-
expect(view.dispatch).not.toHaveBeenCalled();
|
|
488
|
-
});
|
|
489
|
-
});
|
|
490
|
-
it('returns false for unrelated keys', function () {
|
|
491
|
-
var view = createView();
|
|
492
|
-
var handled = _math.ZeroWidthSpaceHandlingPlugin.props.handleKeyDown(view, {
|
|
493
|
-
key: 'Enter'
|
|
494
|
-
});
|
|
495
|
-
expect(handled).toBe(false);
|
|
496
|
-
});
|
|
497
|
-
});
|
|
498
|
-
describe('MathNodeView', function () {
|
|
499
|
-
var createEditorElement = function createEditorElement() {
|
|
500
|
-
var rect = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
|
|
501
|
-
top: 0,
|
|
502
|
-
left: 0,
|
|
503
|
-
width: 600,
|
|
504
|
-
height: 400
|
|
505
|
-
};
|
|
506
|
-
var element = document.createElement('div');
|
|
507
|
-
Object.defineProperty(element, 'getBoundingClientRect', {
|
|
508
|
-
value: jest.fn(function () {
|
|
509
|
-
return rect;
|
|
510
|
-
}),
|
|
511
|
-
configurable: true
|
|
512
|
-
});
|
|
513
|
-
return element;
|
|
514
|
-
};
|
|
515
|
-
var createMockEditor = function createMockEditor() {
|
|
516
|
-
return {
|
|
517
|
-
state: {
|
|
518
|
-
selection: {
|
|
519
|
-
from: 0,
|
|
520
|
-
to: 1,
|
|
521
|
-
node: {
|
|
522
|
-
type: {
|
|
523
|
-
name: 'math'
|
|
524
|
-
}
|
|
525
|
-
}
|
|
526
|
-
},
|
|
527
|
-
tr: {
|
|
528
|
-
setSelection: jest.fn().mockReturnThis(),
|
|
529
|
-
setMeta: jest.fn().mockReturnThis()
|
|
530
|
-
},
|
|
531
|
-
doc: {}
|
|
532
|
-
},
|
|
533
|
-
view: {
|
|
534
|
-
coordsAtPos: jest.fn(function () {
|
|
535
|
-
return {
|
|
536
|
-
top: 100,
|
|
537
|
-
left: 50
|
|
538
|
-
};
|
|
539
|
-
}),
|
|
540
|
-
dispatch: jest.fn()
|
|
541
|
-
},
|
|
542
|
-
options: {
|
|
543
|
-
element: createEditorElement()
|
|
544
|
-
},
|
|
545
|
-
commands: {
|
|
546
|
-
focus: jest.fn()
|
|
547
|
-
},
|
|
548
|
-
instanceId: 'editor-123',
|
|
549
|
-
_toolbarOpened: false
|
|
550
|
-
};
|
|
551
|
-
};
|
|
552
|
-
var mockNode = {
|
|
553
|
-
attrs: {
|
|
554
|
-
latex: 'x^2'
|
|
555
|
-
},
|
|
556
|
-
nodeSize: 1
|
|
557
|
-
};
|
|
558
|
-
var defaultProps;
|
|
559
|
-
beforeEach(function () {
|
|
560
|
-
jest.clearAllMocks();
|
|
561
|
-
mockCreatePortal.mockImplementation(function (node) {
|
|
562
|
-
return node;
|
|
563
|
-
});
|
|
564
|
-
defaultProps = {
|
|
565
|
-
node: mockNode,
|
|
566
|
-
updateAttributes: jest.fn(),
|
|
567
|
-
editor: createMockEditor(),
|
|
568
|
-
selected: false,
|
|
569
|
-
options: {},
|
|
570
|
-
getPos: jest.fn(function () {
|
|
571
|
-
return 0;
|
|
572
|
-
})
|
|
573
|
-
};
|
|
574
|
-
});
|
|
575
|
-
it('renders without crashing', function () {
|
|
576
|
-
var _render = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, defaultProps)),
|
|
577
|
-
container = _render.container;
|
|
578
|
-
expect(container).toBeInTheDocument();
|
|
579
|
-
});
|
|
580
|
-
it('renders NodeViewWrapper', function () {
|
|
581
|
-
var _render2 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, defaultProps)),
|
|
582
|
-
getByTestId = _render2.getByTestId;
|
|
583
|
-
expect(getByTestId('node-view-wrapper')).toBeInTheDocument();
|
|
584
|
-
});
|
|
585
|
-
it('displays math preview', function () {
|
|
586
|
-
var _render3 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, defaultProps)),
|
|
587
|
-
getByTestId = _render3.getByTestId;
|
|
588
|
-
expect(getByTestId('math-preview')).toBeInTheDocument();
|
|
589
|
-
});
|
|
590
|
-
it('shows toolbar when selected', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee() {
|
|
591
|
-
var _render4, getByTestId;
|
|
592
|
-
return _regenerator["default"].wrap(function (_context) {
|
|
593
|
-
while (1) switch (_context.prev = _context.next) {
|
|
594
|
-
case 0:
|
|
595
|
-
_render4 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
596
|
-
selected: true
|
|
597
|
-
}))), getByTestId = _render4.getByTestId;
|
|
598
|
-
_context.next = 1;
|
|
599
|
-
return (0, _react2.waitFor)(function () {
|
|
600
|
-
expect(getByTestId('math-toolbar')).toBeInTheDocument();
|
|
601
|
-
});
|
|
602
|
-
case 1:
|
|
603
|
-
case "end":
|
|
604
|
-
return _context.stop();
|
|
605
|
-
}
|
|
606
|
-
}, _callee);
|
|
607
|
-
})));
|
|
608
|
-
it('does not show toolbar when not selected', function () {
|
|
609
|
-
var _render5 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
610
|
-
selected: false
|
|
611
|
-
}))),
|
|
612
|
-
queryByTestId = _render5.queryByTestId;
|
|
613
|
-
expect(queryByTestId('math-toolbar')).not.toBeInTheDocument();
|
|
614
|
-
});
|
|
615
|
-
it('adds data-toolbar-for attribute with editor instanceId', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee2() {
|
|
616
|
-
var _render6, container;
|
|
617
|
-
return _regenerator["default"].wrap(function (_context2) {
|
|
618
|
-
while (1) switch (_context2.prev = _context2.next) {
|
|
619
|
-
case 0:
|
|
620
|
-
_render6 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
621
|
-
selected: true
|
|
622
|
-
}))), container = _render6.container;
|
|
623
|
-
_context2.next = 1;
|
|
624
|
-
return (0, _react2.waitFor)(function () {
|
|
625
|
-
var toolbar = container.querySelector('[data-toolbar-for]');
|
|
626
|
-
expect(toolbar).toHaveAttribute('data-toolbar-for', 'editor-123');
|
|
627
|
-
});
|
|
628
|
-
case 1:
|
|
629
|
-
case "end":
|
|
630
|
-
return _context2.stop();
|
|
631
|
-
}
|
|
632
|
-
}, _callee2);
|
|
633
|
-
})));
|
|
634
|
-
describe('toolbar positioning', function () {
|
|
635
|
-
it('positions relative to portal container using coordsAtPos', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee3() {
|
|
636
|
-
var _render7, container;
|
|
637
|
-
return _regenerator["default"].wrap(function (_context3) {
|
|
638
|
-
while (1) switch (_context3.prev = _context3.next) {
|
|
639
|
-
case 0:
|
|
640
|
-
_render7 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
641
|
-
selected: true
|
|
642
|
-
}))), container = _render7.container;
|
|
643
|
-
_context3.next = 1;
|
|
644
|
-
return (0, _react2.waitFor)(function () {
|
|
645
|
-
var toolbar = container.querySelector('[data-toolbar-for]');
|
|
646
|
-
expect(toolbar).toBeInTheDocument();
|
|
647
|
-
expect(toolbar.style.top).toBe('100px');
|
|
648
|
-
expect(toolbar.style.left).toBe('50px');
|
|
649
|
-
});
|
|
650
|
-
case 1:
|
|
651
|
-
case "end":
|
|
652
|
-
return _context3.stop();
|
|
653
|
-
}
|
|
654
|
-
}, _callee3);
|
|
655
|
-
})));
|
|
656
|
-
it('offsets position by portal container getBoundingClientRect', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee4() {
|
|
657
|
-
var containerEl, editor, _render8, container;
|
|
658
|
-
return _regenerator["default"].wrap(function (_context4) {
|
|
659
|
-
while (1) switch (_context4.prev = _context4.next) {
|
|
660
|
-
case 0:
|
|
661
|
-
containerEl = document.createElement('div');
|
|
662
|
-
containerEl.getBoundingClientRect = jest.fn(function () {
|
|
663
|
-
return {
|
|
664
|
-
top: 100,
|
|
665
|
-
left: 50,
|
|
666
|
-
width: 600,
|
|
667
|
-
height: 400
|
|
668
|
-
};
|
|
669
|
-
});
|
|
670
|
-
editor = _objectSpread(_objectSpread({}, defaultProps.editor), {}, {
|
|
671
|
-
_tiptapContainerEl: containerEl
|
|
672
|
-
});
|
|
673
|
-
_render8 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
674
|
-
editor: editor,
|
|
675
|
-
selected: true
|
|
676
|
-
}))), container = _render8.container;
|
|
677
|
-
_context4.next = 1;
|
|
678
|
-
return (0, _react2.waitFor)(function () {
|
|
679
|
-
var toolbar = container.querySelector('[data-toolbar-for]');
|
|
680
|
-
expect(toolbar).toBeInTheDocument();
|
|
681
|
-
expect(toolbar.style.top).toBe('0px');
|
|
682
|
-
expect(toolbar.style.left).toBe('0px');
|
|
683
|
-
});
|
|
684
|
-
case 1:
|
|
685
|
-
case "end":
|
|
686
|
-
return _context4.stop();
|
|
687
|
-
}
|
|
688
|
-
}, _callee4);
|
|
689
|
-
})));
|
|
690
|
-
it('applies absolute positioning style to toolbar', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee5() {
|
|
691
|
-
var _render9, container;
|
|
692
|
-
return _regenerator["default"].wrap(function (_context5) {
|
|
693
|
-
while (1) switch (_context5.prev = _context5.next) {
|
|
694
|
-
case 0:
|
|
695
|
-
_render9 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
696
|
-
selected: true
|
|
697
|
-
}))), container = _render9.container;
|
|
698
|
-
_context5.next = 1;
|
|
699
|
-
return (0, _react2.waitFor)(function () {
|
|
700
|
-
var toolbar = container.querySelector('[data-toolbar-for]');
|
|
701
|
-
expect(toolbar).toBeInTheDocument();
|
|
702
|
-
expect(toolbar.style.position).toBe('absolute');
|
|
703
|
-
});
|
|
704
|
-
case 1:
|
|
705
|
-
case "end":
|
|
706
|
-
return _context5.stop();
|
|
707
|
-
}
|
|
708
|
-
}, _callee5);
|
|
709
|
-
})));
|
|
710
|
-
it('renders above other editor overlays with a high z-index', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee6() {
|
|
711
|
-
var _render0, container;
|
|
712
|
-
return _regenerator["default"].wrap(function (_context6) {
|
|
713
|
-
while (1) switch (_context6.prev = _context6.next) {
|
|
714
|
-
case 0:
|
|
715
|
-
_render0 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
716
|
-
selected: true
|
|
717
|
-
}))), container = _render0.container;
|
|
718
|
-
_context6.next = 1;
|
|
719
|
-
return (0, _react2.waitFor)(function () {
|
|
720
|
-
var toolbar = container.querySelector('[data-toolbar-for]');
|
|
721
|
-
expect(toolbar).toBeInTheDocument();
|
|
722
|
-
expect(toolbar.style.zIndex).toBe('1000');
|
|
723
|
-
});
|
|
724
|
-
case 1:
|
|
725
|
-
case "end":
|
|
726
|
-
return _context6.stop();
|
|
727
|
-
}
|
|
728
|
-
}, _callee6);
|
|
729
|
-
})));
|
|
730
|
-
it('updates position from coordsAtPos when selection changes', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee7() {
|
|
731
|
-
var editor, _render1, container;
|
|
732
|
-
return _regenerator["default"].wrap(function (_context7) {
|
|
733
|
-
while (1) switch (_context7.prev = _context7.next) {
|
|
734
|
-
case 0:
|
|
735
|
-
editor = _objectSpread(_objectSpread({}, defaultProps.editor), {}, {
|
|
736
|
-
view: _objectSpread(_objectSpread({}, defaultProps.editor.view), {}, {
|
|
737
|
-
coordsAtPos: jest.fn(function () {
|
|
738
|
-
return {
|
|
739
|
-
top: 200,
|
|
740
|
-
left: 150
|
|
741
|
-
};
|
|
742
|
-
}),
|
|
743
|
-
dispatch: jest.fn()
|
|
744
|
-
})
|
|
745
|
-
});
|
|
746
|
-
_render1 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
747
|
-
editor: editor,
|
|
748
|
-
selected: true
|
|
749
|
-
}))), container = _render1.container;
|
|
750
|
-
_context7.next = 1;
|
|
751
|
-
return (0, _react2.waitFor)(function () {
|
|
752
|
-
var toolbar = container.querySelector('[data-toolbar-for]');
|
|
753
|
-
expect(toolbar).toBeInTheDocument();
|
|
754
|
-
expect(toolbar.style.top).toBe('200px');
|
|
755
|
-
expect(toolbar.style.left).toBe('150px');
|
|
756
|
-
});
|
|
757
|
-
case 1:
|
|
758
|
-
case "end":
|
|
759
|
-
return _context7.stop();
|
|
760
|
-
}
|
|
761
|
-
}, _callee7);
|
|
762
|
-
})));
|
|
763
|
-
it('clamps toolbar position to viewport margins', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee9() {
|
|
764
|
-
var originalInnerHeight, originalInnerWidth, editor, _render10, container, toolbar;
|
|
765
|
-
return _regenerator["default"].wrap(function (_context9) {
|
|
766
|
-
while (1) switch (_context9.prev = _context9.next) {
|
|
767
|
-
case 0:
|
|
768
|
-
originalInnerHeight = window.innerHeight;
|
|
769
|
-
originalInnerWidth = window.innerWidth;
|
|
770
|
-
Object.defineProperty(window, 'innerHeight', {
|
|
771
|
-
configurable: true,
|
|
772
|
-
writable: true,
|
|
773
|
-
value: 200
|
|
774
|
-
});
|
|
775
|
-
Object.defineProperty(window, 'innerWidth', {
|
|
776
|
-
configurable: true,
|
|
777
|
-
writable: true,
|
|
778
|
-
value: 300
|
|
779
|
-
});
|
|
780
|
-
editor = _objectSpread(_objectSpread({}, defaultProps.editor), {}, {
|
|
781
|
-
view: _objectSpread(_objectSpread({}, defaultProps.editor.view), {}, {
|
|
782
|
-
coordsAtPos: jest.fn(function () {
|
|
783
|
-
return {
|
|
784
|
-
top: 190,
|
|
785
|
-
left: 280,
|
|
786
|
-
bottom: 195
|
|
787
|
-
};
|
|
788
|
-
}),
|
|
789
|
-
dispatch: jest.fn()
|
|
790
|
-
})
|
|
791
|
-
});
|
|
792
|
-
_render10 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
793
|
-
editor: editor,
|
|
794
|
-
selected: true
|
|
795
|
-
}))), container = _render10.container;
|
|
796
|
-
_context9.next = 1;
|
|
797
|
-
return (0, _react2.waitFor)(function () {
|
|
798
|
-
toolbar = container.querySelector('[data-toolbar-for]');
|
|
799
|
-
expect(toolbar).toBeInTheDocument();
|
|
800
|
-
});
|
|
801
|
-
case 1:
|
|
802
|
-
Object.defineProperty(toolbar, 'offsetHeight', {
|
|
803
|
-
configurable: true,
|
|
804
|
-
value: 100
|
|
805
|
-
});
|
|
806
|
-
Object.defineProperty(toolbar, 'offsetWidth', {
|
|
807
|
-
configurable: true,
|
|
808
|
-
value: 150
|
|
809
|
-
});
|
|
810
|
-
_context9.next = 2;
|
|
811
|
-
return (0, _react2.act)(/*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee8() {
|
|
812
|
-
return _regenerator["default"].wrap(function (_context8) {
|
|
813
|
-
while (1) switch (_context8.prev = _context8.next) {
|
|
814
|
-
case 0:
|
|
815
|
-
window.dispatchEvent(new Event('resize'));
|
|
816
|
-
_context8.next = 1;
|
|
817
|
-
return new Promise(function (resolve) {
|
|
818
|
-
return requestAnimationFrame(resolve);
|
|
819
|
-
});
|
|
820
|
-
case 1:
|
|
821
|
-
case "end":
|
|
822
|
-
return _context8.stop();
|
|
823
|
-
}
|
|
824
|
-
}, _callee8);
|
|
825
|
-
})));
|
|
826
|
-
case 2:
|
|
827
|
-
_context9.next = 3;
|
|
828
|
-
return (0, _react2.waitFor)(function () {
|
|
829
|
-
expect(parseInt(toolbar.style.top, 10)).toBeLessThanOrEqual(200 - 100 - 8);
|
|
830
|
-
expect(parseInt(toolbar.style.left, 10)).toBeLessThanOrEqual(300 - 150 - 8);
|
|
831
|
-
expect(parseInt(toolbar.style.top, 10)).toBeGreaterThanOrEqual(8);
|
|
832
|
-
expect(parseInt(toolbar.style.left, 10)).toBeGreaterThanOrEqual(8);
|
|
833
|
-
});
|
|
834
|
-
case 3:
|
|
835
|
-
Object.defineProperty(window, 'innerHeight', {
|
|
836
|
-
configurable: true,
|
|
837
|
-
writable: true,
|
|
838
|
-
value: originalInnerHeight
|
|
839
|
-
});
|
|
840
|
-
Object.defineProperty(window, 'innerWidth', {
|
|
841
|
-
configurable: true,
|
|
842
|
-
writable: true,
|
|
843
|
-
value: originalInnerWidth
|
|
844
|
-
});
|
|
845
|
-
case 4:
|
|
846
|
-
case "end":
|
|
847
|
-
return _context9.stop();
|
|
848
|
-
}
|
|
849
|
-
}, _callee9);
|
|
850
|
-
})));
|
|
851
|
-
it('attaches scroll and resize listeners while toolbar is open', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee0() {
|
|
852
|
-
var addSpy;
|
|
853
|
-
return _regenerator["default"].wrap(function (_context0) {
|
|
854
|
-
while (1) switch (_context0.prev = _context0.next) {
|
|
855
|
-
case 0:
|
|
856
|
-
addSpy = jest.spyOn(window, 'addEventListener');
|
|
857
|
-
(0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
858
|
-
selected: true
|
|
859
|
-
})));
|
|
860
|
-
_context0.next = 1;
|
|
861
|
-
return (0, _react2.waitFor)(function () {
|
|
862
|
-
expect(addSpy).toHaveBeenCalledWith('scroll', expect.any(Function), true);
|
|
863
|
-
expect(addSpy).toHaveBeenCalledWith('resize', expect.any(Function));
|
|
864
|
-
});
|
|
865
|
-
case 1:
|
|
866
|
-
addSpy.mockRestore();
|
|
867
|
-
case 2:
|
|
868
|
-
case "end":
|
|
869
|
-
return _context0.stop();
|
|
870
|
-
}
|
|
871
|
-
}, _callee0);
|
|
872
|
-
})));
|
|
873
|
-
it('portals toolbar into _tiptapContainerEl when available', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee1() {
|
|
874
|
-
var containerEl, editor;
|
|
875
|
-
return _regenerator["default"].wrap(function (_context1) {
|
|
876
|
-
while (1) switch (_context1.prev = _context1.next) {
|
|
877
|
-
case 0:
|
|
878
|
-
containerEl = document.createElement('div');
|
|
879
|
-
containerEl.getBoundingClientRect = jest.fn(function () {
|
|
880
|
-
return {
|
|
881
|
-
top: 0,
|
|
882
|
-
left: 0,
|
|
883
|
-
width: 600,
|
|
884
|
-
height: 400
|
|
885
|
-
};
|
|
886
|
-
});
|
|
887
|
-
editor = _objectSpread(_objectSpread({}, defaultProps.editor), {}, {
|
|
888
|
-
_tiptapContainerEl: containerEl
|
|
889
|
-
});
|
|
890
|
-
mockCreatePortal.mockClear();
|
|
891
|
-
(0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
892
|
-
editor: editor,
|
|
893
|
-
selected: true
|
|
894
|
-
})));
|
|
895
|
-
_context1.next = 1;
|
|
896
|
-
return (0, _react2.waitFor)(function () {
|
|
897
|
-
expect(mockCreatePortal).toHaveBeenCalled();
|
|
898
|
-
var lastCall = mockCreatePortal.mock.calls[mockCreatePortal.mock.calls.length - 1];
|
|
899
|
-
expect(lastCall[1]).toBe(containerEl);
|
|
900
|
-
});
|
|
901
|
-
case 1:
|
|
902
|
-
case "end":
|
|
903
|
-
return _context1.stop();
|
|
904
|
-
}
|
|
905
|
-
}, _callee1);
|
|
906
|
-
})));
|
|
907
|
-
it('portals toolbar into document.body when _tiptapContainerEl is not set', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee10() {
|
|
908
|
-
var editor;
|
|
909
|
-
return _regenerator["default"].wrap(function (_context10) {
|
|
910
|
-
while (1) switch (_context10.prev = _context10.next) {
|
|
911
|
-
case 0:
|
|
912
|
-
editor = _objectSpread(_objectSpread({}, defaultProps.editor), {}, {
|
|
913
|
-
_tiptapContainerEl: undefined
|
|
914
|
-
});
|
|
915
|
-
mockCreatePortal.mockClear();
|
|
916
|
-
(0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
917
|
-
editor: editor,
|
|
918
|
-
selected: true
|
|
919
|
-
})));
|
|
920
|
-
_context10.next = 1;
|
|
921
|
-
return (0, _react2.waitFor)(function () {
|
|
922
|
-
expect(mockCreatePortal).toHaveBeenCalled();
|
|
923
|
-
var lastCall = mockCreatePortal.mock.calls[mockCreatePortal.mock.calls.length - 1];
|
|
924
|
-
expect(lastCall[1]).toBe(document.body);
|
|
925
|
-
});
|
|
926
|
-
case 1:
|
|
927
|
-
case "end":
|
|
928
|
-
return _context10.stop();
|
|
929
|
-
}
|
|
930
|
-
}, _callee10);
|
|
931
|
-
})));
|
|
932
|
-
});
|
|
933
|
-
it('calls updateAttributes when latex changes', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee11() {
|
|
934
|
-
var _render11, getByTestId;
|
|
935
|
-
return _regenerator["default"].wrap(function (_context11) {
|
|
936
|
-
while (1) switch (_context11.prev = _context11.next) {
|
|
937
|
-
case 0:
|
|
938
|
-
_render11 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
939
|
-
selected: true
|
|
940
|
-
}))), getByTestId = _render11.getByTestId;
|
|
941
|
-
_context11.next = 1;
|
|
942
|
-
return (0, _react2.waitFor)(function () {
|
|
943
|
-
var input = getByTestId('math-input');
|
|
944
|
-
_react2.fireEvent.change(input, {
|
|
945
|
-
target: {
|
|
946
|
-
value: 'y^2'
|
|
947
|
-
}
|
|
948
|
-
});
|
|
949
|
-
});
|
|
950
|
-
case 1:
|
|
951
|
-
expect(defaultProps.updateAttributes).toHaveBeenCalledWith({
|
|
952
|
-
latex: 'y^2'
|
|
953
|
-
});
|
|
954
|
-
case 2:
|
|
955
|
-
case "end":
|
|
956
|
-
return _context11.stop();
|
|
957
|
-
}
|
|
958
|
-
}, _callee11);
|
|
959
|
-
})));
|
|
960
|
-
it('closes toolbar and updates attributes when done', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee12() {
|
|
961
|
-
var updateAttributes, _render12, getByTestId, doneButton;
|
|
962
|
-
return _regenerator["default"].wrap(function (_context12) {
|
|
963
|
-
while (1) switch (_context12.prev = _context12.next) {
|
|
964
|
-
case 0:
|
|
965
|
-
updateAttributes = jest.fn();
|
|
966
|
-
_render12 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
967
|
-
updateAttributes: updateAttributes,
|
|
968
|
-
selected: true
|
|
969
|
-
}))), getByTestId = _render12.getByTestId;
|
|
970
|
-
_context12.next = 1;
|
|
971
|
-
return (0, _react2.waitFor)(function () {
|
|
972
|
-
expect(getByTestId('done-button')).toBeInTheDocument();
|
|
973
|
-
});
|
|
974
|
-
case 1:
|
|
975
|
-
doneButton = getByTestId('done-button');
|
|
976
|
-
_react2.fireEvent.click(doneButton);
|
|
977
|
-
_context12.next = 2;
|
|
978
|
-
return (0, _react2.waitFor)(function () {
|
|
979
|
-
expect(updateAttributes).toHaveBeenCalledWith({
|
|
980
|
-
latex: 'x^2'
|
|
981
|
-
});
|
|
982
|
-
});
|
|
983
|
-
case 2:
|
|
984
|
-
case "end":
|
|
985
|
-
return _context12.stop();
|
|
986
|
-
}
|
|
987
|
-
}, _callee12);
|
|
988
|
-
})));
|
|
989
|
-
it('sets editor._toolbarOpened when toolbar is shown', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee13() {
|
|
990
|
-
var _render13, getByTestId;
|
|
991
|
-
return _regenerator["default"].wrap(function (_context13) {
|
|
992
|
-
while (1) switch (_context13.prev = _context13.next) {
|
|
993
|
-
case 0:
|
|
994
|
-
_render13 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
995
|
-
selected: true
|
|
996
|
-
}))), getByTestId = _render13.getByTestId;
|
|
997
|
-
_context13.next = 1;
|
|
998
|
-
return (0, _react2.waitFor)(function () {
|
|
999
|
-
expect(getByTestId('math-toolbar')).toBeInTheDocument();
|
|
1000
|
-
expect(defaultProps.editor._toolbarOpened).toBe(true);
|
|
1001
|
-
});
|
|
1002
|
-
case 1:
|
|
1003
|
-
case "end":
|
|
1004
|
-
return _context13.stop();
|
|
1005
|
-
}
|
|
1006
|
-
}, _callee13);
|
|
1007
|
-
})));
|
|
1008
|
-
it('unsets editor._toolbarOpened when toolbar is closed and node is not selected', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee14() {
|
|
1009
|
-
var _render14, getByTestId;
|
|
1010
|
-
return _regenerator["default"].wrap(function (_context14) {
|
|
1011
|
-
while (1) switch (_context14.prev = _context14.next) {
|
|
1012
|
-
case 0:
|
|
1013
|
-
_render14 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1014
|
-
selected: false
|
|
1015
|
-
}))), getByTestId = _render14.getByTestId;
|
|
1016
|
-
_react2.fireEvent.click(getByTestId('math-preview'));
|
|
1017
|
-
_context14.next = 1;
|
|
1018
|
-
return (0, _react2.waitFor)(function () {
|
|
1019
|
-
expect(getByTestId('math-toolbar')).toBeInTheDocument();
|
|
1020
|
-
expect(defaultProps.editor._toolbarOpened).toBe(true);
|
|
1021
|
-
});
|
|
1022
|
-
case 1:
|
|
1023
|
-
_react2.fireEvent.click(getByTestId('done-button'));
|
|
1024
|
-
_context14.next = 2;
|
|
1025
|
-
return (0, _react2.waitFor)(function () {
|
|
1026
|
-
expect(defaultProps.editor._toolbarOpened).toBe(false);
|
|
1027
|
-
});
|
|
1028
|
-
case 2:
|
|
1029
|
-
case "end":
|
|
1030
|
-
return _context14.stop();
|
|
1031
|
-
}
|
|
1032
|
-
}, _callee14);
|
|
1033
|
-
})));
|
|
1034
|
-
it('keeps editor._toolbarOpened true while the math node remains selected', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee15() {
|
|
1035
|
-
var _render15, getByTestId;
|
|
1036
|
-
return _regenerator["default"].wrap(function (_context15) {
|
|
1037
|
-
while (1) switch (_context15.prev = _context15.next) {
|
|
1038
|
-
case 0:
|
|
1039
|
-
_render15 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1040
|
-
selected: true
|
|
1041
|
-
}))), getByTestId = _render15.getByTestId;
|
|
1042
|
-
_context15.next = 1;
|
|
1043
|
-
return (0, _react2.waitFor)(function () {
|
|
1044
|
-
expect(getByTestId('done-button')).toBeInTheDocument();
|
|
1045
|
-
expect(defaultProps.editor._toolbarOpened).toBe(true);
|
|
1046
|
-
});
|
|
1047
|
-
case 1:
|
|
1048
|
-
_react2.fireEvent.click(getByTestId('done-button'));
|
|
1049
|
-
_context15.next = 2;
|
|
1050
|
-
return (0, _react2.waitFor)(function () {
|
|
1051
|
-
expect(defaultProps.editor._toolbarOpened).toBe(true);
|
|
1052
|
-
});
|
|
1053
|
-
case 2:
|
|
1054
|
-
case "end":
|
|
1055
|
-
return _context15.stop();
|
|
1056
|
-
}
|
|
1057
|
-
}, _callee15);
|
|
1058
|
-
})));
|
|
1059
|
-
it('closes toolbar on outside click and runs handleDone', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee16() {
|
|
1060
|
-
var updateAttributes, editor, _require3, TextSelection, _render16, queryByTestId;
|
|
1061
|
-
return _regenerator["default"].wrap(function (_context16) {
|
|
1062
|
-
while (1) switch (_context16.prev = _context16.next) {
|
|
1063
|
-
case 0:
|
|
1064
|
-
updateAttributes = jest.fn();
|
|
1065
|
-
editor = createMockEditor();
|
|
1066
|
-
_require3 = require('prosemirror-state'), TextSelection = _require3.TextSelection;
|
|
1067
|
-
_render16 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1068
|
-
editor: editor,
|
|
1069
|
-
updateAttributes: updateAttributes,
|
|
1070
|
-
selected: true
|
|
1071
|
-
}))), queryByTestId = _render16.queryByTestId;
|
|
1072
|
-
_context16.next = 1;
|
|
1073
|
-
return (0, _react2.waitFor)(function () {
|
|
1074
|
-
expect(queryByTestId('math-toolbar')).toBeInTheDocument();
|
|
1075
|
-
});
|
|
1076
|
-
case 1:
|
|
1077
|
-
_react2.fireEvent.click(document.body);
|
|
1078
|
-
_context16.next = 2;
|
|
1079
|
-
return (0, _react2.waitFor)(function () {
|
|
1080
|
-
expect(queryByTestId('math-toolbar')).not.toBeInTheDocument();
|
|
1081
|
-
expect(updateAttributes).toHaveBeenCalledWith({
|
|
1082
|
-
latex: 'x^2'
|
|
1083
|
-
});
|
|
1084
|
-
expect(TextSelection.create).toHaveBeenCalledWith(editor.state.doc, 1);
|
|
1085
|
-
expect(editor.state.tr.setSelection).toHaveBeenCalled();
|
|
1086
|
-
expect(editor.view.dispatch).toHaveBeenCalledWith(editor.state.tr);
|
|
1087
|
-
expect(editor.commands.focus).toHaveBeenCalled();
|
|
1088
|
-
expect(editor._toolbarOpened).toBe(true);
|
|
1089
|
-
});
|
|
1090
|
-
case 2:
|
|
1091
|
-
case "end":
|
|
1092
|
-
return _context16.stop();
|
|
1093
|
-
}
|
|
1094
|
-
}, _callee16);
|
|
1095
|
-
})));
|
|
1096
|
-
it('re-registers click listener when node changes', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee17() {
|
|
1097
|
-
var addEventListenerSpy, removeEventListenerSpy, nodeA, nodeB, _render17, rerender, initialCallCount;
|
|
1098
|
-
return _regenerator["default"].wrap(function (_context17) {
|
|
1099
|
-
while (1) switch (_context17.prev = _context17.next) {
|
|
1100
|
-
case 0:
|
|
1101
|
-
addEventListenerSpy = jest.spyOn(document, 'addEventListener');
|
|
1102
|
-
removeEventListenerSpy = jest.spyOn(document, 'removeEventListener');
|
|
1103
|
-
nodeA = {
|
|
1104
|
-
attrs: {
|
|
1105
|
-
latex: 'x^2'
|
|
1106
|
-
}
|
|
1107
|
-
};
|
|
1108
|
-
nodeB = {
|
|
1109
|
-
attrs: {
|
|
1110
|
-
latex: 'y^2'
|
|
1111
|
-
}
|
|
1112
|
-
};
|
|
1113
|
-
_render17 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1114
|
-
node: nodeA,
|
|
1115
|
-
selected: true
|
|
1116
|
-
}))), rerender = _render17.rerender;
|
|
1117
|
-
_context17.next = 1;
|
|
1118
|
-
return (0, _react2.waitFor)(function () {
|
|
1119
|
-
expect(addEventListenerSpy).toHaveBeenCalledWith('click', expect.any(Function));
|
|
1120
|
-
});
|
|
1121
|
-
case 1:
|
|
1122
|
-
initialCallCount = addEventListenerSpy.mock.calls.length;
|
|
1123
|
-
rerender(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1124
|
-
node: nodeB,
|
|
1125
|
-
selected: true
|
|
1126
|
-
})));
|
|
1127
|
-
_context17.next = 2;
|
|
1128
|
-
return (0, _react2.waitFor)(function () {
|
|
1129
|
-
expect(removeEventListenerSpy).toHaveBeenCalled();
|
|
1130
|
-
expect(addEventListenerSpy.mock.calls.length).toBeGreaterThan(initialCallCount);
|
|
1131
|
-
});
|
|
1132
|
-
case 2:
|
|
1133
|
-
addEventListenerSpy.mockRestore();
|
|
1134
|
-
removeEventListenerSpy.mockRestore();
|
|
1135
|
-
case 3:
|
|
1136
|
-
case "end":
|
|
1137
|
-
return _context17.stop();
|
|
1138
|
-
}
|
|
1139
|
-
}, _callee17);
|
|
1140
|
-
})));
|
|
1141
|
-
it('does not close toolbar when clicking the math node preview', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee18() {
|
|
1142
|
-
var _render18, getByTestId, queryByTestId;
|
|
1143
|
-
return _regenerator["default"].wrap(function (_context18) {
|
|
1144
|
-
while (1) switch (_context18.prev = _context18.next) {
|
|
1145
|
-
case 0:
|
|
1146
|
-
_render18 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1147
|
-
selected: true
|
|
1148
|
-
}))), getByTestId = _render18.getByTestId, queryByTestId = _render18.queryByTestId;
|
|
1149
|
-
_context18.next = 1;
|
|
1150
|
-
return (0, _react2.waitFor)(function () {
|
|
1151
|
-
expect(queryByTestId('math-toolbar')).toBeInTheDocument();
|
|
1152
|
-
});
|
|
1153
|
-
case 1:
|
|
1154
|
-
_react2.fireEvent.click(getByTestId('math-preview'));
|
|
1155
|
-
_context18.next = 2;
|
|
1156
|
-
return (0, _react2.waitFor)(function () {
|
|
1157
|
-
expect(queryByTestId('math-toolbar')).toBeInTheDocument();
|
|
1158
|
-
});
|
|
1159
|
-
case 2:
|
|
1160
|
-
case "end":
|
|
1161
|
-
return _context18.stop();
|
|
1162
|
-
}
|
|
1163
|
-
}, _callee18);
|
|
1164
|
-
})));
|
|
1165
|
-
describe('unique math-node class per instance', function () {
|
|
1166
|
-
var dateNowSpy;
|
|
1167
|
-
beforeEach(function () {
|
|
1168
|
-
var timestamp = 1000;
|
|
1169
|
-
dateNowSpy = jest.spyOn(Date, 'now').mockImplementation(function () {
|
|
1170
|
-
return timestamp++;
|
|
1171
|
-
});
|
|
1172
|
-
});
|
|
1173
|
-
afterEach(function () {
|
|
1174
|
-
dateNowSpy.mockRestore();
|
|
1175
|
-
});
|
|
1176
|
-
|
|
1177
|
-
// The wrapper is an emotion styled() component, so className also carries
|
|
1178
|
-
// emotion's generated class - assert on the math-node token, not equality.
|
|
1179
|
-
it('assigns a timestamp-based class to NodeViewWrapper', function () {
|
|
1180
|
-
var _render19 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, defaultProps)),
|
|
1181
|
-
getByTestId = _render19.getByTestId;
|
|
1182
|
-
var wrapper = getByTestId('node-view-wrapper');
|
|
1183
|
-
expect(Array.from(wrapper.classList).some(function (c) {
|
|
1184
|
-
return /^math-node-\d+$/.test(c);
|
|
1185
|
-
})).toBe(true);
|
|
1186
|
-
});
|
|
1187
|
-
it('assigns a different class to each MathNodeView instance', function () {
|
|
1188
|
-
var _render20 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_math.MathNodeView, defaultProps), /*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1189
|
-
node: {
|
|
1190
|
-
attrs: {
|
|
1191
|
-
latex: 'y^2'
|
|
1192
|
-
}
|
|
1193
|
-
}
|
|
1194
|
-
})))),
|
|
1195
|
-
getAllByTestId = _render20.getAllByTestId;
|
|
1196
|
-
var wrappers = getAllByTestId('node-view-wrapper');
|
|
1197
|
-
var mathNodeClass = function mathNodeClass(el) {
|
|
1198
|
-
return Array.from(el.classList).find(function (c) {
|
|
1199
|
-
return c.startsWith('math-node-');
|
|
1200
|
-
});
|
|
1201
|
-
};
|
|
1202
|
-
expect(mathNodeClass(wrappers[0])).toBe('math-node-1000');
|
|
1203
|
-
expect(mathNodeClass(wrappers[1])).toBe('math-node-1001');
|
|
1204
|
-
// and they must differ
|
|
1205
|
-
expect(mathNodeClass(wrappers[0])).not.toBe(mathNodeClass(wrappers[1]));
|
|
1206
|
-
});
|
|
1207
|
-
it('closes toolbar when clicking a different math node', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee19() {
|
|
1208
|
-
var updateAttributes, editorA, editorB, _render21, getAllByTestId, queryAllByTestId, secondPreview;
|
|
1209
|
-
return _regenerator["default"].wrap(function (_context19) {
|
|
1210
|
-
while (1) switch (_context19.prev = _context19.next) {
|
|
1211
|
-
case 0:
|
|
1212
|
-
updateAttributes = jest.fn();
|
|
1213
|
-
editorA = createMockEditor();
|
|
1214
|
-
editorB = createMockEditor();
|
|
1215
|
-
_render21 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1216
|
-
editor: editorA,
|
|
1217
|
-
updateAttributes: updateAttributes,
|
|
1218
|
-
selected: false
|
|
1219
|
-
})), /*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1220
|
-
editor: editorB,
|
|
1221
|
-
node: {
|
|
1222
|
-
attrs: {
|
|
1223
|
-
latex: 'y^2'
|
|
1224
|
-
}
|
|
1225
|
-
},
|
|
1226
|
-
selected: false
|
|
1227
|
-
})))), getAllByTestId = _render21.getAllByTestId, queryAllByTestId = _render21.queryAllByTestId;
|
|
1228
|
-
_react2.fireEvent.click(getAllByTestId('math-preview')[0]);
|
|
1229
|
-
_context19.next = 1;
|
|
1230
|
-
return (0, _react2.waitFor)(function () {
|
|
1231
|
-
expect(queryAllByTestId('math-toolbar')).toHaveLength(1);
|
|
1232
|
-
});
|
|
1233
|
-
case 1:
|
|
1234
|
-
secondPreview = getAllByTestId('math-preview')[1];
|
|
1235
|
-
_react2.fireEvent.click(secondPreview);
|
|
1236
|
-
_context19.next = 2;
|
|
1237
|
-
return (0, _react2.waitFor)(function () {
|
|
1238
|
-
expect(queryAllByTestId('math-toolbar')).toHaveLength(1);
|
|
1239
|
-
expect(updateAttributes).toHaveBeenCalledWith({
|
|
1240
|
-
latex: 'x^2'
|
|
1241
|
-
});
|
|
1242
|
-
expect(editorA._toolbarOpened).toBe(false);
|
|
1243
|
-
expect(getAllByTestId('math-input')[0]).toHaveValue('y^2');
|
|
1244
|
-
});
|
|
1245
|
-
case 2:
|
|
1246
|
-
case "end":
|
|
1247
|
-
return _context19.stop();
|
|
1248
|
-
}
|
|
1249
|
-
}, _callee19);
|
|
1250
|
-
})));
|
|
1251
|
-
});
|
|
1252
|
-
describe('selection-based toolbar guard', function () {
|
|
1253
|
-
it('opens toolbar when selected transitions to true and the editor has a NodeSelection on math', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee20() {
|
|
1254
|
-
var _render22, queryByTestId, rerender;
|
|
1255
|
-
return _regenerator["default"].wrap(function (_context20) {
|
|
1256
|
-
while (1) switch (_context20.prev = _context20.next) {
|
|
1257
|
-
case 0:
|
|
1258
|
-
_render22 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1259
|
-
selected: false
|
|
1260
|
-
}))), queryByTestId = _render22.queryByTestId, rerender = _render22.rerender;
|
|
1261
|
-
expect(queryByTestId('math-toolbar')).not.toBeInTheDocument();
|
|
1262
|
-
rerender(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1263
|
-
selected: true
|
|
1264
|
-
})));
|
|
1265
|
-
_context20.next = 1;
|
|
1266
|
-
return (0, _react2.waitFor)(function () {
|
|
1267
|
-
expect(queryByTestId('math-toolbar')).toBeInTheDocument();
|
|
1268
|
-
});
|
|
1269
|
-
case 1:
|
|
1270
|
-
case "end":
|
|
1271
|
-
return _context20.stop();
|
|
1272
|
-
}
|
|
1273
|
-
}, _callee20);
|
|
1274
|
-
})));
|
|
1275
|
-
it('does not open toolbar when selected briefly becomes true but editor selection has no node (Cmd+A / drag case)', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee22() {
|
|
1276
|
-
var editor, _render23, queryByTestId, rerender;
|
|
1277
|
-
return _regenerator["default"].wrap(function (_context22) {
|
|
1278
|
-
while (1) switch (_context22.prev = _context22.next) {
|
|
1279
|
-
case 0:
|
|
1280
|
-
editor = _objectSpread(_objectSpread({}, defaultProps.editor), {}, {
|
|
1281
|
-
state: _objectSpread(_objectSpread({}, defaultProps.editor.state), {}, {
|
|
1282
|
-
selection: {
|
|
1283
|
-
from: 0,
|
|
1284
|
-
to: 100
|
|
1285
|
-
} // no .node — TextSelection / AllSelection shape
|
|
1286
|
-
})
|
|
1287
|
-
});
|
|
1288
|
-
_render23 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1289
|
-
editor: editor,
|
|
1290
|
-
selected: false
|
|
1291
|
-
}))), queryByTestId = _render23.queryByTestId, rerender = _render23.rerender;
|
|
1292
|
-
rerender(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1293
|
-
editor: editor,
|
|
1294
|
-
selected: true
|
|
1295
|
-
})));
|
|
1296
|
-
_context22.next = 1;
|
|
1297
|
-
return (0, _react2.act)(/*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee21() {
|
|
1298
|
-
return _regenerator["default"].wrap(function (_context21) {
|
|
1299
|
-
while (1) switch (_context21.prev = _context21.next) {
|
|
1300
|
-
case 0:
|
|
1301
|
-
case "end":
|
|
1302
|
-
return _context21.stop();
|
|
1303
|
-
}
|
|
1304
|
-
}, _callee21);
|
|
1305
|
-
})));
|
|
1306
|
-
case 1:
|
|
1307
|
-
expect(queryByTestId('math-toolbar')).not.toBeInTheDocument();
|
|
1308
|
-
case 2:
|
|
1309
|
-
case "end":
|
|
1310
|
-
return _context22.stop();
|
|
1311
|
-
}
|
|
1312
|
-
}, _callee22);
|
|
1313
|
-
})));
|
|
1314
|
-
it('does not open toolbar when selected briefly becomes true but NodeSelection targets a non-math node', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee24() {
|
|
1315
|
-
var editor, _render24, queryByTestId, rerender;
|
|
1316
|
-
return _regenerator["default"].wrap(function (_context24) {
|
|
1317
|
-
while (1) switch (_context24.prev = _context24.next) {
|
|
1318
|
-
case 0:
|
|
1319
|
-
editor = _objectSpread(_objectSpread({}, defaultProps.editor), {}, {
|
|
1320
|
-
state: _objectSpread(_objectSpread({}, defaultProps.editor.state), {}, {
|
|
1321
|
-
selection: {
|
|
1322
|
-
from: 0,
|
|
1323
|
-
to: 1,
|
|
1324
|
-
node: {
|
|
1325
|
-
type: {
|
|
1326
|
-
name: 'image'
|
|
1327
|
-
}
|
|
1328
|
-
}
|
|
1329
|
-
}
|
|
1330
|
-
})
|
|
1331
|
-
});
|
|
1332
|
-
_render24 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1333
|
-
editor: editor,
|
|
1334
|
-
selected: false
|
|
1335
|
-
}))), queryByTestId = _render24.queryByTestId, rerender = _render24.rerender;
|
|
1336
|
-
rerender(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1337
|
-
editor: editor,
|
|
1338
|
-
selected: true
|
|
1339
|
-
})));
|
|
1340
|
-
_context24.next = 1;
|
|
1341
|
-
return (0, _react2.act)(/*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee23() {
|
|
1342
|
-
return _regenerator["default"].wrap(function (_context23) {
|
|
1343
|
-
while (1) switch (_context23.prev = _context23.next) {
|
|
1344
|
-
case 0:
|
|
1345
|
-
case "end":
|
|
1346
|
-
return _context23.stop();
|
|
1347
|
-
}
|
|
1348
|
-
}, _callee23);
|
|
1349
|
-
})));
|
|
1350
|
-
case 1:
|
|
1351
|
-
expect(queryByTestId('math-toolbar')).not.toBeInTheDocument();
|
|
1352
|
-
case 2:
|
|
1353
|
-
case "end":
|
|
1354
|
-
return _context24.stop();
|
|
1355
|
-
}
|
|
1356
|
-
}, _callee24);
|
|
1357
|
-
})));
|
|
1358
|
-
});
|
|
1359
|
-
it('does not close toolbar when clicking equation editor dropdown', /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee25() {
|
|
1360
|
-
var _render25, queryByTestId, dropdown;
|
|
1361
|
-
return _regenerator["default"].wrap(function (_context25) {
|
|
1362
|
-
while (1) switch (_context25.prev = _context25.next) {
|
|
1363
|
-
case 0:
|
|
1364
|
-
_render25 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1365
|
-
selected: true
|
|
1366
|
-
}))), queryByTestId = _render25.queryByTestId;
|
|
1367
|
-
_context25.next = 1;
|
|
1368
|
-
return (0, _react2.waitFor)(function () {
|
|
1369
|
-
expect(queryByTestId('math-toolbar')).toBeInTheDocument();
|
|
1370
|
-
});
|
|
1371
|
-
case 1:
|
|
1372
|
-
// Simulate MUI Select's portal dropdown container.
|
|
1373
|
-
dropdown = document.createElement('div');
|
|
1374
|
-
dropdown.id = 'equation-editor-select-listbox';
|
|
1375
|
-
document.body.appendChild(dropdown);
|
|
1376
|
-
_react2.fireEvent.click(dropdown);
|
|
1377
|
-
_context25.next = 2;
|
|
1378
|
-
return (0, _react2.waitFor)(function () {
|
|
1379
|
-
expect(queryByTestId('math-toolbar')).toBeInTheDocument();
|
|
1380
|
-
});
|
|
1381
|
-
case 2:
|
|
1382
|
-
document.body.removeChild(dropdown);
|
|
1383
|
-
case 3:
|
|
1384
|
-
case "end":
|
|
1385
|
-
return _context25.stop();
|
|
1386
|
-
}
|
|
1387
|
-
}, _callee25);
|
|
1388
|
-
})));
|
|
1389
|
-
it('renders with empty latex', function () {
|
|
1390
|
-
var nodeWithEmptyLatex = {
|
|
1391
|
-
attrs: {
|
|
1392
|
-
latex: ''
|
|
1393
|
-
}
|
|
1394
|
-
};
|
|
1395
|
-
var _render26 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, (0, _extends2["default"])({}, defaultProps, {
|
|
1396
|
-
node: nodeWithEmptyLatex
|
|
1397
|
-
}))),
|
|
1398
|
-
getByTestId = _render26.getByTestId;
|
|
1399
|
-
expect(getByTestId('math-preview')).toBeInTheDocument();
|
|
1400
|
-
});
|
|
1401
|
-
it('has correct styling on NodeViewWrapper', function () {
|
|
1402
|
-
var _render27 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_math.MathNodeView, defaultProps)),
|
|
1403
|
-
getByTestId = _render27.getByTestId;
|
|
1404
|
-
var wrapper = getByTestId('node-view-wrapper');
|
|
1405
|
-
expect(wrapper).toHaveStyle({
|
|
1406
|
-
display: 'inline-flex',
|
|
1407
|
-
cursor: 'pointer'
|
|
1408
|
-
});
|
|
1409
|
-
});
|
|
1410
|
-
});
|
|
1411
|
-
//# sourceMappingURL=math.test.js.map
|