Merge branch 'alishersadikov-v0.100.2-chrome-73-patch'

materializecss · Apr 23, 2019 · e3eb698 · e3eb698
2 parents b94dd3c + 3b5c136
commit e3eb698
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 17 deletions.
diff --git a/js/date_picker/picker.js b/js/date_picker/picker.js
@@ -579,6 +579,8 @@ function PickerConstructor( ELEMENT, NAME, COMPONENT, OPTIONS ) {
 
     /**
      * Prepare the input element with all bindings.
+     * The contents of this function are copied from pickadate v3.6.3
+     * https://github.com/amsul/pickadate.js/blob/master/lib/picker.js
      */
     function prepareElement() {
 
@@ -590,32 +592,45 @@ function PickerConstructor( ELEMENT, NAME, COMPONENT, OPTIONS ) {
             // Add the “input” class name.
             addClass(CLASSES.input).
 
-            // Remove the tabindex.
-            attr('tabindex', -1).
-
             // If there’s a `data-value`, update the value of the element.
             val( $ELEMENT.data('value') ?
                 P.get('select', SETTINGS.format) :
                 ELEMENT.value
-            )
+            ).
+
+            // On focus/click, open the picker.
+            on( 'focus.' + STATE.id + ' click.' + STATE.id,
+            debounce(function(event) {
+                event.preventDefault()
+                P.open()
+            }, 150))
+
+            // Mousedown handler to capture when the user starts interacting
+            // with the picker. This is used in working around a bug in Chrome 73.
+            .on('mousedown', function() {
+              STATE.handlingOpen = true;
+              var handler = function() {
+                // By default mouseup events are fired before a click event.
+                // By using a timeout we can force the mouseup to be handled
+                // after the corresponding click event is handled.
+                setTimeout(function() {
+                  $(document).off('mouseup', handler);
+                  STATE.handlingOpen = false;
+                }, 0);
+              };
+              $(document).on('mouseup', handler);
+            });
 
 
         // Only bind keydown events if the element isn’t editable.
         if ( !SETTINGS.editable ) {
 
             $ELEMENT.
 
-                // On focus/click, focus onto the root to open it up.
-                on( 'focus.' + STATE.id + ' click.' + STATE.id, function( event ) {
-                    event.preventDefault()
-                    P.$root.eq(0).focus()
-                }).
-
                 // Handle keyboard event based on the picker being opened or not.
                 on( 'keydown.' + STATE.id, handleKeydownEvent )
         }
 
-
         // Update the aria attributes.
         aria(ELEMENT, {
             haspopup: true,
@@ -625,6 +640,20 @@ function PickerConstructor( ELEMENT, NAME, COMPONENT, OPTIONS ) {
         })
     }
 
+    function debounce(func, wait, immediate) {
+        var timeout;
+        return function() {
+            var context = this, args = arguments;
+            var later = function() {
+                timeout = null;
+                if (!immediate) func.apply(context, args);
+            };
+            var callNow = immediate && !timeout;
+            clearTimeout(timeout);
+            timeout = setTimeout(later, wait);
+            if (callNow) func.apply(context, args);
+        };
+    }
 
     /**
      * Prepare the root picker element with all bindings.

diff --git a/js/date_picker/picker.time.js b/js/date_picker/picker.time.js
@@ -440,12 +440,15 @@
 		this.locate();
 		this.isShown = true;
 		// Hide when clicking or tabbing on any element except the clock and input
-		$doc.on('click.clockpicker.' + this.id + ' focusin.clockpicker.' + this.id, function(e) {
-			var target = $(e.target);
-			if (target.closest(self.popover.find('.picker__wrap')).length === 0 && target.closest(self.input).length === 0) {
-				self.hide();
-      }
-		});
+		let $this = this;
+		setTimeout(function() {
+			$doc.on('click.clockpicker.' + $this.id + ' focusin.clockpicker.' + $this.id, function(e) {
+				var target = $(e.target);
+				if (target.closest(self.popover.find('.picker__wrap')).length === 0 && target.closest(self.input).length === 0) {
+					self.hide();
+	      }
+			});
+		}, 100);
 		// Hide when ESC is pressed
 		$doc.on('keyup.clockpicker.' + this.id, function(e){
 			if (e.keyCode === 27) {

diff --git a/js/forms.js b/js/forms.js
@@ -514,6 +514,12 @@
       var uniqueID = Materialize.guid();
       $select.attr('data-select-id', uniqueID);
       var wrapper = $('<div class="select-wrapper"></div>');
+
+      // to fix Chrome 73 bug
+      wrapper.click(function (e) {
+        e.stopPropagation();
+      });
+
       wrapper.addClass($select.attr('class'));
       if ($select.is(':disabled'))
         wrapper.addClass('disabled');