Fixed #944 - Dropdown component does not fire focus or blur events

api-generator/components/dropdown.js

@@ -201,6 +201,28 @@ const DividerEvents = [
         name: "hide",
         description: "Callback to invoke when the overlay is hidden."
     },
+    {
+        name: "focus",
+        description: "Callback to invoke when component receives focus.",
+        arguments: [
+            {
+                name: "event",
+                type: "object",
+                description: "Browser event"
+            }
+        ]
+    },
+    {
+        name: "blur",
+        description: "Callback to invoke when component loses focus.",
+        arguments: [
+            {
+                name: "event",
+                type: "object",
+                description: "Browser event"
+            }
+        ]
+    },
     {
         name: "filter",
         description: "Callback to invoke when the overlay is shown.",

src/components/dropdown/Dropdown.d.ts

@@ -38,6 +38,8 @@ declare class Dropdown {
     $emit(eventName: 'before-leave'): this;
     $emit(eventName: 'show'): this;
     $emit(eventName: 'hide'): this;
+    $emit(eventName: 'focus', e: Event): this;
+    $emit(eventName: 'blur', e: Event): this;
     $emit(eventName: 'filter', e: { originalEvent: Event, value: string }): this;
     $slot: {
         option: VNode[];

src/components/dropdown/Dropdown.vue

@@ -65,7 +65,7 @@ import Ripple from 'primevue/ripple';
 
 export default {
     name: 'Dropdown',
-    emits: ['update:modelValue', 'before-show', 'before-hide', 'show', 'hide', 'change', 'filter'],
+    emits: ['update:modelValue', 'before-show', 'before-hide', 'show', 'hide', 'change', 'filter', 'focus', 'blur'],
     props: {
         modelValue: null,
         options: Array,
@@ -214,11 +214,13 @@ export default {
             this.$emit('before-hide');
             this.overlayVisible = false;
         },
-        onFocus() {
+        onFocus(event) {
             this.focused = true;
+            this.$emit('focus', event);
         },
-        onBlur() {
+        onBlur(event) {
             this.focused = false;
+            this.$emit('blur', event);
         },
         onKeyDown(event) {
             switch(event.which) {

src/views/dropdown/DropdownDoc.vue

@@ -334,6 +334,16 @@ export default {
                         <td>-</td>
                         <td>Callback to invoke when the overlay is hidden.</td>
                     </tr>
+                    <tr>
+                        <td>focus</td>
+                        <td>event</td>
+                        <td>Callback to invoke when the component receives focus.</td>
+                    </tr>
+                    <tr>
+                        <td>blur</td>
+                        <td>event</td>
+                        <td>Callback to invoke when the component loses focus.</td>
+                    </tr>
                     <tr>
                         <td>filter</td>
                         <td>event.originalEvent: Original event <br />