Add nextElementSibling and previousElementSibling polyfills (#484)

* Add Element.prototype.nextElementSibling polyfill

* Add Element.prototype.previousElementSibling polyfill

* fix linting issues

* use the original previousElementSibling tests

Co-authored-by: Jake Champion <me@jakechampion.name>

polyfills/Element/prototype/nextElementSibling/config.toml

@@ -0,0 +1,25 @@
+aliases = [ ]
+dependencies = [
+  "Element",
+  "Object.defineProperty"
+]
+license = "MIT"
+docs = "https://developer.mozilla.org/en-US/docs/Web/API/NonDocumentTypeChildNode/nextElementSibling"
+
+[browsers]
+# android = "all versions natively support this feature"
+# bb = "Not on MDN"
+chrome = "<4"
+edge = "<12"
+# edge_mob = "Not on MDN"
+firefox = "<3.5"
+# ios_chr = "Not on MDN"
+# ios_saf = "all versions natively support this feature"
+ie = "<9"
+# ie_mob = "Not on MDN"
+opera = "<10"
+# op_mini = "Not on MDN"
+op_mob = "<10.1"
+safari = "<4"
+firefox_mob = "<4"
+# samsung_mob = "all versions natively support this feature"

polyfills/Element/prototype/nextElementSibling/detect.js

@@ -0,0 +1 @@
+'document' in self && "nextElementSibling" in document.documentElement

polyfills/Element/prototype/nextElementSibling/polyfill.js

@@ -0,0 +1,7 @@
+Object.defineProperty(Element.prototype, "nextElementSibling", {
+	get: function(){
+		var el = this.nextSibling;
+		while (el && el.nodeType !== 1) { el = el.nextSibling; }
+		return el;
+	}
+});

polyfills/Element/prototype/nextElementSibling/tests.js

@@ -0,0 +1,48 @@
+/* eslint-env mocha, browser */
+/* global proclaim */
+
+it("should return null if the node is the only child of its parent node", function () {
+  var parent = document.createElement('div'),
+      p = document.createElement('p');
+  parent.appendChild(p);
+
+  proclaim.strictEqual(p.nextElementSibling, null);
+});
+
+it("should return null if the node only has text sibling", function () {
+  var parent = document.createElement('div'),
+      p = document.createElement('p'),
+      text = document.createTextNode('Hi there, how are you doing today?');
+  parent.appendChild(p);
+  parent.appendChild(text);
+
+  proclaim.strictEqual(p.nextElementSibling, null);
+});
+
+it("should return null if the node only has comment sibling", function () {
+  var parent = document.createElement('div'),
+      p = document.createElement('p'),
+      comment = document.createComment('This is a comment in the document.');
+  parent.appendChild(p);
+  parent.appendChild(comment);
+
+  proclaim.strictEqual(p.nextElementSibling, null);
+});
+
+it("should return the first child element", function () {
+  var parent = document.createElement('div'),
+      h2 = document.createElement('h2'),
+      p1 = document.createElement('p'),
+      p2 = document.createElement('p'),
+      p3 = document.createElement('p'),
+      text = document.createTextNode('Hi there, how are you doing today?'),
+      comment = document.createComment('This is a comment in the document.');
+  parent.appendChild(h2);
+  parent.appendChild(text);
+  parent.appendChild(comment);
+  parent.appendChild(p1);
+  parent.appendChild(p2);
+  parent.appendChild(p3);
+
+  proclaim.strictEqual(h2.nextElementSibling, p1);
+});

polyfills/Element/prototype/previousElementSibling/config.toml

@@ -0,0 +1,25 @@
+aliases = [ ]
+dependencies = [
+  "Element",
+  "Object.defineProperty"
+]
+license = "MIT"
+docs = "https://developer.mozilla.org/en-US/docs/Web/API/NonDocumentTypeChildNode/previousElementSibling"
+
+[browsers]
+# android = "all versions natively support this feature"
+# bb = "Not on MDN"
+chrome = "<4"
+edge = "<12"
+# edge_mob = "Not on MDN"
+firefox = "<3.5"
+# ios_chr = "Not on MDN"
+# ios_saf = "all versions natively support this feature"
+ie = "<9"
+# ie_mob = "Not on MDN"
+opera = "<10"
+# op_mini = "Not on MDN"
+op_mob = "<10.1"
+safari = "<4"
+firefox_mob = "<4"
+# samsung_mob = "all versions natively support this feature"

polyfills/Element/prototype/previousElementSibling/detect.js

@@ -0,0 +1 @@
+'document' in self && "previousElementSibling" in document.documentElement

polyfills/Element/prototype/previousElementSibling/polyfill.js

@@ -0,0 +1,7 @@
+Object.defineProperty(Element.prototype, 'previousElementSibling', {
+	get: function(){
+		var el = this.previousSibling;
+		while (el && el.nodeType !== 1) { el = el.previousSibling; }
+		return el;
+	}
+});

polyfills/Element/prototype/previousElementSibling/tests.js

@@ -0,0 +1,48 @@
+/* eslint-env mocha, browser */
+/* global proclaim */
+
+it("should return null if the node is the only child of its parent node", function () {
+  var parent = document.createElement('div'),
+      p = document.createElement('p');
+  parent.appendChild(p);
+
+  proclaim.strictEqual(p.previousElementSibling, null);
+});
+
+it("should return null if the node only has text sibling", function () {
+  var parent = document.createElement('div'),
+      p = document.createElement('p'),
+      text = document.createTextNode('Hi there, how are you doing today?');
+  parent.appendChild(text);
+  parent.appendChild(p);
+
+  proclaim.strictEqual(p.previousElementSibling, null);
+});
+
+it("should return null if the node only has comment sibling", function () {
+  var parent = document.createElement('div'),
+      p = document.createElement('p'),
+      comment = document.createComment('This is a comment in the document.');
+  parent.appendChild(comment);
+  parent.appendChild(p);
+
+  proclaim.strictEqual(p.previousElementSibling, null);
+});
+
+it("should return the first child element", function () {
+  var parent = document.createElement('div'),
+      h2 = document.createElement('h2'),
+      p1 = document.createElement('p'),
+      p2 = document.createElement('p'),
+      p3 = document.createElement('p'),
+      text = document.createTextNode('Hi there, how are you doing today?'),
+      comment = document.createComment('This is a comment in the document.');
+  parent.appendChild(h2);
+  parent.appendChild(p1);
+  parent.appendChild(p2);
+  parent.appendChild(text);
+  parent.appendChild(comment);
+  parent.appendChild(p3);
+
+  proclaim.strictEqual(p3.previousElementSibling, p2);
+});