diff --git a/functional-tests/constants.js b/functional-tests/constants.js
index 83db68806..c5c7b9a3b 100644
--- a/functional-tests/constants.js
+++ b/functional-tests/constants.js
@@ -40,6 +40,9 @@ exports.SELECTOR_BOX_PREVIEW_PAGE_NUM_WRAPPER = '.bp-page-num-wrapper';
 exports.SELECTOR_BOX_PREVIEW_ERROR = '.bp-error';
 exports.SELECTOR_BOX_PREVIEW_NAV_VISIBLE = '.bp-is-navigation-visible';
 
+exports.CLASS_CONTAINER = '.bp-container';
+exports.CLASS_CONTROLS_CONTAINER = '.bp-media-controls-container';
+exports.CLASS_CONTROLS_WRAPPER = '.bp-controls-wrapper';
 exports.CLASS_BOX_PREVIEW_LOADING_WRAPPER = '.bp-loading-wrapper';
 
 exports.TEXT_1080P = '1080p';
diff --git a/functional-tests/controls_test.js b/functional-tests/controls_test.js
index 9483ff6cf..9729294ae 100644
--- a/functional-tests/controls_test.js
+++ b/functional-tests/controls_test.js
@@ -13,7 +13,7 @@ const {
 } = require('./constants');
 const assert = require('assert');
 
-const { makeNavAppear, zoom, getIsFullscreen, showPreview } = require('./helpers');
+const { makeNavAppear, zoom, getIsFullscreen, showPreview, showDocumentControls } = require('./helpers');
 
 const { CI } = process.env;
 
