fix quiz to not pass for top, bottom, and right padding

udacity · Jul 20, 2016 · 7a42355 · 7a42355
1 parent 93b8788
commit 7a42355
Show file tree

Hide file tree

Showing 5 changed files with 65 additions and 5 deletions.
diff --git a/lessons/L5/problem-set/04-text-align-with-cheetahs/index.html b/lessons/L5/problem-set/04-text-align-with-cheetahs/index.html
@@ -4,7 +4,7 @@
 	<meta charset="utf-8">
 	<title>Text-align with Cheetahs</title>
 	<link href="css/styles.css" rel="stylesheet">
-	<meta name="udacity-grader" content="http://udacity.github.io/fend/lessons/L5/problem-set/04-text-align-with-cheetahs/tests.json">
+	<meta name="udacity-grader" content="http://udacity.github.io/fend/lessons/L5/problem-set/04-text-align-with-cheetahs/tests.json" unit-tests="js/tests.js">
 </head>
 <body>
 	<div class="one">
@@ -25,4 +25,5 @@
 		<p>League yo-ho-ho aft Chain Shot to go on account chase guns lanyard clap of thunder Jack Tar Shiver me timbers. Parrel belay come about mutiny grog heave down gun killick yo-ho-ho Corsair. Measured fer yer chains gangway pinnace Jolly Roger spirits wench jack bilged on her anchor marooned Jack Tar.</p>
 	</div>
 </body>
+<script type="text/javascript" src="js/jquery-3.0.0.min.js"></script>
 </html>
diff --git a/lessons/L5/problem-set/04-text-align-with-cheetahs/js/jquery-3.0.0.min.js b/lessons/L5/problem-set/04-text-align-with-cheetahs/js/jquery-3.0.0.min.js
diff --git a/lessons/L5/problem-set/04-text-align-with-cheetahs/js/tests.js b/lessons/L5/problem-set/04-text-align-with-cheetahs/js/tests.js
@@ -0,0 +1,55 @@
+(function(window) {
+
+	var tests = [];
+
+	var test1 = function() {
+		var _isCorrect = false;
+
+		// get padding
+		var paddingTop = $(".floated-image").css('padding-top');
+		var paddingBottom = $(".floated-image").css('padding-bottom');
+		var paddingLeft = $(".floated-image").css('padding-left');
+		var paddingRight = $(".floated-image").css('padding-right');
+
+		if(paddingTop === "0px" && paddingBottom === "0px" && paddingRight === "0px") {
+			if(paddingLeft === "21px") {
+				window.dispatchEvent(new CustomEvent('custom-event-1', {'detail': 'passed'}));
+			}
+		}
+
+		return _isCorrect;
+  	};
+
+	tests.push(test1);
+
+	var isCorrect = false;
+
+	function executeTests() {
+		var isCorrect = false;
+
+		tests.forEach(function(test, index) {
+			var testCorrect = test();
+			if (index === 0) {
+				isCorrect = testCorrect;
+			} else {
+				isCorrect = isCorrect && testCorrect;
+			}
+			if (testCorrect) {
+				// to prevent unnecessary event firings
+				test = function() {};
+			}
+		});
+
+		return isCorrect;
+	}
+
+	isCorrect = executeTests();
+
+	var interval = window.setInterval(function() {
+		if (!isCorrect) {
+	  		isCorrect = executeTests();
+		} else {
+	  		window.clearInterval(interval);
+		}
+	}, 1000);
+})(window);
diff --git a/lessons/L5/problem-set/04-text-align-with-cheetahs/original.html b/lessons/L5/problem-set/04-text-align-with-cheetahs/original.html
@@ -5,7 +5,7 @@
 	<title>Text-align with Cheetahs</title>
 	<link href="css/styles.css" rel="stylesheet">
 	<link href="css/answer.css" rel="stylesheet">
-	<meta name="udacity-grader" content="http://udacity.github.io/fend/lessons/L5/problem-set/04-text-align-with-cheetahs/tests.json">
+	<meta name="udacity-grader" content="http://udacity.github.io/fend/lessons/L5/problem-set/04-text-align-with-cheetahs/tests.json" unit-tests="js/tests.js">
 </head>
 <body>
 	<div class="one left">
@@ -26,4 +26,5 @@
 		<p>League yo-ho-ho aft Chain Shot to go on account chase guns lanyard clap of thunder Jack Tar Shiver me timbers. Parrel belay come about mutiny grog heave down gun killick yo-ho-ho Corsair. Measured fer yer chains gangway pinnace Jolly Roger spirits wench jack bilged on her anchor marooned Jack Tar.</p>
 	</div>
 </body>
+<script type="text/javascript" src="js/jquery-3.0.0.min.js"></script>
 </html>
diff --git a/lessons/L5/problem-set/04-text-align-with-cheetahs/tests.json b/lessons/L5/problem-set/04-text-align-with-cheetahs/tests.json
@@ -53,9 +53,8 @@
     {
       "description": "The img in .five has the correct left padding",
       "definition": {
-        "nodes": ".floated-image",
-        "cssProperty": "paddingLeft",
-        "equals": "21px"
+        "waitForEvent": "custom-event-1",
+        "exists": true
       }
     }
   ]