sproutcore 1.7.1.beta → 1.8.0

data/lib/frameworks/sproutcore/frameworks/foundation/tests/mixins/content_value_support/content.js

@@ -30,22 +30,21 @@ test("invoked with key = * whenever content changes", function() {
   view.set('content', content);
 });
 
-test("invoked with key = foo whenever a propery on content is changed", function() {
-  var isTesting = NO, curKey ;
+test("should not be invoked when arbitrary keys are changed", function() {
+  var isTesting = NO, count = 0;
   view.contentPropertyDidChange = function(target, key) {
     if (!isTesting) return ; //wait until testing should begin...
-    ok(target === content, 'should pass content object as target');
-    equals(key, curKey, 'should pass * as key');    
+    count++;
   };
+
   view.set('content', content);
   
   isTesting = YES ;
   
-  curKey= 'foo';
   content.set('foo', 'foo');
-  
-  curKey = 'bar';
   content.set('bar', 'bar');
+
+  equals(count, 0, "method was not invoked");
 });
 
 test("should no longer be invoked when a key is changed on a former content object", function() {
@@ -73,7 +72,7 @@ test("should fire even on a content object set when the object is created", func
   equals(callCount, 1, 'should call contentPropertyDidChange on init to do initial setup');
   
   content.set('foo', 'foo');
-  equals(callCount, 2, 'should call contentPropertyDidChange when changing content.foo');
+  equals(callCount, 1, 'should not call contentPropertyDidChange when changing content.foo');
 });
 
 // ..........................................................
@@ -166,3 +165,73 @@ test("if contentValueKey is not set & displayDelegate not set, does nothing", fu
   equals(content.get('bar'), 'bar', 'should not change');
   equals(content.get('foo'), 'foo', 'should not change');
 });
+
+// ..........................................................
+// updateContentWithValueObserver()
+// 
+module("SC.ContentValueSupport#contentKeys", {
+  setup: function() {
+    this.count = 0;
+    var self = this;
+
+    this.obj = SC.Object.create(SC.ContentValueSupport, SC.DelegateSupport, {
+      contentKeys: {'contentFooKey': 'foo'},
+      contentFooKey: 'foo',
+      content: SC.Object.create({foo: 'BAR'}),
+      contentPropertyDidChange: function(orig, target, key) {
+        equals(target, this.content, "content is target");
+        self.count++;
+
+        return orig(target, key);
+      }.enhance()
+    });
+  },
+
+  teardown: function() {
+    this.obj.destroy();
+
+    this.obj = null;
+  }
+});
+
+test("different contentKeys on creation are observed correctly", function() {
+  equals(this.count, 1, "observer was called once on init");
+
+  this.obj.content.set('foo', 'BAR2');
+
+  equals(this.count, 2, "observer was called again on set");
+
+  equals(this.obj.get('foo'), 'BAR2', "value is updated correctly");
+
+  this.obj.content.set('bar', 'ASDF');
+
+  equals(this.count, 2, "observer was not called again on setting other keys");
+});
+
+test("different contentKeys after creation are observed correctly", function() {
+  equals(this.count, 1, "observer was called once on init");
+
+  this.obj.beginPropertyChanges();
+  this.obj.set({
+    contentKeys: {'contentBarKey': 'bar'},
+    contentBarKey: 'bar'
+  });
+  this.obj.endPropertyChanges();
+
+  equals(this.count, 2, "observer was called when changing contentKeys");
+
+  this.obj.content.set('bar', 'BAR2');
+
+  equals(this.count, 3, "observer was called when changing bar");
+
+  equals(this.obj.get('bar'), 'BAR2', "value is updated correctly");
+
+  this.obj.content.set('asdfasf', 'asdfasd');
+
+  equals(this.count, 3, "observer was not called again on setting other keys");
+
+  this.obj.content.set('foo', 'asdfasd');
+
+  equals(this.count, 3, "observer was not called again on setting old observed keys");
+});
+

data/lib/frameworks/sproutcore/frameworks/foundation/tests/mixins/flowed_layout/tests.js

@@ -183,6 +183,7 @@ var checkSteps = [
 ];
 
 function checkPositions(view, positions) {
+  view.set('isVisibleInWindow', YES);
   var context = {
     position: 0,
     performNext: function(positions) {

data/lib/frameworks/sproutcore/frameworks/foundation/tests/mixins/inline_editable/beginEditing.js

@@ -62,13 +62,13 @@ view = SC.View.create(SC.InlineEditable, {
 });
 
 function reset() {
+  if(fakeEditor.isEditing) fakeEditor.discardEditing();
+
   fakeDelegate.shouldBeginCalled = NO;
   fakeDelegate.acquireEditorCalled = NO;
   fakeEditor.beginEditingCalled = NO;
   fakeDelegate.willBeginCalled = NO;
   fakeDelegate.didBeginCalled = NO;
-
-  if(fakeEditor.isEditing) fakeEditor.discardEditing();
 };
 
 module('SC.InlineEditable.beginEditing');

data/lib/frameworks/sproutcore/frameworks/foundation/tests/mixins/inline_editable/commitEditing.js

@@ -32,6 +32,7 @@ fakeDelegate = {
   inlineEditorDidCommitEditing: function() {
     this.didCommitCalled = YES;
     ok(this.willCommitCalled, "willCommit called before didCommit");
+    view._endEditing();
   }
 };
 
@@ -58,13 +59,13 @@ view = SC.View.create(SC.InlineEditable, {
 });
 
 function reset() {
+  if(fakeEditor.isEditing) fakeEditor.discardEditing();
+
   fakeDelegate.shouldCommitCalled = NO;
   fakeEditor.commitEditingCalled = NO;
 
   fakeDelegate.willCommitCalled = NO;
   fakeDelegate.didCommitCalled = NO;
-
-  if(fakeEditor.isEditing) fakeEditor.discardEditing();
 }
 
 module('SC.InlineEditable.commitEditing');
@@ -84,7 +85,7 @@ test("commitEditing should ask shouldCommit and then call commitEditing", functi
   ok(fakeDelegate.shouldCommitCalled, "shouldCommit called");
 });
 
-test("commitEditing should fail if shouldCommit returns false", function() {
+test("commitEditing should fail if shouldCommit returns NO", function() {
   reset();
 
   fakeDelegate.shouldCommitAllowed = NO;

data/lib/frameworks/sproutcore/frameworks/foundation/tests/mixins/inline_editable/discardEditing.js

@@ -32,6 +32,8 @@ fakeDelegate = {
   inlineEditorDidDiscardEditing: function() {
     this.didDiscardCalled = YES;
     ok(this.willDiscardCalled, "willDiscard called before didDiscard");
+
+    view._endEditing();
   }
 };
 
@@ -58,13 +60,13 @@ view = SC.View.create(SC.InlineEditable, {
 });
 
 function reset() {
+  if(fakeEditor.isEditing) fakeEditor.commitEditing();
+
   fakeDelegate.shouldDiscardCalled = NO;
   fakeEditor.discardEditingCalled = NO;
 
   fakeDelegate.willDiscardCalled = NO;
   fakeDelegate.didDiscardCalled = NO;
-
-  if(fakeEditor.isEditing) fakeEditor.commitEditing();
 }
 
 module('SC.InlineEditable.discardEditing');

data/lib/frameworks/sproutcore/frameworks/foundation/tests/mixins/inline_editor/beginEditing.js

@@ -62,13 +62,13 @@ view = SC.View.create(SC.InlineEditable, {
 });
 
 function reset() {
+  if(fakeEditor.isEditing) fakeEditor.discardEditing();
+
   fakeDelegate.shouldBeginCalled = NO;
   fakeDelegate.acquireEditorCalled = NO;
   fakeEditor.beginEditingCalled = NO;
   fakeDelegate.willBeginCalled = NO;
   fakeDelegate.didBeginCalled = NO;
-
-  if(fakeEditor.isEditing) fakeEditor.discardEditing();
 };
 
 module("SC.InlineEditor.beginEditing");

data/lib/frameworks/sproutcore/frameworks/foundation/tests/mixins/inline_editor/commitEditing.js

@@ -32,6 +32,8 @@ fakeDelegate = {
   inlineEditorDidCommitEditing: function() {
     this.didCommitCalled = YES;
     ok(this.willCommitCalled, "willCommit called before didCommit");
+
+    view._endEditing();
   }
 };
 
@@ -58,13 +60,13 @@ view = SC.View.create(SC.InlineEditable, {
 });
 
 function reset() {
+  if(fakeEditor.isEditing) fakeEditor.discardEditing();
+
   fakeDelegate.shouldCommitCalled = NO;
   fakeEditor.commitEditingCalled = NO;
 
   fakeDelegate.willCommitCalled = NO;
   fakeDelegate.didCommitCalled = NO;
-
-  if(fakeEditor.isEditing) fakeEditor.discardEditing();
 }
 
 module('SC.InlineEditable.commitEditing');

data/lib/frameworks/sproutcore/frameworks/foundation/tests/mixins/inline_editor/discardEditing.js

@@ -32,6 +32,8 @@ fakeDelegate = {
   inlineEditorDidDiscardEditing: function() {
     this.didDiscardCalled = YES;
     ok(this.willDiscardCalled, "willDiscard called before didDiscard");
+
+    view._endEditing();
   }
 };
 
@@ -58,13 +60,13 @@ view = SC.View.create(SC.InlineEditable, {
 });
 
 function reset() {
+  if(fakeEditor.isEditing) fakeEditor.commitEditing();
+
   fakeDelegate.shouldDiscardCalled = NO;
   fakeEditor.discardEditingCalled = NO;
 
   fakeDelegate.willDiscardCalled = NO;
   fakeDelegate.didDiscardCalled = NO;
-
-  if(fakeEditor.isEditing) fakeEditor.commitEditing();
 }
 
 module('SC.InlineEditable.discardEditing');

data/lib/frameworks/sproutcore/frameworks/foundation/tests/system/utils/pointInElement.js

@@ -99,8 +99,8 @@ function runChecks(element, offsetAdjust, values) {
       top = jqOffset.top;
 
   equals(SC.pointInElement({x: left + offsetAdjust, y: top + offsetAdjust}, element, 'padding'), values[0], 'point {left: %@, top: %@} within the element\'s padding'.fmt(offsetAdjust, offsetAdjust));
-  equals(SC.pointInElement({x: left + offsetAdjust, y: top + offsetAdjust}, element, 'border'), values[1], 'point {left: %@, top: %@} within the element\'s padding'.fmt(offsetAdjust, offsetAdjust));
-  equals(SC.pointInElement({x: left + offsetAdjust, y: top + offsetAdjust}, element, 'margin'), values[2], 'point {left: %@, top: %@} within the element\'s padding'.fmt(offsetAdjust, offsetAdjust));
+  equals(SC.pointInElement({x: left + offsetAdjust, y: top + offsetAdjust}, element, 'border'), values[1], 'point {left: %@, top: %@} within the element\'s border'.fmt(offsetAdjust, offsetAdjust));
+  equals(SC.pointInElement({x: left + offsetAdjust, y: top + offsetAdjust}, element, 'margin'), values[2], 'point {left: %@, top: %@} within the element\'s margin'.fmt(offsetAdjust, offsetAdjust));
 }
 
 test("A plain child element", function() {

data/lib/frameworks/sproutcore/frameworks/foundation/tests/views/label/ui.js

@@ -152,14 +152,6 @@ test("Check that all labels have the right classes and styles set", function() {
    
 });
 
-test("Default styles are set correctly in CSS"
-//, function() {
-  // document.defaultView.getComputedStyle fails when we're running framework-level tests
-  // var viewElem=pane.view('basic').$();
-  // ok(viewElem.css('textAlign') === 'left', 'centered should have center textAlign');
-  // ok(viewElem.css('fontWeight') === 'normal', 'bold view should have bold fontWeight');
-//}
-);
 
 test("Check that the title is set or not and if it is in the appropriate element", function() {
   var viewElem=pane.view('basic').$();

data/lib/frameworks/sproutcore/frameworks/foundation/tests/views/text_field/ui.js

@@ -8,122 +8,99 @@
 /*global module test htmlbody ok equals same stop start */
 (function() {
   var pane = SC.ControlTestPane.design()
-  .add("empty", SC.TextFieldView, { 
-    hint: "Full Name", 
+  .add("empty", SC.TextFieldView, {
+    hint: "Full Name",
     value: ''
   })
-  
-  .add("with value", SC.TextFieldView, { 
-    hint: "Full Name", 
+
+  .add("with value", SC.TextFieldView, {
+    hint: "Full Name",
     value: 'John Doe'
   })
-  
+
   .add("password", SC.TextFieldView, {
     isPassword: YES,
     value: "I'm so secret"
   })
-  
+
   .add("password-hint", SC.TextFieldView, {
     hint: "Passwerd",
     isPassword: YES,
     value: "I'm so secret"
   })
-  
-  .add("disabled - empty", SC.TextFieldView, { 
-    hint: "Full Name", 
+
+  .add("disabled - empty", SC.TextFieldView, {
+    hint: "Full Name",
     value: null,
     isEnabled: NO,
     isEditable: NO
   })
-  
-  .add("disabled - with value", SC.TextFieldView, { 
-    hint: "Full Name", 
+
+  .add("disabled - with value", SC.TextFieldView, {
+    hint: "Full Name",
     value: 'John Doe',
     isEnabled: NO,
     isEditable: NO
   })
 
-  .add("enabled - not editable - with value", SC.TextFieldView, { 
-    hint: "Full Name", 
+  .add("enabled - not editable - with value", SC.TextFieldView, {
+    hint: "Full Name",
     value: 'John Doe',
     isEnabled: YES,
     isEditable: NO
   })
-  
-  .add("textarea - empty", SC.TextFieldView, { 
-    hint: "Full Name", 
+
+  .add("textarea - empty", SC.TextFieldView, {
+    hint: "Full Name",
     value: '',
     isTextArea: YES
   })
-  
-  .add("textarea - with value", SC.TextFieldView, { 
-    hint: "Full Name", 
+
+  .add("textarea - with value", SC.TextFieldView, {
+    hint: "Full Name",
     value: 'John Doe',
     isTextArea: YES
   })
-  
-  .add("textarea - disabled - empty", SC.TextFieldView, { 
-    hint: "Full Name", 
+
+  .add("textarea - disabled - empty", SC.TextFieldView, {
+    hint: "Full Name",
     value: '',
     isTextArea: YES,
     isEnabled: NO
   })
-  
-  .add("textarea - disabled - with value", SC.TextFieldView, { 
-    hint: "Full Name", 
-    value: 'John Doe',
-    isTextArea: YES,
-    isEnabled: NO
-  })
-  
-  .add("aria-role", SC.TextFieldView, {
-    hint: "Full Name", 
-    value: 'John Doe',
-    isTextArea: YES,
-    isEnabled: YES
-  })
 
-  .add("aria-multiline", SC.TextFieldView, {
-    hint: "Full Name", 
-    value: 'John Doe',
-    isTextArea: YES,
-    isEnabled: YES
-  })
-  
-  .add("aria-disabled", SC.TextFieldView, {
-    hint: "Full Name", 
+  .add("textarea - disabled - with value", SC.TextFieldView, {
+    hint: "Full Name",
     value: 'John Doe',
     isTextArea: YES,
     isEnabled: NO
   })
 
+
   .add("aria-readonly", SC.TextFieldView, {
-    hint: "Full Name", 
+    hint: "Full Name",
     value: 'John Doe',
     isTextArea: YES,
     isEnabled: YES,
     isEditable: NO
-  })
-  
-  .add("aria-invalid", SC.TextFieldView, {
-      value: SC.Error.create({errorValue:'Error Message'}),
-      isEnabled: YES
   });
-    
+
+
 pane.show(); // add a test to show the test pane
 
 // ..........................................................
 // VERIFY STANDARD STATES
-// 
+//
 pane.verifyEmpty = function verifyEmpty(view, expectedHint) {
   var input = view.$('input');
   var layer = view.$();
-  
+
   ok(!layer.hasClass('not-empty'), 'layer should not have not-empty class');
-  if(SC.browser.webkit || parseInt(SC.browser.mozilla) >= 2.0) equals(input.val(), '', 'input should have empty value');
+  if(SC.browser.isWebkit || (SC.browser.isMozilla &&
+      SC.browser.compare(SC.browser.engineVersion, '2.0') >= 0)) equals(input.val(), '', 'input should have empty value');
   else equals(input.val(), expectedHint, 'input should have expected hint as value');
   if (expectedHint) {
-    var hint = view.$('.sc-hint');
+    var hint = view.$('.hint');
     if (hint.length===1) {
     hint = hint.text();
   } else {
@@ -137,12 +114,12 @@ pane.verifyEmpty = function verifyEmpty(view, expectedHint) {
 pane.verifyNotEmpty = function verifyNotEmpty(view, expectedValue, expectedHint) {
   var input = view.$('input');
   var layer = view.$();
-  
+
   ok(layer.hasClass('not-empty'), 'layer should have not-empty class');
   equals(input.val(), expectedValue, 'input should have value');
-  
+
   if (expectedHint) {
-    var hint = view.$('.sc-hint');
+    var hint = view.$('.hint');
     if (hint.length===1) {
     hint = hint.text();
   } else {
@@ -156,7 +133,7 @@ pane.verifyNotEmpty = function verifyNotEmpty(view, expectedValue, expectedHint)
 pane.verifyDisabled = function verifyDisabled(view, isDisabled) {
   var layer = view.$();
   var input = view.$('input');
-  
+
   if (isDisabled) {
     ok(layer.hasClass('disabled'), 'layer should have disabled class');
     ok(input.attr('disabled'), 'input should have disabled attr');
@@ -168,7 +145,7 @@ pane.verifyDisabled = function verifyDisabled(view, isDisabled) {
 
 pane.verifyReadOnly = function verifyReadonly(view, isReadOnly) {
   var input = view.$('input');
-  
+
   if(isReadOnly) {
     ok(input.attr('readOnly'), 'input should have readOnly attr');
   } else {
@@ -178,7 +155,7 @@ pane.verifyReadOnly = function verifyReadonly(view, isReadOnly) {
 
 // ..........................................................
 // TEST INITIAL STATES
-// 
+//
 
 module('SC.TextFieldView ui', pane.standardSetup());
 
@@ -250,11 +227,11 @@ test("textarea - disabled - with value", function() {
 
 // ..........................................................
 // TEST CHANGING VIEWS
-// 
+//
 
 test("changing value from empty -> value", function() {
   var view = pane.view('empty');
-  
+
   // test changing value updates like it should
   SC.RunLoop.begin();
   view.set('value', 'John Doe');
@@ -262,9 +239,9 @@ test("changing value from empty -> value", function() {
   pane.verifyNotEmpty(view, 'John Doe', 'Full Name');
 });
 
-test("disabling view", function() {  
+test("disabling view", function() {
   var view = pane.view('empty');
-  
+
   // test changing enabled state updates like it should
   SC.RunLoop.begin();
   view.set('isEnabled', NO);
@@ -309,6 +286,38 @@ test("changing isEditable", function() {
   pane.verifyReadOnly(view, YES);
 });
 
+test("changing value from not a textarea to a textarea", function() {
+  // test the the SC.Event for 'change' gets wired up properly to the DOM element when it changes from input to textarea
+  var view = pane.view('empty');
+  SC.RunLoop.begin();
+  view.set('value', 'Original');
+  view.set('isTextArea', YES);
+  SC.RunLoop.end();
+
+  var $textarea = view.$('textarea');
+
+  SC.Event.trigger($textarea, 'focus');
+
+  // simulate typing a letter
+  SC.Event.trigger($textarea, 'keydown');
+  $textarea.val("My New Value");
+  SC.Event.trigger($textarea, 'keyup');
+  SC.Event.trigger($textarea, 'change');
+  view.fieldValueDidChange();
+
+  // wait a little bit to let text field propogate changes
+  stop();
+
+  setTimeout(function() {
+    start();
+    equals(view.get("value"), "My New Value", "SC.Event for change should get wired up properly");
+  }, 100);
+
+  SC.RunLoop.begin();
+  SC.RunLoop.end();
+});
+
+
 if (!SC.browser.isIE && !SC.platform.input.placeholder) {
   test("Changing value to null -- password field", function() {
     var view = pane.view('password-hint'),
@@ -325,13 +334,13 @@ if (!SC.browser.isIE && !SC.platform.input.placeholder) {
 
 // ..........................................................
 // TEST SELECTION SUPPORT
-// 
+//
 
-test("Setting the selection to a null value should fail", function() {  
+test("Setting the selection to a null value should fail", function() {
   var view = pane.view('with value');
   var fieldElement = view.$input()[0];
   fieldElement.size = 10;     // Avoid Firefox 3.5 issue
-  
+
   var thrownException = null;
   try {
     view.set('selection', null);
@@ -345,11 +354,11 @@ test("Setting the selection to a null value should fail", function() {
   }
 });
 
-test("Setting the selection to a non-SC.TextSelection value should fail", function() {  
+test("Setting the selection to a non-SC.TextSelection value should fail", function() {
   var view = pane.view('with value');
   var fieldElement = view.$input()[0];
   fieldElement.size = 10;     // Avoid Firefox 3.5 issue
-  
+
   var thrownException = null;
   try {
     view.set('selection', {start: 0, end: 0});
@@ -363,15 +372,15 @@ test("Setting the selection to a non-SC.TextSelection value should fail", functi
   }
 });
 
-test("Setting and then getting back the selection", function() {  
+test("Setting and then getting back the selection", function() {
   var view = pane.view('with value');
   var fieldElement = view.$input()[0];
   fieldElement.focus();
   fieldElement.size = 10;     // Avoid Firefox 3.5 issue
-  
+
   var newSelection = SC.TextSelection.create({start:2, end:5});
   view.set('selection', newSelection);
-  
+
   var fetchedSelection = view.get('selection');
   ok(fetchedSelection.get('start') === 2, 'the selection should start at index 2');
   ok(fetchedSelection.get('end') === 5, 'the selection should end at index 4');
@@ -380,11 +389,11 @@ test("Setting and then getting back the selection", function() {
 
 // ..........................................................
 // TEST ACCESSORY VIEWS
-// 
+//
 
-test("Adding left accessory view", function() {  
+test("Adding left accessory view", function() {
   var view = pane.view('with value');
-  
+
   // test adding accessory view adds the view like it should
   SC.RunLoop.begin();
   var accessoryView = SC.View.create({
@@ -396,14 +405,14 @@ test("Adding left accessory view", function() {
   ok(view.get('leftAccessoryView') === accessoryView, 'left accessory view should be set to ' + accessoryView.toString());
   ok(view.get('childViews').length === 1, 'there should only be one child view');
   ok(view.get('childViews')[0] === accessoryView, 'first child view should be set to ' + accessoryView.toString());
-  
-  
+
+
   // The hint and padding elements should automatically have their 'left'
   // values set to the accessory view's offset + width
   // (18 = 2 left offset + 16 width)
   var paddingElement = view.$('.padding')[0];
   ok(paddingElement.style.left === '18px', 'padding element should get 18px left');
-  
+
   // Test removing the accessory view.
   SC.RunLoop.begin();
   view.set('leftAccessoryView', null);
@@ -412,9 +421,9 @@ test("Adding left accessory view", function() {
   ok(!paddingElement.style.left, 'after removing the left accessory view the padding element should have no left style');
 });
 
-test("Adding left accessory view changes style -- using design()", function() {  
+test("Adding left accessory view changes style -- using design()", function() {
   var view = pane.view('with value');
-  
+
   // test adding accessory view adds the view like it should
   SC.RunLoop.begin();
   var accessoryView = SC.View.design({
@@ -428,7 +437,7 @@ test("Adding left accessory view changes style -- using design()", function() {
   // (18 = 2 left offset + 16 width)
   var paddingElement = view.$('.padding')[0];
   ok(paddingElement.style.left === '18px', 'padding element should get 18px left');
-  
+
   // Test removing the accessory view.
   SC.RunLoop.begin();
   view.set('leftAccessoryView', null);
@@ -436,9 +445,9 @@ test("Adding left accessory view changes style -- using design()", function() {
   ok(!paddingElement.style.left, 'after removing the left accessory view the padding element should have no left style');
 });
 
-test("Adding right accessory view", function() {  
+test("Adding right accessory view", function() {
   var view = pane.view('with value');
-  
+
   // test adding accessory view adds the view like it should
   SC.RunLoop.begin();
   var accessoryView = SC.View.create({
@@ -450,15 +459,15 @@ test("Adding right accessory view", function() {
   ok(view.get('rightAccessoryView') === accessoryView, 'right accessory view should be set to ' + accessoryView.toString());
   ok(view.get('childViews').length === 1, 'there should only be one child view');
   ok(view.get('childViews')[0] === accessoryView, 'first child view should be set to ' + accessoryView.toString());
-  
-  
+
+
   // The hint and padding elements should automatically have their 'right'
   // values set to the accessory view's offset + width
   // (20 = 3 right offset + 17 width)
   var paddingElement = view.$('.padding')[0];
   ok(paddingElement.style.right === '20px', 'padding element should get 20px right');
-  
-  
+
+
   // If a right accessory view is set with only 'left' (and not 'right')
   // defined in its layout, 'left' should be cleared out and 'right' should
   // be set to 0.
@@ -468,11 +477,11 @@ test("Adding right accessory view", function() {
   });
   view.set('rightAccessoryView', accessoryView);
   SC.RunLoop.end();
-  
+
   ok(view.get('rightAccessoryView').get('layout').left === null, "right accessory view created with 'left' rather than 'right' in layout should have layout.left set to null");
   ok(view.get('rightAccessoryView').get('layout').right === 0, "right accessory view created with 'left' rather than 'right' in layout should have layout.right set to 0");
-  
-  
+
+
   // Test removing the accessory view.
   SC.RunLoop.begin();
   view.set('rightAccessoryView', null);
@@ -481,9 +490,9 @@ test("Adding right accessory view", function() {
   ok(!paddingElement.style.right, 'after removing the right accessory view the padding element should have no right style');
 });
 
-test("Adding right accessory view changes style -- using design()", function() {  
+test("Adding right accessory view changes style -- using design()", function() {
   var view = pane.view('with value');
-  
+
   // test adding accessory view adds the view like it should
   SC.RunLoop.begin();
   var accessoryView = SC.View.design({
@@ -496,8 +505,8 @@ test("Adding right accessory view changes style -- using design()", function() {
   // values set to the accessory view's offset + width
   // (20 = 3 right offset + 17 width)
   var paddingElement = view.$('.padding')[0];
-  ok(paddingElement.style.right === '20px', 'padding element should get 20px right');  
-  
+  ok(paddingElement.style.right === '20px', 'padding element should get 20px right');
+
   // Test removing the accessory view.
   SC.RunLoop.begin();
   view.set('rightAccessoryView', null);
@@ -506,9 +515,9 @@ test("Adding right accessory view changes style -- using design()", function() {
 });
 
 
-test("Adding both left and right accessory views", function() {  
+test("Adding both left and right accessory views", function() {
   var view = pane.view('with value');
-  
+
   // test adding accessory view adds the view like it should
   SC.RunLoop.begin();
   var leftAccessoryView = SC.View.create({
@@ -522,8 +531,8 @@ test("Adding both left and right accessory views", function() {
   SC.RunLoop.end();
 
   ok(view.get('childViews').length === 2, 'we should have two child views since we added both a left and a right accessory view');
-  
-  
+
+
   // The hint and padding elements should automatically have their 'left' and
   // 'right' values set to the accessory views' offset + width
   //   *  left:   18 = 2 left offset + 16 width)
@@ -531,8 +540,8 @@ test("Adding both left and right accessory views", function() {
   var paddingElement = view.$('.padding')[0];
   ok(paddingElement.style.left === '18px', 'padding element should get 18px left');
   ok(paddingElement.style.right === '20px', 'padding element should get 20px right');
-  
-  
+
+
   // Test removing the accessory views.
   SC.RunLoop.begin();
   view.set('rightAccessoryView', null);
@@ -546,9 +555,9 @@ test("Adding both left and right accessory views", function() {
   ok(!paddingElement.style.left, 'after removing the left accessory view the padding element should have no left style');
 });
 
-test("Adding both left and right accessory views changes style -- using design()", function() {  
+test("Adding both left and right accessory views changes style -- using design()", function() {
   var view = pane.view('with value');
-  
+
   // test adding accessory view adds the view like it should
   SC.RunLoop.begin();
   var leftAccessoryView = SC.View.design({
@@ -559,8 +568,8 @@ test("Adding both left and right accessory views changes style -- using design()
     layout:  { top:1, right:3, width:17, height:16 }
   });
   view.set('rightAccessoryView', rightAccessoryView);
-  SC.RunLoop.end();  
-  
+  SC.RunLoop.end();
+
   // The hint and padding elements should automatically have their 'left' and
   // 'right' values set to the accessory views' offset + width
   //   *  left:   18 = 2 left offset + 16 width)
@@ -568,8 +577,8 @@ test("Adding both left and right accessory views changes style -- using design()
   var paddingElement = view.$('.padding')[0];
   ok(paddingElement.style.left === '18px', 'padding element should get 18px left');
   ok(paddingElement.style.right === '20px', 'padding element should get 20px right');
-  
-  
+
+
   // Test removing the accessory views.
   SC.RunLoop.begin();
   view.set('rightAccessoryView', null);
@@ -585,31 +594,31 @@ test("Adding both left and right accessory views changes style -- using design()
 
 // ..........................................................
 // TEST EVENTS
-// 
+//
 
 test("focus and blurring text field", function() {
   var view = pane.view('empty');
   var input = view.$('input');
-  
+
   // attempt to focus...
   SC.Event.trigger(input, 'focus');
-  
+
   // verify editing state changed...
   ok(view.get('isEditing'), 'view.isEditing should be YES');
   ok(view.$().hasClass('focus'), 'view layer should have focus class');
-  
+
   // simulate typing a letter
   SC.Event.trigger(input, 'keydown');
   SC.Event.trigger(input, 'keyup');
   input.val('f');
   SC.Event.trigger(input, 'change');
-  
-  // wait a little bit to let text field propograte changes
+
+  // wait a little bit to let text field propagate changes
   stop();
-  
+
   setTimeout(function() {
     start();
-    
+
     equals(view.get('value'), 'f', 'view should have new value');
     ok(view.$().hasClass('not-empty'), 'should have not-empty class');
 
@@ -619,8 +628,42 @@ test("focus and blurring text field", function() {
     // verify editing state changed...
     ok(!view.get('isEditing'), 'view.isEditing should be NO');
     ok(!view.$().hasClass('focus'), 'view layer should NOT have focus class');
-  }, 100);  
-  
+  }, 100);
+
+});
+
+test("focus and blur an empty text field", function() {
+  var view = pane.view('empty');
+  var input = view.$('input');
+
+  // verify the field is empty and the hint is properly set
+  pane.verifyEmpty(view, 'Full Name');
+
+  // focus and blur the text field
+  SC.Event.trigger(input, 'focus');
+  SC.Event.trigger(input, 'blur');
+
+  // field should still be still be empty with hint properly set
+  pane.verifyEmpty(view, 'Full Name');
+});
+
+test("loosing first responder should blur", function() {
+  var view = pane.view('empty');
+  var input = view.$('input');
+  var testResponder = SC.Responder.create(SC.ResponderContext, {});
+
+  // preliminary setup
+  view.get('pane').becomeKeyPane();
+  SC.Event.trigger(input, 'focus');
+
+  // verify it did receive focus
+  ok(view.get('focused'), 'view should have focus');
+
+  // tell the pane to make our test responder the first responder
+  view.get('pane').makeFirstResponder(testResponder);
+
+  // verify it no longer has focus
+  ok(!view.get('focused'), 'view should no longer have focus');
 });
 
 test("editing a field should not change the cursor position", function() {
@@ -636,33 +679,4 @@ test("editing a field should not change the cursor position", function() {
   ok(selection.get('start') == 2 && selection.get('end') == 3, 'cursor position should be unchanged');
 });
 
-test("should have role as textbox", function() {
-  var view = pane.view('aria-role');
-  var label = view.$();  
-  equals(label.attr('role'), 'textbox', 'role should be textbox');
-});
-
-test("should have aria-multiline as YES", function() {
-  var view = pane.view('aria-multiline');
-  var label = view.$();  
-  equals(label.attr('aria-multiline'), 'true', 'aria-multiline should be true');
-});
-
-test("should have aria-disabled as YES", function() {
-  var view = pane.view('aria-disabled');
-  var label = view.$();  
-  equals(label.attr('aria-disabled'), 'true', 'aria-disabled should be true');
-});
-
-test("should have aria-readonly as YES", function() {
-  var view = pane.view('aria-readonly');
-  var label = view.$();  
-  equals(label.attr('aria-readonly'), 'true', 'aria-readonly should be true');
-});
-
-test("should have aria-invalid as YES", function() {
-  var view = pane.view('aria-invalid');
-  var label = view.$();
-  equals(label.attr('aria-invalid'), 'true', 'aria-invalid should be true');
-});
 })();