Refactor TODO tests a bit

muvic08 · May 9, 2013 · 0fd599a · 0fd599a
1 parent 5d8f724
commit 0fd599a
Show file tree

Hide file tree

Showing 6 changed files with 123 additions and 29 deletions.
diff --git a/Makefile b/Makefile
@@ -2,4 +2,4 @@
 default: test
 
 test:
-	ROOTDIR=`pwd` casperjs test tests/
+	casperjs test tests/
diff --git a/angularFire.js b/angularFire.js
@@ -124,7 +124,7 @@ angular.module('firebase').factory('angularFireCollection', ['$timeout', functio
     function getIndex(prevId) {
       return prevId ? indexes[prevId] + 1 : 0;
     }
-    
+
     function addChild(index, item) {
       indexes[item.$id] = index;
       collection.splice(index, 0, item);
@@ -185,7 +185,7 @@ angular.module('firebase').factory('angularFireCollection', ['$timeout', functio
         var index = indexes[data.name()];
         var newIndex = getIndex(prevId);
         var item = new angularFireItem(data, index);
-        
+
         updateChild(index, item);
         if (newIndex !== index) {
           moveChild(index, newIndex, item);

diff --git a/tests/test_chat.html b/tests/test_chat.html
@@ -2,7 +2,7 @@
 <html lang="en" ng-app="chat">
 <head>
   <meta charset="UTF-8">
-  <title>AngularFire Chat Demo</title>
+  <title>AngularFire Chat Test</title>
   <link rel="stylesheet" type="text/css" href="https://www.firebase.com/css/example.css">
   <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.3/angular.min.js"></script>
   <script src="https://cdn.firebase.com/v0/firebase.js"></script>
@@ -39,15 +39,9 @@
       _scope = $scope;
     }
     function testIfInDOM(from, content, node) {
-      if (node.childNodes.length != 5) {
-        return false;
-      }
-      if (node.childNodes[1].innerHTML != from + ": ") {
-        return false;
-      }
-      if (node.childNodes[3].innerHTML != content) {
-        return false;
-      }
+      if (node.childNodes.length != 5) return false;
+      if (node.childNodes[1].innerHTML != from + ": ") return false;
+      if (node.childNodes[3].innerHTML != content) return false;
       return true;
     }
   </script>

diff --git a/tests/test_chat.js b/tests/test_chat.js
@@ -1,20 +1,15 @@
 
-var system = require("system");
-
 casper.test.comment("Testing Chat example with angularFireCollection");
 
 casper.start("tests/test_chat.html", function() {
   // Sanity test for the environment.
-  this.test.assertTitle("AngularFire Chat Demo");
-  this.test.assertEval(function() {
-    return Firebase ? true : false;
-  }, "Firebase exists");
+  this.test.assertTitle("AngularFire Chat Test");
   this.test.assertEval(function() {
-    return AngularFire ? true : false;
+    if (!Firebase) return false;
+    if (!AngularFire) return false;
+    if (!_scope) return false;
+    return true;
   }, "AngularFire exists");
-  this.test.assertEval(function() {
-    return _scope ? true : false;
-  }, "Angular scope exists");
 });
 
 casper.thenEvaluate(function() {
@@ -98,5 +93,5 @@ casper.then(function() {
 });
 
 casper.run(function() {
-  this.test.done(9);
+  this.test.done();
 });
diff --git a/tests/test_todo.html b/tests/test_todo.html
@@ -0,0 +1,70 @@
+<!doctype html>
+<html lang="en" ng-app="todo">
+<head>
+  <meta charset="UTF-8">
+  <title>AngularFire TODO Test</title>
+  <link rel="stylesheet" type="text/css" href="https://www.firebase.com/css/example.css">
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.3/angular.min.js"></script>
+  <script src="https://cdn.firebase.com/v0/firebase.js"></script>
+  <script src="../angularFire.js"></script>
+  <style>
+    #new-todo {
+      width: 100%;
+      margin: 10px;
+    }
+    .edit {
+      width: 75%;
+    }
+  </style>
+</head>
+<body ng-controller="Todo">
+  <p></p>
+  <form id="todo-form" ng-submit="addTodo()">
+    <input id="new-todo" placeholder="What needs to be done?" ng-model="newTodo" autofocus>
+  </form>
+  <div id="messagesDiv" style="height:500px;">
+    <div ng-cloak ng-repeat="todo in todos">
+      <div class="todoView">
+        <input class="toggle" type="checkbox" ng-model="todo.completed"/>
+        <input class="edit" ng-model="todo.title"/>
+        <button ng-click="removeTodo(todo)">Remove</button>
+      </div>
+    </div>
+  </div>
+  <script type="text/javascript">
+    var _scope = null;
+    var _url = 'https://angularFireTests.firebaseio-demo.com/todo';
+
+    angular.module("todo", ["firebase"]);
+    function Todo($scope, angularFire) {
+      _scope = $scope;
+
+      $scope.newTodo = '';
+      $scope.editedTodo = null;
+
+      angularFire(_url, $scope, 'todos').then(function() {
+        $scope.addTodo = function() {
+          if (!$scope.newTodo.length) {
+            return;
+          }
+          $scope.todos.push({
+            title: $scope.newTodo,
+            completed: false
+          });
+          $scope.newTodo = '';
+        };
+        $scope.removeTodo = function(todo) {
+          $scope.todos.splice($scope.todos.indexOf(todo), 1);
+        };
+      });
+    }
+
+    function testIfInDOM(todo, node) {
+      if (node.childNodes.length != 7) return false;
+      if (node.childNodes[1].check != todo.completed) return false;
+      if (node.childNodes[3].value != todo.title) return false;
+      return true;
+    }
+  </script>
+</body>
+</html>
diff --git a/tests/test_todo.js b/tests/test_todo.js
@@ -1,12 +1,47 @@
 
-var system = require('system');
+casper.test.comment("Testing TODO example with implicit sync angularFire");
 
-casper.test.comment('Testing TODO example with implicit sync angularFire');
+casper.start("tests/test_todo.html", function() {
+  // Sanity test for environment.
+  this.test.assertTitle("AngularFire TODO Test");
+  this.test.assertEval(function() {
+    if (!Firebase) return false;
+    if (!AngularFire) return false;
+    if (!_scope) return false;
+    return true;
+  }, "AngularFire exists");
+});
+
+casper.thenEvaluate(function() {
+  // Clean up Firebase to start fresh test.
+  var fbRef = new Firebase(_url);
+  fbRef.set(null, function(err) {
+    window.__flag = true;
+  });
+});
 
-casper.start('file://' + system.env['ROOTDIR'] + '/examples/todomvc/index.html', function() {
-  this.test.assertTitle('AngularJS • TodoMVC');
+/*
+casper.then(function() {
+  var _testTodo = {
+    completed: false,
+    title: "Eat some Chocolate"
+  };
+
+  this.test.assertEval(function(todo) {
+    _scope.newTodo = todo;
+    _scope.addTodo();
+    return _scope.newTodo == "";
+  }, "Adding a new TODO", _testTodo);
+
+  this.waitForSelector(".todoView", function() {
+    this.test.assertEval(function(todo) {
+      return testIfInDOM(todo, document.querySelector(".todoView"));
+    }, "Testing if TODO is in the DOM", _testTodo);
+  });
 });
+*/
 
 casper.run(function() {
-  this.test.done(1);
+  this.test.done();
 });
+