@@ -50,7 +50,7 @@ Scenario('Check document preview zoom @ci @chrome @firefox @edge @ie @safari @an
 Scenario('Check document preview navigation @ci @chrome @firefox @edge @ie @safari @android @ios', function*(I) {
     const FIRST_PAGE = '#bp-page-1';
     const SECOND_PAGE = '#bp-page-2';
-
+    showDocumentControls(I);
     makeNavAppear(I);
 
     // go to page 2
@@ -86,7 +86,7 @@ Scenario('Check document preview navigation @ci @chrome @firefox @edge @ie @safa
 });
 
 Scenario('Check document preview fullscreen @ci @chrome @firefox @edge @ie @safari @android @ios', function*(I) {
-    makeNavAppear(I);
+    showDocumentControls(I);
 
     // Enter fullscreem
     I.waitForVisible(SELECTOR_BOX_PREVIEW_ENTER_FULLSCREEN_ICON);
@@ -97,7 +97,7 @@ Scenario('Check document preview fullscreen @ci @chrome @firefox @edge @ie @safa
 
     assert.ok(isFullscreen);
 
-    makeNavAppear(I);
+    showDocumentControls(I);
 
     // Exit fullscreem
     I.waitForVisible(SELECTOR_BOX_PREVIEW_EXIT_FULLSCREEN_ICON);
diff --git a/functional-tests/fileOptions_test.js b/functional-tests/fileOptions_test.js
index 6ac8beaee..cc783d5f0 100644
--- a/functional-tests/fileOptions_test.js
+++ b/functional-tests/fileOptions_test.js
@@ -7,7 +7,7 @@ const {
     FILE_ID_MP3
 } = require('./constants');
 
-const { makeNavAppear, disableDash, showPreview } = require('./helpers');
+const { showMediaControls, showDocumentControls, disableDash, showPreview } = require('./helpers');
 
 const { CI } = process.env;
 const DOC_START = '2';
@@ -50,21 +50,21 @@ Scenario(
         // Document
         showPreview(I, FILE_ID_DOC, { fileOptions });
 
-        makeNavAppear(I);
+        showDocumentControls(I);
         I.waitForVisible(SELECTOR_DOC_CURRENT_PAGE);
         I.seeTextEquals(DOC_START, SELECTOR_DOC_CURRENT_PAGE);
 
         // Video (DASH)
         showPreview(I, FILE_ID_VIDEO, { fileOptions });
 
-        makeNavAppear(I, SELECTOR_VIDEO);
+        showMediaControls(I, SELECTOR_VIDEO);
         I.waitForVisible(SELECTOR_MEDIA_TIMESTAMP);
         I.seeTextEquals(VIDEO_START, SELECTOR_MEDIA_TIMESTAMP);
 
         // MP3
         showPreview(I, FILE_ID_MP3, { fileOptions });
 
-        makeNavAppear(I);
+        showMediaControls(I);
         I.waitForVisible(SELECTOR_MEDIA_TIMESTAMP);
         I.seeTextEquals(MP3_START, SELECTOR_MEDIA_TIMESTAMP);
 
@@ -72,7 +72,7 @@ Scenario(
         disableDash(I);
         showPreview(I, FILE_ID_VIDEO, { fileOptions });
 
-        makeNavAppear(I, SELECTOR_VIDEO);
+        showMediaControls(I, SELECTOR_VIDEO);
         I.waitForVisible(SELECTOR_MEDIA_TIMESTAMP);
         I.seeTextEquals(VIDEO_START, SELECTOR_MEDIA_TIMESTAMP);
     }
@@ -83,14 +83,14 @@ Scenario('Check preview starts at correct spot for all file types @ci @ie', { re
     // Video (DASH)
     showPreview(I, FILE_ID_VIDEO, { fileOptions });
 
-    makeNavAppear(I, SELECTOR_VIDEO);
+    showMediaControls(I, SELECTOR_VIDEO);
     I.waitForVisible(SELECTOR_MEDIA_TIMESTAMP);
     I.seeTextEquals(VIDEO_START, SELECTOR_MEDIA_TIMESTAMP);
 
     // Document
     showPreview(I, FILE_ID_DOC, { fileOptions });
 
-    makeNavAppear(I);
+    showDocumentControls(I);
     I.waitForVisible(SELECTOR_DOC_CURRENT_PAGE);
     I.seeTextEquals(DOC_START, SELECTOR_DOC_CURRENT_PAGE);
 
@@ -98,7 +98,7 @@ Scenario('Check preview starts at correct spot for all file types @ci @ie', { re
     disableDash(I);
     showPreview(I, FILE_ID_VIDEO, { fileOptions });
 
-    makeNavAppear(I, SELECTOR_VIDEO);
+    showMediaControls(I, SELECTOR_VIDEO);
     I.waitForVisible(SELECTOR_MEDIA_TIMESTAMP);
     I.seeTextEquals(VIDEO_START, SELECTOR_MEDIA_TIMESTAMP);
 });
diff --git a/functional-tests/helpers.js b/functional-tests/helpers.js
index 01760f2fa..4bd94e6c7 100644
--- a/functional-tests/helpers.js
+++ b/functional-tests/helpers.js
@@ -3,7 +3,10 @@ const {
     CLASS_BOX_PREVIEW_LOADING_WRAPPER,
     SELECTOR_BOX_PREVIEW_LOADED,
     SELECTOR_BOX_PREVIEW_NAV_VISIBLE,
-    FILE_ID_DOC
+    FILE_ID_DOC,
+    CLASS_CONTAINER,
+    CLASS_CONTROLS_WRAPPER,
+    CLASS_CONTROLS_CONTAINER
 } = require('./constants');
 
 const { BROWSER_PLATFORM } = process.env;
@@ -124,10 +127,31 @@ exports.showPreview = (I, fileId = FILE_ID_DOC, options = {}) => {
 
     waitForLoad(I);
 };
+exports.showMediaControls = (I) => {
+    I.executeScript(function(containerClass) {
+        var container = document.querySelector(containerClass);
+        container.classList.add('bp-media-controls-is-visible');
+    }, CLASS_CONTAINER);
+    I.waitForVisible(CLASS_CONTROLS_CONTAINER);
+};
+/**
+ * Shows the document controls
+ * @param {Object} I - the codeceptjs I
+ *
+ * @return {void}
+ */
+function showDocumentControls(I) {
+    I.executeScript(function(containerClass) {
+        var container = document.querySelector(containerClass);
+        container.classList.add('box-show-preview-controls');
+    }, CLASS_CONTAINER);
+    I.waitForVisible(CLASS_CONTROLS_WRAPPER);
+}
+exports.showDocumentControls = showDocumentControls;
 /* eslint-enable prefer-arrow-callback, no-var */
 
 exports.zoom = (I, selector) => {
-    makeNavAppear(I);
+    showDocumentControls(I);
     I.waitForVisible(selector);
     I.click(selector);
 };
diff --git a/functional-tests/mediaControls_test.js b/functional-tests/mediaControls_test.js
index 9c0ade715..acaf03f8d 100644
--- a/functional-tests/mediaControls_test.js
+++ b/functional-tests/mediaControls_test.js
@@ -25,7 +25,7 @@ const {
     TEXT_1080P
 } = require('./constants');
 
-const { showPreview, makeNavAppear, disableDash } = require('./helpers');
+const { showPreview, showMediaControls, disableDash } = require('./helpers');
 
 const { CI } = process.env;
 const DEFAULT_START = '0:00';
@@ -48,7 +48,7 @@ Scenario(
         // Video (DASH)
         showPreview(I, FILE_ID_VIDEO);
 
-        makeNavAppear(I, SELECTOR_VIDEO);
+        showMediaControls(I, SELECTOR_VIDEO);
         I.waitForVisible(SELECTOR_MEDIA_TIMESTAMP);
         I.seeTextEquals(DEFAULT_START, SELECTOR_MEDIA_TIMESTAMP);
         I.seeTextEquals(VIDEO_DURATION, SELECTOR_MEDIA_DURATION);
@@ -57,7 +57,7 @@ Scenario(
         showPreview(I, FILE_ID_VIDEO_SUBTITLES_TRACKS);
 
         I.waitForElement(SELECTOR_BOX_PREVIEW_DASH);
-        makeNavAppear(I, SELECTOR_VIDEO);
+        showMediaControls(I, SELECTOR_VIDEO);
         I.waitForVisible(SELECTOR_MEDIA_TIMESTAMP);
         I.seeTextEquals(DEFAULT_START, SELECTOR_MEDIA_TIMESTAMP);
         I.seeTextEquals(VIDEO_WITH_SUBTITLES_TRACKS_DURATION, SELECTOR_MEDIA_DURATION);
@@ -66,7 +66,7 @@ Scenario(
         showPreview(I, FILE_ID_MP3);
 
         I.waitForElement(SELECTOR_BOX_PREVIEW_MP3);
-        makeNavAppear(I);
+        showMediaControls(I);
         I.waitForVisible(SELECTOR_MEDIA_TIMESTAMP);
         I.seeTextEquals(DEFAULT_START, SELECTOR_MEDIA_TIMESTAMP);
         I.seeTextEquals(AUDIO_DURATION, SELECTOR_MEDIA_DURATION);
@@ -77,7 +77,7 @@ Scenario(
 
         I.waitForElement(CLASS_BOX_PREVIEW_LOADING_WRAPPER);
         I.waitForElement(SELECTOR_BOX_PREVIEW_MP4);
-        makeNavAppear(I, SELECTOR_VIDEO);
+        showMediaControls(I, SELECTOR_VIDEO);
         I.waitForVisible(SELECTOR_MEDIA_TIMESTAMP);
         I.seeTextEquals(DEFAULT_START, SELECTOR_MEDIA_TIMESTAMP);
         I.seeTextEquals(VIDEO_DURATION, SELECTOR_MEDIA_DURATION);
@@ -94,7 +94,7 @@ Scenario(
         showPreview(I, FILE_ID_VIDEO);
 
         I.waitForElement(SELECTOR_BOX_PREVIEW_DASH);
-        makeNavAppear(I, SELECTOR_VIDEO);
+        showMediaControls(I, SELECTOR_VIDEO);
         I.waitForVisible(SELECTOR_MEDIA_CONTROLS_GEAR);
         // Click on the Gear
         I.click(SELECTOR_MEDIA_CONTROLS_GEAR);
@@ -112,7 +112,7 @@ Scenario(
         showPreview(I, FILE_ID_VIDEO_SUBTITLES_TRACKS);
 
         I.waitForElement(SELECTOR_BOX_PREVIEW_DASH);
-        makeNavAppear(I, SELECTOR_VIDEO);
+        showMediaControls(I, SELECTOR_VIDEO);
         // Wait for the CC button to be visisble
         I.waitForVisible(SELECTOR_MEDIA_CONTROLS_CC_ICON);
         // Look for this class bp-media-settings-subtitles-on
@@ -142,7 +142,7 @@ Scenario(
         showPreview(I, FILE_ID_VIDEO_SMALL);
 
         I.waitForElement(SELECTOR_MEDIA_CONTAINER);
-        makeNavAppear(I, SELECTOR_VIDEO);
+        showMediaControls(I, SELECTOR_VIDEO);
         // Click on the Gear
         I.waitForVisible(SELECTOR_MEDIA_CONTROLS_GEAR);
         I.click(SELECTOR_MEDIA_CONTROLS_GEAR);
diff --git a/functional-tests/run-all.js b/functional-tests/run-all.js
old mode 100644
new mode 100755