Search code examples
javascriptinternet-explorersyntax-errormutation-observers

MutationObserver syntax error on IE 11


I'm working with a MutationObserver to change the values of some variables when I switch the content of a panel (I'm useing Bootstrap tabs). Everything is working just fine in Chrome and Firefox, but for some reason, when I test it with IE, it shows a syntax error in the console and the script breaks. This is my MutationObserver code:

var observer = new MutationObserver(function (MutationRecords, MutationObserver) {
        dataTable = null;
        tabla = null;
        tabActiva = $('.tab-content').find('.active');
        formFiltro = tabActiva.find('form');
        tabla = tabActiva.find('table');
    });

    observer.observe(target, {
        childList: true,
        attributeFilter: ['class'],
        subtree: true
    });

Console points the error is on the observer.observe(). I don't know what's happening. Thanks in advance.

enter image description here

Just in case, this is my "target":

var target = $('.tab-content > .tab-pane').get(0);

Solution

  • With a MutationObserver, it's possible to filter attributes, but only if you are observing element attributes to begin with. Therefore the option attributeFilter is only applicable if attributes is set to true.

    If you specify an attributeFilter without setting attributes to true, then IE11 will throw a syntax error, while Chrome and Firefox will just silently ignore attributeFilter.

    To resolve the syntax error, either set attributes to true or remove the attributeFilter.