.hasOwnProperty('getComputedStyle') false in IE 11

Question

So I did a little work on a colour picker module adding the ability to parse human readable colours. I leveraged .getComputedStyle() to perform the conversion.

I implemented detection of the feature (should be IE 9+) with:

window.hasOwnProperty('getComputedStyle')

This is when I noticed some strange behavior. In Chrome and FF this reported true as expected. However in IE 11 (which does support it) it reported false.

I'm a little stumped as to why this is happening. I've performed other ways of checking its support. I'm stumped however as to why IE reports false whilst it does support it.

Not too sure if this is overkill but this fiddle simply logs the response so you can see for yourself. https://jsfiddle.net/xrgrgrhe/

Answer 1

Don't perform feature detection in this way; browsers aren't always consistent about where certain properties and methods are defined on the prototype chain. Instead, simply access the property:

if ( window.getComputedStyle ) {
    /* Proceed to use window.getComputedStyle */
}

Functions are truthy, while undefined is falsy. As a result, this test will pass if the method is defined anywhere on the prototype, rather than directly on the Window instance object.

For what it's worth, the original test in the question also returns true in Microsoft Edge.