@pie-lib/math-input-mathlive 1.1.4 → 1.1.5-beta.1

package/src/mf/input.jsx

@@ -2,7 +2,13 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@mui/material/styles';
 import debug from 'debug';
-import { loadMathLive, getMacros } from '../mathlive-instance';
+import {
+  loadMathLive,
+  getMacros,
+  MATH_MODE_SPACE,
+  applyShadowStyles,
+  trackPlaceholderCaret,
+} from '../mathlive-instance';
 import { toMathLive, fromMathLive, keyToAction, KEYSTROKES } from '../latex-bridge';
 
 const log = debug('pie-lib:math-input-mathlive:input');
@@ -49,9 +55,16 @@ export class Input extends React.Component {
   }
 
   async componentDidMount() {
+    // MathLive loads asynchronously, so this method resumes after an await and
+    // has to know whether it is still the current mount. React StrictMode calls
+    // mount -> unmount -> mount on the SAME instance in dev, so a boolean
+    // "unmounted" flag would latch and block the remount from ever creating a
+    // field. A generation counter identifies the live mount instead: only the
+    // newest one proceeds, and a real unmount invalidates all pending ones.
+    const generation = (this.mountGeneration = (this.mountGeneration || 0) + 1);
     const ml = await loadMathLive();
 
-    if (!ml || !this.holderRef.current) {
+    if (generation !== this.mountGeneration || !ml || !this.holderRef.current || this.mathField) {
       return;
     }
 
@@ -64,15 +77,25 @@ export class Input extends React.Component {
 
     // pie drives input through its own keypad, so suppress MathLive's.
     this.mathField.mathVirtualKeyboardPolicy = 'manual';
+    // Without this the spacebar does nothing: MathLive's mathModeSpace
+    // defaults to an empty string.
+    this.mathField.mathModeSpace = MATH_MODE_SPACE;
+
+    // The mathfield renders in shadow DOM, so page CSS cannot reach it - the
+    // stretchy-accent fix has to be injected there directly.
+    applyShadowStyles(this.mathField);
+
+    // A selected `\placeholder{}` gets no MathLive caret; draw one.
+    this.untrackCaret = trackPlaceholderCaret(this.mathField);
 
     this.mathField.addEventListener('input', this.onInputEdit);
-    this.holderRef.current.appendChild(this.mathField);
+
+    // Belt and braces: drop anything a previous mount may have left behind.
+    this.holderRef.current.replaceChildren(this.mathField);
 
     if (this.props.innerRef) {
       this.props.innerRef(this);
     }
-
-    this.setState?.({});
   }
 
   componentDidUpdate(prevProps) {
@@ -99,6 +122,15 @@ export class Input extends React.Component {
   }
 
   componentWillUnmount() {
+    // Invalidate any mount still awaiting the MathLive load, so it does not
+    // append a field into a holder that is going away.
+    this.mountGeneration = (this.mountGeneration || 0) + 1;
+
+    if (this.untrackCaret) {
+      this.untrackCaret();
+      this.untrackCaret = undefined;
+    }
+
     if (this.mathField) {
       this.mathField.removeEventListener('input', this.onInputEdit);
       this.mathField.remove();

package/src/mf/static.jsx

@@ -2,9 +2,16 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { styled } from '@mui/material/styles';
 import debug from 'debug';
-import { loadMathLive, getMacros, latexToMarkup } from '../mathlive-instance';
+import {
+  loadMathLive,
+  getMacros,
+  latexToMarkup,
+  MATH_MODE_SPACE,
+  applyShadowStyles,
+  trackPlaceholderCaret,
+} from '../mathlive-instance';
 import { toMathLive, fromMathLive, fieldIds } from '../latex-bridge';
-import { placeholderStyles } from './common-styles';
+import { placeholderStyles, rootIndexStyles } from './common-styles';
 
 const log = debug('pie-lib:math-input-mathlive:static');
 
@@ -12,6 +19,9 @@ const Holder = styled('span')({
   display: 'inline-block',
   // Shared static-math rules: muted empty-slot glyphs and svg containment.
   ...placeholderStyles,
+  // Readable radical index - display mode renders in the light DOM, so the
+  // shadow-root copy of this rule does not reach it.
+  ...rootIndexStyles,
   '& math-field': {
     display: 'inline-block',
     border: 'none',
@@ -64,28 +74,49 @@ export default class Static extends React.Component {
   }
 
   async componentDidMount() {
+    // See the note in mf/input.jsx: a generation counter, not a boolean, so a
+    // StrictMode mount -> unmount -> mount on the same instance still ends up
+    // with exactly one field.
+    const generation = (this.mountGeneration = (this.mountGeneration || 0) + 1);
+
     if (!this.isInteractive()) {
       await loadMathLive();
-      this.renderMarkup();
+
+      if (generation === this.mountGeneration) {
+        this.renderMarkup();
+      }
+
       return;
     }
 
     const ml = await loadMathLive();
 
-    if (!ml || !this.holderRef.current) {
+    if (generation !== this.mountGeneration || !ml || !this.holderRef.current || this.mathField) {
       return;
     }
 
     this.mathField = new ml.MathfieldElement({ macros: getMacros() });
     this.mathField.readOnly = true;
     this.mathField.mathVirtualKeyboardPolicy = 'manual';
+    // Without this the spacebar does nothing: MathLive's mathModeSpace
+    // defaults to an empty string.
+    this.mathField.mathModeSpace = MATH_MODE_SPACE;
     this.mathField.value = toMathLive(this.props.latex);
 
+    // The mathfield renders in shadow DOM, so page CSS cannot reach it - the
+    // stretchy-accent fix has to be injected there directly.
+    applyShadowStyles(this.mathField);
+
+    // A selected `\placeholder{}` gets no MathLive caret; draw one. Answer
+    // blocks are typed into with the same keypad, so they grow placeholders too.
+    this.untrackCaret = trackPlaceholderCaret(this.mathField);
+
     this.mathField.addEventListener('input', this.onPromptInput);
     this.mathField.addEventListener('focusin', this.onPromptFocus);
     this.mathField.addEventListener('keydown', this.onKeyDown);
 
-    this.holderRef.current.appendChild(this.mathField);
+    // Belt and braces: drop anything a previous mount may have left behind.
+    this.holderRef.current.replaceChildren(this.mathField);
 
     this.createLiveRegion();
   }
@@ -103,6 +134,14 @@ export default class Static extends React.Component {
   }
 
   componentWillUnmount() {
+    // Invalidate any mount still awaiting the MathLive load.
+    this.mountGeneration = (this.mountGeneration || 0) + 1;
+
+    if (this.untrackCaret) {
+      this.untrackCaret();
+      this.untrackCaret = undefined;
+    }
+
     if (this.mathField) {
       this.mathField.removeEventListener('input', this.onPromptInput);
       this.mathField.removeEventListener('focusin', this.onPromptFocus);
@@ -234,6 +273,13 @@ export default class Static extends React.Component {
   promptHandle(id) {
     return {
       id,
+      // MathQuill's inner fields could be focused directly; keep that.
+      focus: () => {
+        if (this.mathField) {
+          this.mathField.focus();
+          this.focusPrompt(id);
+        }
+      },
       latex: (value) => {
         if (!this.mathField) {
           return '';
@@ -331,8 +377,77 @@ export default class Static extends React.Component {
     }
   };
 
+  /** The id of the prompt whose range contains `position`, if any. */
+  promptContaining(position) {
+    if (!this.mathField || typeof position !== 'number') {
+      return undefined;
+    }
+
+    return (this.mathField.getPrompts() || []).find((id) => {
+      const range = this.mathField.getPromptRange(id);
+
+      return range && position >= range[0] && position <= range[1];
+    });
+  }
+
+  /**
+   * Put a blinking caret inside an answer block.
+   *
+   * MathLive only makes the caret visible while the field element carries the
+   * `ML__focused` class, and it adds that class during a *render*, gated on
+   * `isSelectionEditable && hasFocus()`. In a read-only field only prompt
+   * interiors are editable, so the two things both have to be true:
+   *
+   *  - the selection must sit inside a prompt, and
+   *  - a render must run afterwards.
+   *
+   * Assigning `selection` satisfies the first but not the second - it updates
+   * the model without re-rendering, so the class stays off and the caret span
+   * remains `visibility: hidden`. Executing any command does trigger the
+   * render, and `scrollIntoView` is the one with no other effect: it keeps the
+   * caret on screen, which the preceding `focus()` already does anyway.
+   *
+   * @param {string} [id] prompt to focus; defaults to the first one
+   */
+  focusPrompt(id) {
+    if (!this.mathField) {
+      return;
+    }
+
+    const ids = this.mathField.getPrompts() || [];
+    const target = id && ids.indexOf(id) !== -1 ? id : ids[0];
+
+    if (!target) {
+      return;
+    }
+
+    const range = this.mathField.getPromptRange(target);
+
+    if (!range) {
+      return;
+    }
+
+    this.mathField.selection = { ranges: [[range[0], range[0]]] };
+
+    if (typeof this.mathField.executeCommand === 'function') {
+      this.mathField.executeCommand('scrollIntoView');
+    }
+  }
+
   focus() {
-    this.mathField && this.mathField.focus();
+    if (!this.mathField) {
+      return;
+    }
+
+    this.mathField.focus();
+
+    // A bare focus() leaves the selection outside every prompt, which in a
+    // read-only field is not editable - the block looked focused but had no
+    // cursor. Clicking a prompt already works, because MathLive's own pointer
+    // handling moves the selection and re-renders.
+    if (!this.promptContaining(this.mathField.position)) {
+      this.focusPrompt();
+    }
   }
 
   blur() {

package/CHANGELOG.md

@@ -1,30 +0,0 @@
-# Change Log
-
-All notable changes to this project will be documented in this file.
-See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
-
-## [1.1.4](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-input-mathlive@1.1.3...@pie-lib/math-input-mathlive@1.1.4) (2026-09-22)
-
-**Note:** Version bump only for package @pie-lib/math-input-mathlive
-
-## [1.1.3](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-input-mathlive@1.1.2...@pie-lib/math-input-mathlive@1.1.3) (2026-09-02)
-
-**Note:** Version bump only for package @pie-lib/math-input-mathlive
-
-## [1.1.2](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-input-mathlive@1.1.1...@pie-lib/math-input-mathlive@1.1.2) (2026-08-26)
-
-**Note:** Version bump only for package @pie-lib/math-input-mathlive
-
-## [1.1.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/math-input-mathlive@1.1.0...@pie-lib/math-input-mathlive@1.1.1) (2026-08-21)
-
-**Note:** Version bump only for package @pie-lib/math-input-mathlive
-
-# 1.1.0 (2026-08-13)
-
-### Bug Fixes
-
-- bump math-input-mathlive version to allow canary workflow to generate next on develop ([1ae0088](https://github.com/pie-framework/pie-lib/commit/1ae0088e3b8985aa65933d6a35d94f609cfb9420))
-
-### Features
-
-- implemented math-input-mathlive [PIE-158] ([0d0aa07](https://github.com/pie-framework/pie-lib/commit/0d0aa07cd946b758cb280add754615690542eca3))

package/LICENSE.md

@@ -1,5 +0,0 @@
-Copyright 2019 CoreSpring Inc
-
-Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.

package/src/__tests__/drop-in-compat.test.jsx

@@ -1,112 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import { styled } from '@mui/material/styles';
-
-import { mq } from '../index';
-
-/**
- * Exercises the exact call patterns real consumers use against
- * @pie-lib/math-input, to catch drop-in incompatibilities.
- *
- * Sources:
- *  - packages/math-toolbar/src/editor-and-pad.jsx:16,185
- *  - packages/math-toolbar/src/math-preview.jsx:8,156
- *  - packages/editable-html/src/plugins/respArea/math-templated/index.jsx:92
- *  - packages/editable-html-tip-tap/src/components/respArea/MathTemplated.jsx:111
- */
-describe('drop-in compatibility with @pie-lib/math-input consumers', () => {
-  describe('mq.CommonMqStyles destructuring', () => {
-    it('math-preview.jsx: { commonMqFontStyles, longdivStyles, supsubStyles }', () => {
-      const { commonMqFontStyles, longdivStyles, supsubStyles } = mq.CommonMqStyles;
-
-      expect(commonMqFontStyles).toBeDefined();
-      expect(longdivStyles).toBeDefined();
-      expect(supsubStyles).toBeDefined();
-    });
-
-    it('editor-and-pad.jsx: also { commonMqKeyboardStyles }', () => {
-      const { commonMqFontStyles, commonMqKeyboardStyles, longdivStyles, supsubStyles } = mq.CommonMqStyles;
-
-      expect(commonMqKeyboardStyles).toBeDefined();
-      // All four must be spreadable into an emotion style object.
-      expect(() => ({
-        ...commonMqFontStyles,
-        ...commonMqKeyboardStyles,
-        ...longdivStyles,
-        ...supsubStyles,
-      })).not.toThrow();
-    });
-
-    it('the destructured groups survive being spread into a styled component', () => {
-      const { commonMqFontStyles, longdivStyles, supsubStyles } = mq.CommonMqStyles;
-      const Styled = styled('div')({ ...commonMqFontStyles, ...longdivStyles, ...supsubStyles });
-
-      expect(() => render(<Styled />)).not.toThrow();
-    });
-  });
-
-  describe('mq.Input', () => {
-    it('editor-and-pad.jsx: styled(mq.Input) renders', () => {
-      const MathEditor = styled(mq.Input)(() => ({ width: '100%' }));
-
-      expect(() => render(<MathEditor latex="\\frac{1}{2}" onChange={() => {}} />)).not.toThrow();
-    });
-
-    it('accepts the className that styled() injects', () => {
-      const Styled = styled(mq.Input)({ padding: 4 });
-      const { container } = render(<Styled latex="x" onChange={() => {}} />);
-
-      expect(container.firstChild).toBeTruthy();
-      expect(container.firstChild.className).toBeTruthy();
-    });
-  });
-
-  describe('mq.Static', () => {
-    it('math-preview.jsx: <mq.Static latex onFocus onBlur />', () => {
-      expect(() => render(<mq.Static latex={'\\frac{1}{2}'} onFocus={() => {}} onBlur={() => {}} />)).not.toThrow();
-    });
-
-    it('math-templated respArea: <mq.Static latex={value} />', () => {
-      expect(() => render(<mq.Static latex={'x=1'} />)).not.toThrow();
-    });
-
-    it('renders answer-block latex (the templated-math case) without throwing', () => {
-      expect(() =>
-        render(<mq.Static latex={'x=\\MathQuillMathField[r1]{}'} onSubFieldChange={() => {}} />),
-      ).not.toThrow();
-    });
-
-    it('is styleable, as keypad labels were in math-input', () => {
-      const Styled = styled(mq.Static)({ pointerEvents: 'none' });
-
-      expect(() => render(<Styled latex={'\\pi'} />)).not.toThrow();
-    });
-  });
-
-  describe('surface parity', () => {
-    it('exposes exactly the names math-input exported', () => {
-      // eslint-disable-next-line global-require
-      const pkg = require('../index');
-
-      [
-        'keysForGrade',
-        'addBrackets',
-        'removeBrackets',
-        'keys',
-        'HorizontalKeypad',
-        'mq',
-        'updateSpans',
-        'registerEmbed',
-        'applyStaticMath',
-      ].forEach((name) => {
-        expect(pkg[name]).toBeDefined();
-      });
-    });
-
-    it('mq exposes Input, Static and CommonMqStyles', () => {
-      ['Input', 'Static', 'CommonMqStyles'].forEach((name) => {
-        expect(mq[name]).toBeDefined();
-      });
-    });
-  });
-});

package/src/__tests__/index.test.jsx

@@ -1,109 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-
-import {
-  keys,
-  keysForGrade,
-  addBrackets,
-  removeBrackets,
-  registerEmbed,
-  applyStaticMath,
-  updateSpans,
-  mf,
-  mq,
-  MathInput,
-  HorizontalKeypad,
-  KeyPad,
-} from '../index';
-
-describe('math-input-mathlive public API', () => {
-  it('mirrors the @pie-lib/math-input export surface', () => {
-    expect(typeof keysForGrade).toBe('function');
-    expect(typeof addBrackets).toBe('function');
-    expect(typeof removeBrackets).toBe('function');
-    expect(typeof registerEmbed).toBe('function');
-    expect(typeof applyStaticMath).toBe('function');
-    expect(typeof updateSpans).toBe('function');
-    expect(keys).toBeDefined();
-    expect(keys.baseSet).toBeDefined();
-  });
-
-  it('exports the field wrappers under both mf and mq', () => {
-    expect(mf.Input).toBeDefined();
-    expect(mf.Static).toBeDefined();
-    // `mq` alias lets a consumer swap packages by changing only the import.
-    expect(mq).toBe(mf);
-  });
-
-  it('updateSpans is a safe no-op', () => {
-    expect(() => updateSpans()).not.toThrow();
-  });
-
-  it('CommonMqStyles keeps the shape consumers destructure', () => {
-    // math-toolbar does:
-    //   const { commonMqFontStyles, commonMqKeyboardStyles, longdivStyles, supsubStyles }
-    //     = mq.CommonMqStyles;
-    const { commonMqFontStyles, commonMqKeyboardStyles, longdivStyles, supsubStyles } = mf.CommonMqStyles;
-
-    [commonMqFontStyles, commonMqKeyboardStyles, longdivStyles, supsubStyles].forEach((s) => {
-      expect(s).toBeDefined();
-      expect(typeof s).toBe('object');
-    });
-  });
-
-  it('bracket helpers round-trip', () => {
-    expect(addBrackets('x')).toEqual('\\(x\\)');
-    expect(removeBrackets('\\(x\\)')).toEqual('x');
-    expect(removeBrackets(addBrackets('\\frac{1}{2}'))).toEqual('\\frac{1}{2}');
-  });
-
-  it('keysForGrade returns a 5-row keyset', () => {
-    const set = keysForGrade('geometry');
-
-    expect(Array.isArray(set)).toBe(true);
-    expect(set.length).toBe(5);
-  });
-});
-
-describe('rendering', () => {
-  // MathLive is a browser-only custom element; loadMathLive() resolves async and
-  // is a no-op-ish under jsdom. These assert the components mount without
-  // throwing, which is what regressed most often in the MathQuill version.
-  it('KeyPad renders without a live MathLive instance', () => {
-    const { container } = render(<KeyPad onPress={() => {}} />);
-
-    expect(container.querySelectorAll('button').length).toBeGreaterThan(0);
-  });
-
-  it('KeyPad falls back to raw latex for labels before MathLive loads', () => {
-    const { container } = render(
-      <KeyPad onPress={() => {}} baseSet={[[{ name: 'pi', latex: '\\pi', category: 'constants' }]]} />,
-    );
-
-    expect(container.textContent).toContain('\\pi');
-  });
-
-  it('KeyPad fires onPress with the key definition', () => {
-    const onPress = jest.fn();
-    const key = { name: 'x', label: 'x', write: 'x', category: 'vars' };
-    const { container } = render(<KeyPad onPress={onPress} baseSet={[[key]]} />);
-
-    container.querySelector('button').click();
-
-    expect(onPress).toHaveBeenCalledWith(key);
-  });
-
-  it('MathInput mounts', () => {
-    expect(() => render(<MathInput latex="\\frac{1}{2}" onChange={() => {}} />)).not.toThrow();
-  });
-
-  it('HorizontalKeypad mounts and reports the legacy {value,type} model', () => {
-    const onClick = jest.fn();
-
-    expect(() => render(<HorizontalKeypad onClick={onClick} />)).not.toThrow();
-  });
-
-  it('Static renders display-mode latex without a mathfield', () => {
-    expect(() => render(<mf.Static latex="\\frac{1}{2}" />)).not.toThrow();
-  });
-});

package/src/__tests__/input-imperative.test.jsx

@@ -1,144 +0,0 @@
-import { KEYSTROKES, keyToAction } from '../latex-bridge';
-import Input from '../mf/input';
-
-/**
- * The imperative surface that @pie-lib/math-toolbar drives
- * (editor-and-pad.jsx: clear/command/keystroke/write/latex).
- *
- * These call the methods against a stub mathfield, because a real
- * <math-field> needs a browser. What matters here is the *translation*:
- * MathQuill-era arguments must become valid MathLive operations.
- */
-const stubField = () => {
-  const calls = { insert: [], executeCommand: [], focus: 0 };
-
-  return {
-    calls,
-    value: '',
-    getValue: () => '',
-    insert(v) {
-      calls.insert.push(v);
-    },
-    executeCommand(v) {
-      calls.executeCommand.push(v);
-    },
-    focus() {
-      calls.focus++;
-    },
-    blur() {},
-  };
-};
-
-const withField = () => {
-  const input = new Input({});
-  const f = stubField();
-
-  input.mathField = f;
-
-  return { input, f };
-};
-
-describe('Input imperative API (drives math-toolbar)', () => {
-  describe('keystroke', () => {
-    it('maps MathQuill keystroke names to MathLive selectors', () => {
-      const { input, f } = withField();
-
-      input.keystroke('Left');
-      input.keystroke('Right');
-      input.keystroke('Backspace');
-
-      expect(f.calls.executeCommand).toEqual(['moveToPreviousChar', 'moveToNextChar', 'deleteBackward']);
-    });
-
-    it('passes an unknown value through as a selector', () => {
-      const { input, f } = withField();
-
-      input.keystroke('deleteForward');
-
-      expect(f.calls.executeCommand).toEqual(['deleteForward']);
-    });
-
-    it('does not throw when the engine rejects the selector', () => {
-      const { input } = withField();
-
-      input.mathField.executeCommand = () => {
-        throw new Error('unknown command');
-      };
-
-      expect(() => input.keystroke('Nonsense')).not.toThrow();
-    });
-
-    it('covers every keystroke the keypad emits', () => {
-      // navigation.js / edit.js only produce these three
-      ['Left', 'Right', 'Backspace'].forEach((k) => expect(KEYSTROKES[k]).toBeDefined());
-    });
-  });
-
-  describe('command', () => {
-    it('expands argument-taking commands into placeholders', () => {
-      const { input, f } = withField();
-
-      input.command('\\frac');
-
-      // a bare \frac would give no editable slots
-      expect(f.calls.insert).toEqual(['\\frac{#?}{#?}']);
-    });
-
-    it('handles array commands', () => {
-      const { input, f } = withField();
-
-      input.command(['\\log', '_']);
-
-      expect(f.calls.insert).toEqual(['\\log_{#?}']);
-    });
-
-    it('passes argument-less commands through', () => {
-      const { input, f } = withField();
-
-      input.command('\\pi');
-
-      expect(f.calls.insert).toEqual(['\\pi']);
-    });
-
-    it('agrees with keyToAction', () => {
-      expect(keyToAction({ command: '\\sqrt' }).value).toEqual('\\sqrt{#?}');
-    });
-  });
-
-  describe('safety before MathLive loads', () => {
-    it('every method is a no-op rather than a crash', () => {
-      const input = new Input({});
-
-      // mathField is undefined until loadMathLive() resolves
-      expect(input.latex()).toEqual('');
-      expect(input.clear()).toEqual('');
-      expect(input.command('\\frac')).toEqual('');
-      expect(input.keystroke('Left')).toEqual('');
-      expect(input.write('x')).toEqual('');
-      expect(() => input.focus()).not.toThrow();
-      expect(() => input.blur()).not.toThrow();
-      expect(() => input.setLatex('x')).not.toThrow();
-      expect(input.element).toBeUndefined();
-    });
-  });
-
-  describe('mqCompat facade', () => {
-    // math-toolbar used to call this.input.mathField.latex(); external
-    // consumers may still do the same.
-    it('exposes latex() as a getter', () => {
-      const { input } = withField();
-
-      input.mathField.getValue = () => '\\frac{1}{2}';
-
-      expect(input.mqCompat.latex()).toEqual('\\frac{1}{2}');
-    });
-
-    it('exposes latex(v) as a setter and el()', () => {
-      const { input, f } = withField();
-
-      input.mqCompat.latex('x+1');
-      expect(f.value).toEqual('x+1');
-      expect(input.mqCompat.el()).toBe(f);
-    });
-  });
-});