diff --git a/src/components/tabs/js/tabsDummyWrapperDirective.js b/src/components/tabs/js/tabsDummyWrapperDirective.js index 253d707a33..aaed701e03 100644 --- a/src/components/tabs/js/tabsDummyWrapperDirective.js +++ b/src/components/tabs/js/tabsDummyWrapperDirective.js @@ -6,38 +6,49 @@ angular * @private * * @param $mdUtil + * @param $window * @returns {{require: string, link: link}} * @constructor - * + * * @ngInject */ -function MdTabsDummyWrapper ($mdUtil) { +function MdTabsDummyWrapper ($mdUtil, $window) { return { require: '^?mdTabs', link: function link (scope, element, attr, ctrl) { if (!ctrl) return; - var observer = new MutationObserver(function(mutations) { + var observer; + var disconnect; + + var mutationCallback = function() { ctrl.updatePagination(); ctrl.updateInkBarStyles(); - }); - - var config = { - childList: true, - subtree: true, - // Per https://bugzilla.mozilla.org/show_bug.cgi?id=1138368, browsers will not fire - // the childList mutation, once a element's innerText changes. - // The characterData of the element will change. - characterData: true }; - observer.observe(element[0], config); + if('MutationObserver' in $window) { + var config = { + childList: true, + subtree: true, + // Per https://bugzilla.mozilla.org/show_bug.cgi?id=1138368, browsers will not fire + // the childList mutation, once a element's innerText changes. + // The characterData of the element will change. + characterData: true + }; + + observer = new MutationObserver(mutationCallback); + observer.observe(element[0], config); + disconnect = observer.disconnect.bind(observer); + } else { + var debounced = $mdUtil.debounce(mutationCallback, 15, null, false); + + element.on('DOMSubtreeModified', debounced); + disconnect = element.off.bind(element, 'DOMSubtreeModified', debounced); + } // Disconnect the observer scope.$on('$destroy', function() { - if (observer) { - observer.disconnect(); - } + disconnect(); }); } };