Fix for IE9's style.setProperty.

IE9 does not string-coerce values, instead throwing an error. We now wrap IE9's implementation to force string coercion. While it would be simpler to turn on string-coercion for all browsers inside D3's style operator, this approach avoids penalizing standards-compliant browsers. This commit also moves language-compatibility code to a separate directory, and deletes the obsolete Object.create polyfill, which is no longer needed by D3.
koolc · Aug 29, 2011 · c2e3735 · c2e3735
1 parent cd135d5
commit c2e3735
Show file tree

Hide file tree

Showing 8 changed files with 28 additions and 19 deletions.
diff --git a/Makefile b/Makefile
@@ -36,9 +36,9 @@ d3.custom.js: \
 	src/end.js
 
 d3.core.js: \
+	src/compat/date.js \
+	src/compat/style.js \
 	src/core/core.js \
-	src/core/date.js \
-	src/core/object.js \
 	src/core/array.js \
 	src/core/this.js \
 	src/core/functor.js \

diff --git a/d3.js b/d3.js
@@ -1,12 +1,16 @@
-(function(){d3 = {version: "2.0.4"}; // semver
-if (!Date.now) Date.now = function() {
+(function(){if (!Date.now) Date.now = function() {
   return +new Date;
 };
-if (!Object.create) Object.create = function(o) {
-  /** @constructor */ function f() {}
-  f.prototype = o;
-  return new f;
-};
+try {
+  document.createElement("div").style.setProperty("opacity", 0, "");
+} catch (error) {
+  var d3_style_prototype = CSSStyleDeclaration.prototype,
+      d3_style_setProperty = d3_style_prototype.setProperty;
+  d3_style_prototype.setProperty = function(name, value, priority) {
+    d3_style_setProperty.call(this, name, value + "", priority);
+  };
+}
+d3 = {version: "2.0.4"}; // semver
 var d3_arraySubclass = [].__proto__?
 
 // Until ECMAScript supports array subclassing, prototype injection works well.

diff --git a/d3.min.js b/d3.min.js
diff --git a/src/core/date.js → src/compat/date.js b/src/core/date.js → src/compat/date.js
diff --git a/src/compat/style.js b/src/compat/style.js
@@ -0,0 +1,9 @@
+try {
+  document.createElement("div").style.setProperty("opacity", 0, "");
+} catch (error) {
+  var d3_style_prototype = CSSStyleDeclaration.prototype,
+      d3_style_setProperty = d3_style_prototype.setProperty;
+  d3_style_prototype.setProperty = function(name, value, priority) {
+    d3_style_setProperty.call(this, name, value + "", priority);
+  };
+}
diff --git a/src/core/object.js b/src/core/object.js
diff --git a/test/core/selection-style-test.js b/test/core/selection-style-test.js
@@ -17,7 +17,7 @@ suite.addBatch({
     },
     "sets a property as a number": function(body) {
       body.style("opacity", .3);
-      assert.equal(document.body.style["opacity"], ".3");
+      assert.equal(document.body.style["opacity"], "0.3");
     },
     "sets a property as a function": function(body) {
       body.style("background-color", function() { return "orange"; });
@@ -57,8 +57,8 @@ suite.addBatch({
     },
     "sets a property as a number": function(div) {
       div.style("opacity", .5);
-      assert.equal(div[0][0].style["opacity"], ".5");
-      assert.equal(div[0][1].style["opacity"], ".5");
+      assert.equal(div[0][0].style["opacity"], "0.5");
+      assert.equal(div[0][1].style["opacity"], "0.5");
     },
     "sets a property as a function": function(div) {
       div.style("background-color", d3.interpolateRgb("orange", "yellow"));

diff --git a/test/env.js b/test/env.js
@@ -1,6 +1,7 @@
 document = require("jsdom").jsdom("<html><head></head><body></body></html>");
 window = document.createWindow();
 navigator = window.navigator;
+CSSStyleDeclaration = window.CSSStyleDeclaration;
 
 require("../lib/sizzle/sizzle");
 Sizzle = window.Sizzle;