Embed text inputs in latex formulas with MathJax

Hey all!
With the following code snippet it is possible to embed text inputs in a latex formula.

MathJax = {
  tex: {packages: {'[+]': ['input']}},
  startup: {
    ready() {
      const Configuration = MathJax._.input.tex.Configuration.Configuration;
      const CommandMap = MathJax._.input.tex.SymbolMap.CommandMap;
      const TEXCLASS = MathJax._.core.MmlTree.MmlNode.TEXCLASS;
      new CommandMap('input', {input: 'Input'}, {
        Input(parser, name) {
          const xml = parser.create('node', 'XML');
          const id = parser.GetBrackets(name, '');
          const w = parser.GetBrackets(name, '5em');
          const value = parser.GetArgument(name);
          xml.setXML(MathJax.startup.adaptor.node('input', {
            id: id, value: value, style: {width: w}, xmlns: 'http://www.w3.org/1999/xhtml'
          }), MathJax.startup.adaptor);
          xml.getSerializedXML = function () {
            return this.adaptor.outerHTML(this.xml) + '</input>';
            parser.create('node', 'TeXAtom', [
              parser.create('node', 'semantics', [
                parser.create('node', 'annotation-xml', [
                ], {encoding: 'application/xhtml+xml'})
            ], {texClass: TEXCLASS.ORD})
      Configuration.create('input', {handler: {macro: ['input']}});

<script id="MathJax-script" defer src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js"></script>

So that a formula like $ \int_{\input[sub][1em]{0}}^{\input[sup][1em]{1}} \input[integrand][10em]{}\, dx$ is rendered like this:
I wonder if there is a way to make this work in a notebook? Because at the moment it looks like this:
Maybe there is a way to configure the existing MathJax instance and extend it with the functionality from above? It seems like that the code from above overrides the old MathJax instance because after executing you cannot render Latex correctly any longer.