Ensure refresh button is only shown where needed (#19292)

* Ensure refresh button is only shown where needed

* fix some deprecated method calls

* improve css

* updates expected UI files

* fix css

* updates expected UI files

10 files changed, 29 insertions, 33 deletions

diff --git a/plugins/CoreHome/javascripts/refresh-button.js b/plugins/CoreHome/javascripts/refresh-button.js
index 96f7176d93..de364d2a3e 100644
--- a/plugins/CoreHome/javascripts/refresh-button.js
+++ b/plugins/CoreHome/javascripts/refresh-button.js
@@ -20,7 +20,7 @@ $(function () {
   }
 
   if (isCoreHomeModuleActive()) {
-    iconRefresh.show();
+    iconRefresh.removeClass('hidden');
 
     iconRefresh.on('click', function (e) {
       e.preventDefault();
diff --git a/plugins/CoreHome/stylesheets/layout.less b/plugins/CoreHome/stylesheets/layout.less
index 90a9f68304..6c5ffb517e 100644
--- a/plugins/CoreHome/stylesheets/layout.less
+++ b/plugins/CoreHome/stylesheets/layout.less
@@ -123,8 +123,8 @@ nav {
   }
 
   &>.top_controls {
-    .icon-arrowup:before, .icon-arrowdown:before {
-      padding: 17px 0 0 0px;
+    &> .icon-arrowup:before, &> .icon-arrowdown:before, &> .icon-reload:before {
+      padding: 17px 0 0 0;
       display: inline-block;
       cursor: pointer;
 
@@ -132,17 +132,10 @@ nav {
         display: none;
       }
     }
-    .icon-reload {
-      cursor: pointer;
-
-      &:before {
-        padding-right: 10px;
-        font-weight: lighter;
 
-        @media screen and (max-width: 600px) {
-          display: none;
-        }
-      }
+    &> .icon-reload:before {
+      padding-right: 10px;
+      font-weight: lighter;
     }
   }
 
diff --git a/plugins/CoreHome/templates/_headerMessage.twig b/plugins/CoreHome/templates/_headerMessage.twig
index b1575c3321..efa5a9de5d 100644
--- a/plugins/CoreHome/templates/_headerMessage.twig
+++ b/plugins/CoreHome/templates/_headerMessage.twig
@@ -10,7 +10,9 @@
     </span>
 {% endset %}
 
-{% if (latest_version_available and not isPiwikDemo and hasSomeViewAccess and not isUserIsAnonymous and showUpdateNotificationToUser) or (isSuperUser and isAdminArea is defined and isAdminArea) %}
+{% set showVersionInfo = (latest_version_available and not isPiwikDemo and hasSomeViewAccess and not isUserIsAnonymous and showUpdateNotificationToUser) or (isSuperUser and isAdminArea is defined and isAdminArea) %}
+
+{% if showVersionInfo %}
 <div piwik-expand-on-hover
      id="header_message"
      class="piwikSelector borderedControl {% if not latest_version_available %}header_info{% else %}{% endif %} piwikTopControl {% if latest_version_available %}update_available{% endif %}"
@@ -58,10 +60,11 @@
     </div>
 </div>
 
-<span class="icon icon-reload" title="{{ 'CoreHome_Refresh'|translate }}"></span>
+{% endif %}
+
+<span class="icon icon-reload hidden" title="{{ 'CoreHome_Refresh'|translate }}"></span>
 <span class="icon icon-arrowup"></span>
+
+{% if showVersionInfo %}
 <div style="clear:right"></div>
-{% else %}
-<span class="icon icon-reload" title="{{ 'CoreHome_Refresh'|translate }}"></span>
-<span class="icon icon-arrowup"></span>
 {% endif %}
diff --git a/plugins/Goals/tests/UI/expected-screenshots/GoalsPages_manage.png b/plugins/Goals/tests/UI/expected-screenshots/GoalsPages_manage.png
index b0a0623b4b..34fedec0a5 100644
--- a/plugins/Goals/tests/UI/expected-screenshots/GoalsPages_manage.png
+++ b/plugins/Goals/tests/UI/expected-screenshots/GoalsPages_manage.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:84b0f8715ce1b4f342e60de1b6bb5087a372c99bb831a1a8a37b4c2f98fe3a19
-size 67305
+oid sha256:f8a6404773acb97da31345604564f560c805e2235a4aed7a1e8abf795182c785
+size 66748
diff --git a/plugins/Login/tests/UI/expected-screenshots/Login_bruteforcelog_noentries.png b/plugins/Login/tests/UI/expected-screenshots/Login_bruteforcelog_noentries.png
index 97a54d05df..1f0b84b090 100644
--- a/plugins/Login/tests/UI/expected-screenshots/Login_bruteforcelog_noentries.png
+++ b/plugins/Login/tests/UI/expected-screenshots/Login_bruteforcelog_noentries.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:a6ac6967549f85eaa4b36fbdc547b14c1ffc5f8b58c41050a8faa4243b6d00fa
-size 51372
+oid sha256:47b698f988ed27aa73e26ccc1036a2e19b12d21ef491c052be52944745c84279
+size 50753
diff --git a/plugins/Login/tests/UI/expected-screenshots/Login_bruteforcelog_withentries.png b/plugins/Login/tests/UI/expected-screenshots/Login_bruteforcelog_withentries.png
index 4b6f330422..175f65bf48 100644
--- a/plugins/Login/tests/UI/expected-screenshots/Login_bruteforcelog_withentries.png
+++ b/plugins/Login/tests/UI/expected-screenshots/Login_bruteforcelog_withentries.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:801cf4987aff10a8a9aff7d68702566234e7232af048a4d8ff6f3d9d812576da
-size 68588
+oid sha256:0f63bd20d066b619e26f486525bf565cb03a263432f864179d71cb249521d5a5
+size 68011
diff --git a/plugins/SegmentEditor/tests/UI/SegmentSelectorEditor_spec.js b/plugins/SegmentEditor/tests/UI/SegmentSelectorEditor_spec.js
index d11aaea225..738868ae90 100644
--- a/plugins/SegmentEditor/tests/UI/SegmentSelectorEditor_spec.js
+++ b/plugins/SegmentEditor/tests/UI/SegmentSelectorEditor_spec.js
@@ -117,7 +117,7 @@ describe("SegmentSelectorEditorTest", function () {
           await page.evaluate(function (i) {
             $(`.metricValueBlock input:eq(${i})`).val('value ' + i).change();
           }, i);
-          await page.waitFor(200);
+          await page.waitForTimeout(200);
         }
 
         await page.type('input.edit_segment_name', 'new segment');
@@ -165,10 +165,10 @@ describe("SegmentSelectorEditorTest", function () {
           await page.evaluate(function (i) {
             $(`.metricValueBlock input:eq(${i})`).val('new value ' + i).change();
           }, i);
-          await page.waitFor(200);
+          await page.waitForTimeout(200);
         }
 
-        await page.waitFor(200);
+        await page.waitForTimeout(200);
 
         await page.evaluate(function () {
            $('button.saveAndApply').click();
@@ -296,7 +296,7 @@ describe("SegmentSelectorEditorTest", function () {
             $('.segmentRow1 .metricValueBlock input').val(complexValue).change();
         });
 
-        await page.waitFor(200);
+        await page.waitForTimeout(200);
 
         await page.evaluate(function () {
             $('button.saveAndApply').click();
@@ -340,7 +340,7 @@ describe("SegmentSelectorEditorTest", function () {
             console.log(dialog.message());
         });
 
-        await page.waitFor(200);
+        await page.waitForTimeout(200);
 
         await page.evaluate(function () {
             $('button.saveAndApply').click();
diff --git a/plugins/UsersManager/tests/UI/UsersManager_spec.js b/plugins/UsersManager/tests/UI/UsersManager_spec.js
index 1ff59e8477..03b620e0c5 100644
--- a/plugins/UsersManager/tests/UI/UsersManager_spec.js
+++ b/plugins/UsersManager/tests/UI/UsersManager_spec.js
@@ -490,7 +490,7 @@ describe("UsersManager", function () {
         await page.evaluate(function () {
             $('.userEditForm #user_email').val('testlogin3@example.com').change();
         });
-        await page.waitFor(100);
+        await page.waitForTimeout(100);
 
         var btnSave = await page.jQuery('.userEditForm .basic-info-tab .matomo-save-button .btn', { waitFor: true });
         await btnSave.click();
diff --git a/tests/UI/expected-screenshots/Menus_mobile_top.png b/tests/UI/expected-screenshots/Menus_mobile_top.png
index 111ce4261f..d805ea9e7b 100644
--- a/tests/UI/expected-screenshots/Menus_mobile_top.png
+++ b/tests/UI/expected-screenshots/Menus_mobile_top.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:9138683e1df1a27477780cd18d6f2cdc4eacb7b36438bea46e47012b8bcda564
-size 176630
+oid sha256:3934ce1630db57efd1094686bf0776b21ebe87789040b58e6fcbbfa363c28734
+size 176190
diff --git a/tests/UI/specs/UIIntegration_spec.js b/tests/UI/specs/UIIntegration_spec.js
index 5655a10558..a10881f9f5 100644
--- a/tests/UI/specs/UIIntegration_spec.js
+++ b/tests/UI/specs/UIIntegration_spec.js
@@ -250,7 +250,7 @@ describe("UIIntegrationTest", function () { // TODO: Rename to Piwik?
         it('should reload the visitors > overview page when clicking on the visitors overview page element again', async function () {
             await page.click('#secondNavBar ul li.active li.active a.item');
             await page.waitForNetworkIdle();
-            await page.waitFor('.piwik-graph');
+            await page.waitForSelector('.piwik-graph');
 
             pageWrap = await page.$('.pageWrap');
             expect(await pageWrap.screenshot()).to.matchImage('visitors_overview');