diff --git a/src/core/core.helpers.js b/src/core/core.helpers.js index 5364d191f8e..8609acdd09d 100644 --- a/src/core/core.helpers.js +++ b/src/core/core.helpers.js @@ -958,38 +958,32 @@ module.exports = function(Chart) { }; helpers.addResizeListener = function(node, callback) { // Hide an iframe before the node - var hiddenIframe = document.createElement('iframe'); - var hiddenIframeClass = 'chartjs-hidden-iframe'; - - if (hiddenIframe.classlist) { - // can use classlist - hiddenIframe.classlist.add(hiddenIframeClass); - } else { - hiddenIframe.setAttribute('class', hiddenIframeClass); - } - - // Set the style - hiddenIframe.tabIndex = -1; - var style = hiddenIframe.style; - style.width = '100%'; - style.display = 'block'; - style.border = 0; - style.height = 0; - style.margin = 0; - style.position = 'absolute'; - style.left = 0; - style.right = 0; - style.top = 0; - style.bottom = 0; + var iframe = document.createElement('iframe'); + + iframe.className = 'chartjs-hidden-iframe'; + iframe.style.cssText = + 'display:block;'+ + 'overflow:hidden;'+ + 'border:0;'+ + 'margin:0;'+ + 'top:0;'+ + 'left:0;'+ + 'bottom:0;'+ + 'right:0;'+ + 'height:100%;'+ + 'width:100%;'+ + 'position:absolute;'+ + 'pointer-events:none;'+ + 'z-index:-1;'; + + // Prevent the iframe to gain focus on tab. + // https://github.com/chartjs/Chart.js/issues/3090 + iframe.tabIndex = -1; // Insert the iframe so that contentWindow is available - node.insertBefore(hiddenIframe, node.firstChild); + node.insertBefore(iframe, node.firstChild); - (hiddenIframe.contentWindow || hiddenIframe).onresize = function() { - if (callback) { - return callback(); - } - }; + this.addEvent(iframe.contentWindow || iframe, 'resize', callback); }; helpers.removeResizeListener = function(node) { var hiddenIframe = node.querySelector('.chartjs-hidden-iframe');