1 files changed, 183 insertions, 0 deletions
diff --git a/javascript/videojs/test/unit/reset-ui.test.js b/javascript/videojs/test/unit/reset-ui.test.js
new file mode 100644
index 0000000..14bea1f
--- /dev/null
+++ b/javascript/videojs/test/unit/reset-ui.test.js
@@ -0,0 +1,183 @@
+/* eslint-env qunit */
+import TestHelpers from './test-helpers.js';
+import {createTimeRanges} from '../../src/js/utils/time.js';
+import sinon from 'sinon';
+QUnit.module('player reset-ui');
+
+QUnit.test('Calling resetProgressBar should reset the components displaying time related values', function(assert) {
+  const clock = sinon.useFakeTimers();
+  const player = TestHelpers.makePlayer({controls: true});
+
+  clock.tick(1000);
+  player.trigger('ready');
+  player.buffered = function() {
+    return createTimeRanges(0, 5);
+  };
+  player.duration(40);
+  player.currentTime(20);
+
+  const {
+    currentTimeDisplay,
+    durationDisplay,
+    remainingTimeDisplay,
+    progressControl: {
+      seekBar
+    }
+  } = player.controlBar;
+
+  clock.tick(30);
+
+  player.trigger('timeupdate');
+  player.trigger('progress');
+
+  clock.tick(30);
+
+  // Current time display
+  assert.equal(currentTimeDisplay.textNode_.textContent, '0:20', 'current time display is 0:20');
+  // Duration display
+  assert.equal(durationDisplay.textNode_.textContent, '0:40', 'duration display is 0:40');
+  // Remaining time display
+  assert.equal(remainingTimeDisplay.textNode_.textContent, '0:20', 'remaining time display is 0:20');
+  // Seek bar
+  assert.equal(seekBar.getProgress(), '0.5', 'seek bar progress is 0.5');
+  assert.equal(seekBar.getAttribute('aria-valuetext'), '0:20 of 0:40', 'seek bar progress holder aria value text is 0:20 of 0:40');
+  assert.equal(seekBar.getAttribute('aria-valuenow'), '50.00', 'seek bar progress holder aria value now is 50.00');
+  // Load progress
+  assert.equal(seekBar.loadProgressBar.el().textContent, 'Loaded: 12.50%', 'load progress bar textContent is Loaded: 12.50%');
+  assert.equal(seekBar.loadProgressBar.el().style.width, '12.5%', 'load progress bar width is 12.5%');
+  // Play progress
+  assert.equal(seekBar.playProgressBar.el().textContent, '0:20', 'player progress bar textContent is 0:20');
+  assert.equal(seekBar.playProgressBar.el().style.width, '50%', 'player progress bar width is 50%');
+  assert.equal(seekBar.playProgressBar.timeTooltip.el().textContent, '0:20', 'player progress bar time tooltip is 0:20');
+
+  // Do reset
+  player.resetProgressBar_();
+  // Allows to have a duration state similar to player.reset() by combining the durationchange
+  player.duration(NaN);
+  player.trigger('durationchange');
+  clock.tick(30);
+
+  const calculateDistance = sinon.spy(seekBar, 'calculateDistance');
+
+  // Simulate a mouse move
+  seekBar.handleMouseMove({ offsetX: 1 });
+
+  assert.equal(player.currentTime(), 0, 'player current time is 0');
+
+  // Current time display
+  assert.equal(currentTimeDisplay.textNode_.textContent, '0:00', 'current time display is 0:00');
+  // Duration display
+  assert.equal(durationDisplay.textNode_.textContent, '-:-', 'duration display is -:-');
+  // Remaining time display
+  assert.equal(remainingTimeDisplay.textNode_.textContent, '-:-', 'remaining time display is -:-');
+  // Seek bar
+  assert.equal(seekBar.getProgress(), '0', 'seek bar progress is 0');
+  assert.equal(seekBar.getAttribute('aria-valuetext'), '0:00 of -:-', 'seek bar progress holder aria value text is 0:00 of -:-');
+  assert.equal(seekBar.getAttribute('aria-valuenow'), '0.00', 'seek bar progress holder aria value now is 0.00');
+  assert.ok(!calculateDistance.called, 'calculateDistance was not called');
+  // Load progress
+  assert.equal(seekBar.loadProgressBar.el().textContent, 'Loaded: 0.00%', 'load progress bar textContent is Loaded: 0.00%');
+  assert.equal(seekBar.loadProgressBar.el().style.width, '0%', 'load progress bar width is 0%');
+  // Play progress
+  assert.equal(seekBar.playProgressBar.el().textContent, '0:00', 'player progress bar textContent is 0:00');
+  assert.equal(seekBar.playProgressBar.el().style.width, '0%', 'player progress bar width is 0%');
+  assert.equal(seekBar.playProgressBar.timeTooltip.el().textContent, '0:00', 'player progress bar time tooltip is 0:00');
+
+  clock.restore();
+  calculateDistance.restore();
+  player.dispose();
+});
+
+QUnit.test('Calling resetProgressBar_ player method when no durationDisplay or remainingTimeDisplay controls exist', function(assert) {
+  const player = TestHelpers.makePlayer({
+    children: {
+      controlBar: {}
+    },
+    controlBar: {
+      children: {
+        playToggle: {}
+      }
+    }
+  });
+
+  player.currentTime(20);
+  player.resetProgressBar_();
+
+  assert.equal(
+    player.currentTime(), 0,
+    'player current time is 0'
+  );
+  player.dispose();
+});
+
+QUnit.test('Calling resetPlaybackRate player method should place play rate at 1x', function(assert) {
+  const player = TestHelpers.makePlayer({techOrder: ['html5']});
+
+  player.playbackRate(2);
+  player.handleTechRateChange_();
+  player.resetPlaybackRate_();
+  const defaultRate = player.defaultPlaybackRate();
+
+  assert.equal(
+    player.controlBar.playbackRateMenuButton.labelEl_.textContent, defaultRate + 'x',
+    'Playback rate is the default one on the UI'
+  );
+  assert.equal(
+    player.playbackRate(), defaultRate,
+    'Playback rate is the default one on the player object'
+  );
+  player.dispose();
+});
+
+QUnit.test('Calling resetVolumeBar player method should reset volume bar', function(assert) {
+  const player = TestHelpers.makePlayer({ techOrder: ['html5'] });
+
+  player.volume(0.5);
+
+  player.trigger('volumechange');
+
+  assert.equal(player.controlBar.volumePanel.volumeControl.volumeBar.el_.getAttribute('aria-valuenow'), 50, 'UI value of VolumeBar is 50');
+
+  player.resetVolumeBar_();
+
+  assert.equal(player.controlBar.volumePanel.volumeControl.volumeBar.el_.getAttribute('aria-valuenow'), 100, 'UI value of VolumeBar is 100');
+
+  player.dispose();
+});
+
+QUnit.test('Calling reset player method should reset both error display and player error', function(assert) {
+  const player = TestHelpers.makePlayer({techOrder: ['html5']});
+
+  player.error('ERROR');
+
+  assert.notOk(player.errorDisplay.hasClass('vjs-hidden'), 'ErrorDisplay is displayed if there is an error');
+  assert.strictEqual(player.error().message, 'ERROR', 'player error has content');
+
+  player.reset();
+
+  assert.ok(player.errorDisplay.hasClass('vjs-hidden'), 'ErrorDisplay is not displayed if there is no error');
+  assert.strictEqual(player.error(), null, 'player error has content');
+
+  player.dispose();
+});
+
+QUnit.test('Calling reset player method should reset title bar', function(assert) {
+  const player = TestHelpers.makePlayer();
+
+  player.titleBar.update({
+    title: 'Title',
+    description: 'Description'
+  });
+
+  assert.notOk(player.titleBar.hasClass('vjs-hidden'), 'TitleBar is visible if not empty');
+  assert.strictEqual(player.titleBar.els.title.textContent, 'Title', 'TitleBar title element has content');
+  assert.strictEqual(player.titleBar.els.description.textContent, 'Description', 'TitleBar description element has content');
+
+  player.reset();
+
+  assert.ok(player.titleBar.hasClass('vjs-hidden'), 'TitleBar is not visible if empty');
+  assert.strictEqual(player.titleBar.els.title.textContent, '', 'TitleBar title element has no content');
+  assert.strictEqual(player.titleBar.els.description.textContent, '', 'TitleBar description element has no content');
+
+  player.dispose();
+});