Merge pull request #15992 from primefaces/issue-15749

Fixed #15749 - Dialog: Focus to input element set before transition ends

src/app/components/dialog/dialog.ts

@@ -546,7 +546,15 @@ export class Dialog implements AfterContentInit, OnInit, OnDestroy {
         return this.config.getTranslation(TranslationKeys.ARIA)['maximizeLabel'];
     }
 
-    constructor(@Inject(DOCUMENT) private document: Document, @Inject(PLATFORM_ID) private platformId: any, public el: ElementRef, public renderer: Renderer2, public zone: NgZone, private cd: ChangeDetectorRef, public config: PrimeNGConfig) {
+    constructor(
+        @Inject(DOCUMENT) private document: Document,
+        @Inject(PLATFORM_ID) private platformId: any,
+        public el: ElementRef,
+        public renderer: Renderer2,
+        public zone: NgZone,
+        private cd: ChangeDetectorRef,
+        public config: PrimeNGConfig
+    ) {
         this.window = this.document.defaultView as Window;
     }
 
@@ -598,18 +606,45 @@ export class Dialog implements AfterContentInit, OnInit, OnDestroy {
         return this.header !== null ? UniqueComponentId() + '_header' : null;
     }
 
+    parseDurationToMilliseconds(durationString: string): number | undefined {
+        const transitionTimeRegex = /([\d\.]+)(ms|s)\b/g;
+        let totalMilliseconds = 0;
+        let match;
+
+        while ((match = transitionTimeRegex.exec(durationString)) !== null) {
+            const value = parseFloat(match[1]);
+            const unit = match[2];
+
+            if (unit === 'ms') {
+                totalMilliseconds += value;
+            } else if (unit === 's') {
+                totalMilliseconds += value * 1000;
+            }
+        }
+
+        if (totalMilliseconds === 0) {
+            return undefined;
+        }
+
+        return totalMilliseconds;
+    }
+
     focus(focusParentElement = this.contentViewChild?.nativeElement) {
+        const timeoutDuration = this.parseDurationToMilliseconds(this.transitionOptions);
+
         let focusable = DomHandler.getFocusableElement(focusParentElement, '[autofocus]');
+
         if (focusable) {
             this.zone.runOutsideAngular(() => {
-                setTimeout(() => focusable.focus(), 5);
+                setTimeout(() => focusable.focus(), timeoutDuration || 5);
             });
             return;
         }
         const focusableElement = DomHandler.getFocusableElement(focusParentElement);
+
         if (focusableElement) {
             this.zone.runOutsideAngular(() => {
-                setTimeout(() => focusableElement.focus(), 5);
+                setTimeout(() => focusableElement.focus(), timeoutDuration || 5);
             });
         } else if (this.footerViewChild) {
             // If the content section is empty try to focus on footer