Safari bug - Object.hasOwnProperty(HTMLElement.prototype, “style”) is…

… false
intercellular · Jul 9, 2017 · dcbc5ab · dcbc5ab
1 parent 746e39d
commit dcbc5ab
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 8 deletions.
diff --git a/cell.js b/cell.js
@@ -199,6 +199,9 @@
       Phenotype.$init($node);
     },
     multiline: function(fn) { return /\/\*!?(?:@preserve)?[ \t]*(?:\r\n|\n)([\s\S]*?)(?:\r\n|\n)[ \t]*\*\//.exec(fn.toString())[1]; },
+    get: function(key) {
+      return Object.getOwnPropertyDescriptor($root.HTMLElement.prototype, key) || Object.getOwnPropertyDescriptor($root.Element.prototype, key);
+    },
     set: function($node, key, val) {
       if (key[0] === '$') {
         if (key === '$type') {
@@ -224,13 +227,13 @@
       } else if (key === 'value') {
         $node[key] = val;
       } else if (key === 'style' && typeof val === 'object') {
-        var CSSStyleDeclaration = Object.getOwnPropertyDescriptor($root.HTMLElement.prototype, key).get.call($node);
+        var CSSStyleDeclaration = Phenotype.get(key).get.call($node);
         for (var attr in val) { CSSStyleDeclaration[attr] = val[attr]; }
       } else if (typeof val === 'number' || typeof val === 'string' || typeof val === 'boolean') {
         if ($node.setAttribute) $node.setAttribute(key, val);
       } else if (typeof val === 'function') {
         // For natively supported HTMLElement.prototype methods such as onclick()
-        var prop = Object.getOwnPropertyDescriptor($root.HTMLElement.prototype, key);
+        var prop = Phenotype.get(key);
         if (prop) prop.set.call($node, val);
       }
     },
@@ -352,7 +355,7 @@
               // The "value" attribute needs a special treatment.
               return Object.getOwnPropertyDescriptor(Object.getPrototypeOf($node), key).get.call($node);
             } else if (key === 'style') {
-              return Object.getOwnPropertyDescriptor($root.HTMLElement.prototype, key).get.call($node);
+              return Phenotype.get(key).get.call($node);
             } else if (key in $node.Genotype) {
               // Otherwise utilize Genotype
               return $node.Genotype[key];
@@ -361,7 +364,7 @@
               // For example, there are many DOM attributes such as "tagName" that come with the node by default.
               // These are not something we directly define on a gene object, but we still need to be able to access them..
               // In this case we just use the native HTMLElement.prototype accessor
-              return Object.getOwnPropertyDescriptor($root.HTMLElement.prototype, key).get.call($node);
+              return Phenotype.get(key).get.call($node);
             }
           }
         },
@@ -385,11 +388,11 @@
             if (key === 'value') {
               return Object.getOwnPropertyDescriptor(Object.getPrototypeOf($node), key).set.call($node, val);
             } else if (key === 'style' && typeof val === 'object') {
-              Object.getOwnPropertyDescriptor($root.HTMLElement.prototype, key).set.call($node, val);
+              Phenotype.get(key).set.call($node, val);
             } else if (typeof val === 'number' || typeof val === 'string' || typeof val === 'boolean') {
               $node.setAttribute(key, val);
             } else if (typeof val === 'function') {
-              Object.getOwnPropertyDescriptor($root.HTMLElement.prototype, key).set.call($node, val);
+              Phenotype.get(key).set.call($node, val);
             }
           }
         },

diff --git a/test/Phenotype.js b/test/Phenotype.js
@@ -551,7 +551,7 @@ describe("Phenotype", function() {
 
         // After
         compare($node.getAttribute("onclick"), null) // Doesn't exist as a DOM attribute
-        compare(spy.O.getOwnPropertyDescriptor.callCount, 1);
+        compare(spy.O.getOwnPropertyDescriptor.callCount, 1); // tries once for HTMLElement and finds onclick so only one time trial.
 
 
         // NON HTMLElement method set
@@ -560,7 +560,7 @@ describe("Phenotype", function() {
           return "fun " + arg;
         })
         compare($node.getAttribute("fun"), null) // Doesn't exist as a DOM attribute
-        compare(spy.O.getOwnPropertyDescriptor.callCount, 1);
+        compare(spy.O.getOwnPropertyDescriptor.callCount, 2); // tries both for HTMLElement and Element, because `fun` doesn't exist.
 
       })
     })