FIX: user-card tests

app/assets/stylesheets/desktop/user-card.scss

@@ -3,7 +3,8 @@
 #user-card {
   position: absolute;
   width: 500px;
-  left: 20px;
+  left: -9999px;
+  top: -9999px;
   z-index: 990;
   box-shadow: 0 2px 6px rgba(0,0,0,.6);
   margin-top: -2px;

test/javascripts/helpers/assertions.js

@@ -1,5 +1,5 @@
-/* exported exists, count, present, blank, containsInstance, not */
-// Test helpers
+/* exported exists, count, present, blank, containsInstance, not, visible */
+
 function exists(selector) {
   return !!count(selector);
 }
@@ -23,3 +23,14 @@ function containsInstance(collection, klass, text) {
 function not(state, message) {
   ok(!state, message);
 }
+
+function visible(selector) {
+  return find(selector + ":visible").length > 0;
+}
+
+function invisible(selector) {
+  var $items = find(selector + ":visible");
+  return $items.length === 0 ||
+         $items.css("opacity") === "0" ||
+         $items.css("visibility") === "hidden";
+}

test/javascripts/integration/user-card-test.js.es6

@@ -3,12 +3,11 @@ integration("User Card");
 test("card", function() {
   visit('/');
 
-  // will fix
-  // ok(find('#user-card:visible').length === 0, 'user card is invisible by default');
+  ok(invisible('#user-card'), 'user card is invisible by default');
   click('a[data-user-card=eviltrout]:first');
 
   andThen(function() {
-    ok(find('#user-card:visible').length === 1, 'card should appear');
+    ok(visible('#user-card'), 'card should appear');
   });
 
 });