refactor(media_control): avoid hide during one user interaction

joaopaulovieira · May 23, 2021 · d0103de · d0103de
1 parent 614d82f
commit d0103de
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 1 deletion.
diff --git a/src/base/media_control/media_control.js b/src/base/media_control/media_control.js
@@ -30,7 +30,7 @@ export default class MediaControlPlugin extends UICorePlugin {
       'mouseleave .media-control__elements': 'removeKeepVisible',
     }
     const touchOnlyEvents = {
-      'touchstart .media-control__elements': 'setKeepVisible',
+      'touchstart .media-control__elements': 'onTouchStart',
       'touchend .media-control__elements': 'removeKeepVisible',
     }
 
@@ -83,6 +83,12 @@ export default class MediaControlPlugin extends UICorePlugin {
     this.playback && playbackEventListenerData.forEach(item => this.listenToOnce(item.object, item.event, item.callback))
   }
 
+  onTouchStart() {
+    // Avoids to hide if the user taps into one media control element
+    clearTimeout(this._hideId)
+    this.setKeepVisible()
+  }
+
   setKeepVisible() {
     if (!this._isVisible) return
     this._keepVisible = true

diff --git a/src/base/media_control/media_control.test.js b/src/base/media_control/media_control.test.js
@@ -288,6 +288,16 @@ describe('MediaControl Plugin', () => {
     })
   })
 
+  describe('onTouchStart callback', () => {
+    test('calls setKeepVisible method', () => {
+      const { plugin } = setupTest()
+      jest.spyOn(plugin, 'setKeepVisible')
+      plugin.onTouchStart()
+
+      expect(plugin.setKeepVisible).toHaveBeenCalledTimes(1)
+    })
+  })
+
   describe('setKeepVisible method', () => {
     test('ignores the invocation if _isVisible internal flag is false', () => {
       const { plugin } = setupTest()