Does jquery-migrate find all "errors" at load or at runtime?

Question

If I'm to upgrade jquery, and I use jquery-migrate to give me warnings on depreciated code, do I need to exercise all functions on the page to catch all things to upgrade, or is it enough to load each page and see if the console log shows errors?

I guess and hope the latter, as no script is generated on the fly or other exotic ideas to make the javascript change after loading.

Answer 1

The jquery-migrate plugins triggers a warning whenever a deprecated function is called. As such, it's necessary to test all functions on the page: simply loading the page won't show all the errors.

I whipped up a simple example that shows this:

// should be $('#test').on('click', ...
$('#test').click(function() {
    $('#test2').focus(); // should be $('#test').trigger('focus')
})

$('#test2').on('focus', function() {
    $(this).val('from js');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-migrate/3.1.0/jquery-migrate.js"></script>

<button id="test">Initial</button>
<input id="test2" />

• If you run the snippet, you'll see an error when the page loads, warning that you can't use the click shorthand (you need to use .on()).

• If you then click on the button, you'll see a new warning, saying that you can't use the focus shorthand (you need to user .trigger()).

As you can see, the second error doesn't show up when the page loads, so you need to test all your functions.