Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Error: Can't make callback from given data #3244

Closed
pranshujethmalani opened this issue Jun 17, 2024 · 2 comments
Closed

Error: Can't make callback from given data #3244

pranshujethmalani opened this issue Jun 17, 2024 · 2 comments
Labels
Expected Behavior This is how MathJax works v2

Comments

@pranshujethmalani
Copy link

Issue Summary

We're using Mathjax library to render math equations & getting the following error.

Error: Can't make callback from given data
    at USING (MathJax.js?config=TeX-AMS_HTML-full,Safe:19:5557)
    at Object.Push (MathJax.js?config=TeX-AMS_HTML-full,Safe:19:8335)
    at Object.Queue (MathJax.js?config=TeX-AMS_HTML-full,Safe:19:35245)
    at global.js:2:1715982

The following is the html code snippet.

<head>
    <!-- Load Libraries -->

    <script  src="../../js/init.js"></script>
    <script  src="../../js/global.js"></script>
</head>
<body class="loading">
  <div class="ac-content">
    <table border=0 cellspacing=0 cellpadding=0 width=100% align="center">
        <tr>
            <td nowrap>
                <span id="caption"></span>
            </td>
            <td nowrap>
                <span id="math"></span>
            </td>
        </tr>
    </table>
  </div>
</body>

Note that mathjax is being loaded in init.js as follows

var script = document.createElement("script");
script.src = 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.9/MathJax.js?config=TeX-AMS_HTML-full,Safe';
script.referrerPolicy = 'no-referrer';
document.head.appendChild(script);

The global.js snippet where we're getting the error

function renderMath(mathbody, callback) {
    mathbody = LatexMath.decodeLatex(mathbody);
    if (!window.MathJax || !MathJax.Hub || !MathJax.Hub.Queue) {
        console.log('MathJax not ready yet, waiting to render math');
        setTimeout(renderMath, 10, mathbody, callback);
    } else {
        MathJax.Hub.Queue(function () {
            try {
                MathJax.Hub.Queue(["Typeset", MathJax.Hub ,"math"]);
                var mathnode = MathJax.Hub.getAllJax("math")[0];
                MathJax.Hub.Queue(["Text", mathnode, mathbody]);  // line causing the error
                if (callback) { MathJax.Hub.Queue(callback); }
            } catch (err) {
                console.trace(err);
                handleError(err.message);
            }
        });
    }
}

Technical details:

  • MathJax Version: 2.7.9
  • Client OS: Mac OS 14.4.1
  • Browser: Chrome 125.0.6422.144
@pranshujethmalani pranshujethmalani changed the title Errror: Can't make callback from given data Error: Can't make callback from given data Jun 20, 2024
@dpvc
Copy link
Member

dpvc commented Jun 21, 2024

In your code

                MathJax.Hub.Queue(["Typeset", MathJax.Hub ,"math"]);
                var mathnode = MathJax.Hub.getAllJax("math")[0];
                MathJax.Hub.Queue(["Text", mathnode, mathbody]);  // line causing the error
                if (callback) { MathJax.Hub.Queue(callback); }

you first queue a typeset action, and then try to look up the typeset math. But the queued action does not occur at the time your make the MathJax.Hub.Queue() call, but at a later time, when previously queued actions are completed. Since these lines themselves are within a queued function, the typeset call will not be made until that outer function completes, for example. So you are trying to look up the typeset math before it is typeset. That means mathnode will be null, and that is leading to the error message, since that call is asking MathJax to use mathnode.Text, and a null value doesn't have a Text property.

You need to queue your mathnode lookup as well in order to make sure it is performed after the typesetting is complete. Something like

                MathJax.Hub.Queue(
                  ["Typeset", MathJax.Hub ,"math"],
                  function () {
                    var mathnode = MathJax.Hub.getAllJax("math")[0];
                    MathJax.Hub.Queue(["Text", mathnode, mathbody]); 
                    if (callback) { MathJax.Hub.Queue(callback); }
                  }
                );

would do it. You don't need the outer queued function with the try-catch, as that will only catch an error in the outer MathJax.Hub.Queue() call in the code above, and that should not fail. You could use one in the function() here, but it might be better to test if mathnode is defined and report an error yourself rather than let the next MathJax.Hub.Queue() call to fail.

Finally, if this is code you are writing new, it might be better to use MathJax v3 than the much older v2. MathJax v3 is faster, and uses a more modern API (based on promises rather than MathJax v2's custom queues and callbacks).

@dpvc dpvc added Expected Behavior This is how MathJax works v2 labels Jun 21, 2024
@pranshujethmalani
Copy link
Author

Hey @dpvc, thanks for responding. As of now it's legacy code that we're trying to maintain as we're not yet planning to migrate to MathJax 3 since that would require considerable effort. I tried what you suggested & that solved the issue. Thanks again!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Expected Behavior This is how MathJax works v2
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@dpvc @pranshujethmalani