Kashyap Jariwala
Kashyap Jariwala

Reputation: 13

how to fix TypeError: window.getComputedStyle(...) is null in firefox?

I am using zepto for drag and swap it works perfectly in chrome but showing error in firefox. Below is the section of the script of dragswap in which it is showing error. Please help. Thanks in advance

 `; (function ($) {
        $.fn.dragswap = function (options) {
            var dragSrcEl;
            function getPrefix() {
                var el = document.createElement('p'),
                getPre, transforms = {
                    'webkitAnimation': '-webkit-animation',
                    'OAnimation': '-o-animation',
                    'msAnimation': '-ms-animation',
                    'MozAnimation': '-moz-animation',
                    'animation': 'animation'
                };
                document.body.insertBefore(el, null);
                for (var t in transforms) {
                    if (el.style[t] !== undefined) {
                        el.style[t] = "translate3d(1px,1px,1px)";
                        // if(window.getComputedStyle && (style = window.getComputedStyle(element, null)) !== null) 
                             getPre = window.getComputedStyle(el).getPropertyValue(transforms[t]);
                        // return the successful prefix
                        return t;
                    }
                }

                document.body.removeChild(el);

            }

Upvotes: 1

Views: 5105

Answers (1)

Jack senior
Jack senior

Reputation: 176

Firefox has a bug in which if the element is "display: none" then window.getComputedStyles will return null.

The below is where I found this knowledge which fixed the error in my third-party code. Note In my case the element was also an iFrame https://github.com/marcj/css-element-queries/issues/148

Upvotes: 6

Related Questions