'"MathJax.texReset is not a function at window.RenderOutput" error in MathJax

I am getting the error MathJax.texReset is not a function at window.RenderOutput most times in my MathJax. But sometimes it works fine without any edits. my code is as below.

  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/a_style.css">
    <script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
    <script src="js/MathJax/es5/tex-chtml-full.js" charset="utf-8" async></script>
  </head>

at end i added some JS

<script src="js/jquery-3.6.0.min.js" charset="utf-8"></script>
<script src="js/bootstrap.bundle.min.js" charset="utf-8"></script>
<script src="js/mathjaxconfig.js" charset="utf-8" async id="MathJax-script"></script>
<script src="js/main.js" charset="utf-8"></script>

mathjaxconfig.js is

window.MathJax = {
loader: {load: ['input/asciimath','[tex]/physics']},
startup: {
ready:function() {
  const {Configuration} = MathJax._.input.tex.Configuration;
  const CommandMap = MathJax._.input.tex.SymbolMap.CommandMap;
  const TexError = MathJax._.input.tex.TexError.default;

  const CheckDimen = function (dimen) {
    if (dimen === '') return '';
    if (dimen.match(/^\s*([-+]?(\.\d+|\d+(\.\d*)?))\s*(pt|em|ex|mu|px|mm|cm|in|pc)\s*$/)) {
      return dimen.replace(/ /g, '');
    }
    throw new TexError('BadImageDimen', 'Bad dimension for image: %1', dimen);
  };
  new CommandMap('img', {img: 'Img'}, {
    Img(parser, name) {
      const arg = parser.GetBrackets(name, '');
      const def = {
        valign: '',
        width:  '',
        height: ''
      };
      if (arg.match(/[,=]/)) {
        for (const pair of arg.split(/\s*,\s*/)) {
          const [key, ...value] = pair.split(/\s*=\s*/);
          if (!def.hasOwnProperty(key)) throw new TexError('UnknownKey', 'Unknown parameter "%1" in %2', key, name);
          def[key] = CheckDimen(value.join('='));
        }
      } else {
        def.valign = CheckDimen(arg);
        def.width  = CheckDimen(parser.GetBrackets(name, ''));
        def.height = CheckDimen(parser.GetBrackets(name, ''));
      }
      def.src = parser.GetArgument(name);
      if (!def.valign) delete def.valign;
      if (!def.width)  delete def.width;
      if (!def.height) delete def.height;
      parser.Push(parser.create('token', 'mglyph', def));
    }
  });
  Configuration.create('img', {handler: {macro: ['img']}});

  MathJax.startup.defaultReady();
},
pageReady: function () {
    var input = document.getElementById('MathInput');
    var output = document.getElementById('MathPreview');
    var button = document.getElementById('renderHTML');
    //output.innerHTML = input.value.trim();
    window.typesetInput = function () {
      button.disabled = true;
      output.innerHTML = input.value.trim();
      MathJax.texReset();
      MathJax.typesetClear();
      MathJax.typesetPromise([output]).catch(function (err) {
        output.innerHTML = '';
        output.appendChild(document.createTextNode(err.message));
        console.error(err);
      }).then(function () {
        button.disabled = false;
      });
    }
    // input.oninput = typesetInput;
  // }

  return MathJax.startup.defaultPageReady();
}
},
tex: {
inlineMath: [['$', '$'], ['\\(', '\\)']],
processEscapes: true,
packages: {'[+]': ['img'],'[+]': ['physics']},
tags:'ams'
},
options: {
  enableMenu: false,
  menuOptions: {
    settings: {
      renderer: 'SVG'
    }
 }
}
};

and main.js is

window.RenderOutput = function (button,input,output) {
  var input=document.getElementById(input);
  var output=document.getElementById(output);
  button.disabled = true;
  output.innerHTML = input.value.trim();
  MathJax.texReset();
  MathJax.typesetClear();
  MathJax.typesetPromise([output]).catch(function (err) {
    output.innerHTML = '';
    output.appendChild(document.createTextNode(err.message));
    console.error(err);
  }).then(function () {
    button.disabled = false;
  });
}

window.RenderOutputFun = function (button,x) {
  var input=document.getElementsByClassName('op')[x];
  var output=document.getElementsByClassName('opPreview')[x];
  button.disabled = true;
  output.innerHTML = input.value.trim();
  MathJax.texReset();
  MathJax.typesetClear();
  MathJax.typesetPromise([output]).catch(function (err) {
    output.innerHTML = '';
    output.appendChild(document.createTextNode(err.message));
    console.error(err);
  }).then(function () {
    button.disabled = false;
  });
}

i can't figure out why this happen. Because it works sometimes and shows error sometimes (mostly error).

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source

'"MathJax.texReset is not a function at window.RenderOutput" error in MathJax

Sources

Related Questions