Fix an issue where the initial button press does not work on a touch device (tested with chromebook in touch mode), due to the fact that the mouseenter event gets triggered when you click the button, causing both mouseevent and click event to trigger right after each other, making the click cancel out the touchenter event. It fixes it by keeping track of when the last displayType (hide / show) happened, and rejecting it when the time between the last one and the current one is less than 16 milliseconds ago.

Author: nholtman

src/quality/quality.js

@@ -194,14 +194,29 @@ Object.assign(MediaElementPlayer.prototype, {
 			labels = player.qualitiesContainer.querySelectorAll(`.${t.options.classPrefix}qualities-selector-label`)
 		;
 
+		let lastShowChange = Date.now();
 		function hideSelector() {
+			const now = Date.now();
+			const diff = now - lastShowChange;
+			if(diff < 16) {
+				return;
+			}
+			lastShowChange = now;
+			
 			mejs.Utils.addClass(qualitiesSelector, `${t.options.classPrefix}offscreen`);
 			qualityButton.setAttribute('aria-expanded', 'false');
 			qualityButton.focus();
 			isHidden = true;
 		}
 
 		function showSelector() {
+			const now = Date.now();
+			const diff = now - lastShowChange;
+			if(diff < 16) {
+				return;
+			}
+			lastShowChange = now;
+			
 			mejs.Utils.removeClass(qualitiesSelector, `${t.options.classPrefix}offscreen`);
 			qualitiesSelector.style.height = `${qualitiesSelector.querySelector('ul').offsetHeight}px`;
 			qualitiesSelector.style.top = `${(-1 * parseFloat(qualitiesSelector.offsetHeight))}px`;