Doesn't pass focus test in IE9, IE8

[proudman]

Dear developers,
In IE9 and IE8 I had a trouble with tests. When I launch a test (for example button UI tests, or routing test) a new frame or window is being opened (DOM visualization works in the frame) and some tests doesn't pass validation. In other browsers tests passed validation.

[nickolay]

Can you strip all the code not related to failing assertion and post the test case here, so we can reproduce?

[proudman]

Yes I can.

StartTest(function (test) {
	var button = Ext.create('Ext.Button', {
		text: 'Click me',
		renderTo: Ext.getBody(),
		handler: function() {
			alert('You clicked the button!');
		}
	});
	test.diag("button.Button.focus()");
	button.focus();
	test.ok(button.el.hasCls("x-focus"), 'Set focus method added focus class');
});

We use ext-all.css from ExtJS.

[mats]

Hmm, why would you want to test the focusing method on Ext JS - it's not part of your codebase?

[proudman]

Sorry, but I don't understand your question fully.
Is this right behavior of the focus method?
I use ExtJS because it is simple method for creating elements (buttons, fields, etc)

[nickolay]

Try this code:

StartTest(function (test) {
   var button = Ext.create('Ext.Button', {
      text: 'Click me',
      renderTo: Ext.getBody(),
      handler: function() {
         alert('You clicked the button!');
      }
   });
   test.diag("button.Button.focus()");
   button.focus();
   
   setTimeout(function () {
   
        test.ok(button.el.hasCls("x-focus"), 'Set focus method added focus class');
    
   }, 50)
});

IE behaves differently when doing focus and often is doing that asynchronously. You need to give it some time before checking the css class.

[proudman]

Do you planned fix this bug in next releases?

[nickolay]

Its not a bug. Its the way IE works (or may be ExtJS). If some event happens asynchronously (focusing in this case), you can't check for its result synchronously.

[proudman]

Thank you.