diff --git a/src/dropdown/utils.js b/src/dropdown/utils.js
index a5121126..b2b68ba8 100644
--- a/src/dropdown/utils.js
+++ b/src/dropdown/utils.js
@@ -7,7 +7,7 @@
  * @module ui/dropdown/utils
  */
 
-/* global document */
+import clickOutsideHandler from '../bindings/clickoutsidehandler';
 
 /**
  * Adds a behavior to a dropdownView that focuses dropdown panel view contents on keystrokes.
@@ -57,27 +57,14 @@ export function closeDropdownOnExecute( dropdownView, viewCollection ) {
  * @param {module:ui/dropdown/dropdownview~DropdownView} dropdownView
  */
 export function closeDropdownOnBlur( dropdownView ) {
-	dropdownView.on( 'change:isOpen', ( evt, name, value ) => {
-		if ( value ) {
-			attachDocumentClickListener( document, dropdownView );
-		} else {
-			dropdownView.stopListening( document );
-		}
-	} );
-}
-
-// Attaches a "click" listener in DOM to check if any element outside
-// the dropdown has been clicked.
-//
-// @private
-// @param {module:ui/dropdown/listdropdownview~ListDropdownView} dropdownView
-function attachDocumentClickListener( document, dropdownView ) {
-	// TODO: It will probably be focus/blur-based rather than click. It should be bound
-	// to focusmanager of some sort.
-	dropdownView.listenTo( document, 'click', ( evtInfo, { target: domEvtTarget } ) => {
-		// Collapse the dropdown when the webpage outside of the component is clicked.
-		if ( dropdownView.element != domEvtTarget && !dropdownView.element.contains( domEvtTarget ) ) {
-			dropdownView.isOpen = false;
-		}
+	dropdownView.on( 'render', () => {
+		clickOutsideHandler( {
+			emitter: dropdownView,
+			activator: () => dropdownView.isOpen,
+			callback: () => {
+				dropdownView.isOpen = false;
+			},
+			contextElements: [ dropdownView.element ]
+		} );
 	} );
 }
diff --git a/tests/dropdown/button/createbuttondropdown.js b/tests/dropdown/button/createbuttondropdown.js
index e144bbbe..839b721e 100644
--- a/tests/dropdown/button/createbuttondropdown.js
+++ b/tests/dropdown/button/createbuttondropdown.js
@@ -95,7 +95,7 @@ describe( 'createButtonDropdown', () => {
 			view.isOpen = true;
 
 			// Fire event from outside of the dropdown.
-			document.body.dispatchEvent( new Event( 'click', {
+			document.body.dispatchEvent( new Event( 'mousedown', {
 				bubbles: true
 			} ) );
 
@@ -103,7 +103,7 @@ describe( 'createButtonDropdown', () => {
 			expect( view.isOpen ).to.be.false;
 
 			// Fire event from outside of the dropdown.
-			document.body.dispatchEvent( new Event( 'click', {
+			document.body.dispatchEvent( new Event( 'mousedown', {
 				bubbles: true
 			} ) );
 
@@ -116,7 +116,7 @@ describe( 'createButtonDropdown', () => {
 			view.isOpen = true;
 
 			// Event from view.element should be discarded.
-			view.element.dispatchEvent( new Event( 'click', {
+			view.element.dispatchEvent( new Event( 'mousedown', {
 				bubbles: true
 			} ) );
 
@@ -127,7 +127,7 @@ describe( 'createButtonDropdown', () => {
 			const child = document.createElement( 'div' );
 			view.element.appendChild( child );
 
-			child.dispatchEvent( new Event( 'click', {
+			child.dispatchEvent( new Event( 'mousedown', {
 				bubbles: true
 			} ) );
 
diff --git a/tests/dropdown/list/createlistdropdown.js b/tests/dropdown/list/createlistdropdown.js
index bd807d36..9b709902 100644
--- a/tests/dropdown/list/createlistdropdown.js
+++ b/tests/dropdown/list/createlistdropdown.js
@@ -106,7 +106,7 @@ describe( 'createListDropdown', () => {
 			view.isOpen = true;
 
 			// Fire event from outside of the dropdown.
-			document.body.dispatchEvent( new Event( 'click', {
+			document.body.dispatchEvent( new Event( 'mousedown', {
 				bubbles: true
 			} ) );
 
@@ -114,7 +114,7 @@ describe( 'createListDropdown', () => {
 			expect( view.isOpen ).to.be.false;
 
 			// Fire event from outside of the dropdown.
-			document.body.dispatchEvent( new Event( 'click', {
+			document.body.dispatchEvent( new Event( 'mousedown', {
 				bubbles: true
 			} ) );
 
@@ -127,7 +127,7 @@ describe( 'createListDropdown', () => {
 			view.isOpen = true;
 
 			// Event from view.element should be discarded.
-			view.element.dispatchEvent( new Event( 'click', {
+			view.element.dispatchEvent( new Event( 'mousedown', {
 				bubbles: true
 			} ) );
 
@@ -138,7 +138,7 @@ describe( 'createListDropdown', () => {
 			const child = document.createElement( 'div' );
 			view.element.appendChild( child );
 
-			child.dispatchEvent( new Event( 'click', {
+			child.dispatchEvent( new Event( 'mousedown', {
 				bubbles: true
 			} ) );