Add javascript backup if pointer-event is not supported by browser

(STUD-1498)

common/static/js/spec/CSS3_workarounds_spec.js

@@ -0,0 +1,40 @@
+describe("CSS3 workarounds", function() {
+	describe("pointer-events", function() {
+		beforeEach(function() {
+			var html = "<a href='#' class='ui-disabled'>What wondrous life in this I lead</a>";
+			setFixtures(html);
+		});
+
+		it("should not prevent default when pointerEvents is supported", function() {
+			// In case this test suite is being run in a browser where
+			// 'pointerEvents' is not supported, mock out document.body.style
+			// so that it includes 'pointerEvents'
+			var mockBodyStyle = document.body.style;
+			if (!("pointerEvents" in mockBodyStyle)) {
+				mockBodyStyle["pointerEvents"] = "";
+			};
+
+			pointerEventsNone(".ui-disabled", mockBodyStyle);
+			spyOnEvent(".ui-disabled", "click");
+			$(".ui-disabled").click();
+			expect("click").not.toHaveBeenPreventedOn(".ui-disabled");
+		});
+
+		it("should prevent default when pointerEvents is not Supported", function() {
+			// mock document.body.style so it does not include 'pointerEvents'
+			var mockBodyStyle = {},
+			    bodyStyleKeys = Object.keys(document.body.style);
+			for (var index = 0; index < bodyStyleKeys.length; index++) {
+				var key = bodyStyleKeys[index];
+				if (key !== "pointerEvents") {
+					mockBodyStyle[key] = document.body.style[key];
+				};
+			};
+
+			pointerEventsNone(".ui-disabled", mockBodyStyle);
+			spyOnEvent(".ui-disabled", "click");
+			$(".ui-disabled").click();
+			expect("click").toHaveBeenPreventedOn(".ui-disabled");
+		});
+	});
+});

common/static/js/src/CSS3_workarounds.js

@@ -0,0 +1,17 @@
+// A file for JS workarounds for CSS3 features that are not
+// supported in older browsers
+
+var pointerEventsNone = function (selector, supportedStyles) {
+	// Check to see if the brower supports 'pointer-events' css rule.
+	// If it doesn't, use javascript to stop the link from working
+	// when clicked.
+	$(selector).click(function (event) {
+		if (!('pointerEvents' in supportedStyles)) {
+			event.preventDefault();
+		};
+	});
+};
+
+$(function () {
+	pointerEventsNone('.ui-disabled', document.body.styles);
+});