Merge pull request #1201 from ckeditor/t/ckeditor5/676

Fix: Added a 50ms timeout after `Document#focus` event before rendering to be sure that selection changes are processed on Firefox and Safari. Closes ckeditor/ckeditor5#676. Closes #1157. Closes #1155. Closes #1153.

src/view/observer/focusobserver.js

@@ -35,7 +35,8 @@ export default class FocusObserver extends DomEventObserver {
 			// We need to wait until `SelectionObserver` handle the event and then render. Otherwise rendering will
 			// overwrite new DOM selection with selection from the view.
 			// See https://github.com/ckeditor/ckeditor5-engine/issues/795 for more details.
-			this._renderTimeoutId = setTimeout( () => document.render(), 0 );
+			// Long timeout is needed to solve #676 and https://github.com/ckeditor/ckeditor5-engine/issues/1157 issues.
+			this._renderTimeoutId = setTimeout( () => document.render(), 50 );
 		} );
 
 		document.on( 'blur', ( evt, data ) => {

tests/view/observer/focusobserver.js

@@ -115,13 +115,13 @@ describe( 'FocusObserver', () => {
 			expect( viewDocument.isFocused ).to.be.true;
 		} );
 
-		it( 'should delay rendering to the next iteration of event loop', () => {
+		it( 'should delay rendering by 50ms', () => {
 			const renderSpy = sinon.spy( viewDocument, 'render' );
 			const clock = sinon.useFakeTimers();
 
 			observer.onDomEvent( { type: 'focus', target: domMain } );
 			sinon.assert.notCalled( renderSpy );
-			clock.tick( 0 );
+			clock.tick( 50 );
 			sinon.assert.called( renderSpy );
 
 			clock.restore();
@@ -134,7 +134,7 @@ describe( 'FocusObserver', () => {
 			observer.onDomEvent( { type: 'focus', target: domMain } );
 			sinon.assert.notCalled( renderSpy );
 			observer.destroy();
-			clock.tick( 0 );
+			clock.tick( 50 );
 			sinon.assert.notCalled( renderSpy );
 
 			clock.restore();