Indent actions belonging to a pageview (#14063)

* Proof of concept for grouping actions by the page they occur in.

* Add pageview to goals/ecommerce actionDetails in Live.getLastVisitsDetails.

* Make count of actions to display when collapsed configurable.

* Quick selector fix.

* unfinished commit

* Collapse multiple adjacent content items in the visitor log.

* Get content collapsing to work w/ 3.x-dev changes.

* Forgot to add Live config file.

* Get to work w/ visitor profile and make sure last action does not have border so it looks like it correctly ends.

* Fix some issues from review.

* More styling tweaks.

* another styling tweak

* Update screenshots.

* Show page refreshes and allow expanding them in new implementation.

* Update some screenshots.

* Make sure tooltip is replaced correctly when showing refreshes.

* Another styling tweak.

* Add UI test + fix page refresh issue.

* Fix action group merging logic.

* Fix another actions grouping issue.

* Fixes for ending left border in certain edge cases.

* Another UI tweak.

* comparison threshold, random failure fix, update screenshots + another css tweak

* more css tweaks

* possible bug fix

* Last couple CSS fixes.

* More test fixes.

11 files changed, 52 insertions, 16 deletions

diff --git a/plugins/Live/tests/Fixtures/VisitsWithAllActionsAndDevices.php b/plugins/Live/tests/Fixtures/VisitsWithAllActionsAndDevices.php
index 1603e8526a..1bd509ff1e 100644
--- a/plugins/Live/tests/Fixtures/VisitsWithAllActionsAndDevices.php
+++ b/plugins/Live/tests/Fixtures/VisitsWithAllActionsAndDevices.php
@@ -223,5 +223,8 @@ class VisitsWithAllActionsAndDevices extends Fixture
         self::checkResponse($t->doTrackPageView('home'));
 
         $t->doTrackContentImpression('product slider', 'product_16.jpg', 'http://example.org/product16');
+        $t->doTrackContentImpression('product slider', 'product_17.jpg', 'http://example.org/product17');
+        $t->doTrackContentImpression('product slider', 'product_18.jpg', 'http://example.org/product18');
+        $t->doTrackContentImpression('product zoom', 'product_18.jpg', 'http://example.org/product18');
     }
 }
\ No newline at end of file
diff --git a/plugins/Live/tests/UI/Live_spec.js b/plugins/Live/tests/UI/Live_spec.js
index 1c0d111fc0..acbd621f03 100644
--- a/plugins/Live/tests/UI/Live_spec.js
+++ b/plugins/Live/tests/UI/Live_spec.js
@@ -8,8 +8,6 @@
  */
 
 describe("Live", function () {
-    this.timeout(0);
-
     this.fixture = "Piwik\\Plugins\\Live\\tests\\Fixtures\\VisitsWithAllActionsAndDevices";
 
     after(function () {
@@ -23,6 +21,7 @@ describe("Live", function () {
         await page.goto("?module=CoreHome&action=index&idSite=1&period=year&date=2010-01-03#?idSite=1&period=year&date=2010-01-03&category=General_Visitors&subcategory=Live_VisitorLog");
 
         await page.waitForNetworkIdle();
+        await page.waitFor('.dataTableVizVisitorLog');
 
         var report = await page.$('.reporting-page');
         expect(await report.screenshot()).to.matchImage('visitor_log');
@@ -36,7 +35,35 @@ describe("Live", function () {
         expect(await report.screenshot()).to.matchImage('visitor_log_expand_actions');
     });
 
+    it('should expand collapsed pageview actions', async function() {
+        const link = await page.jQuery('.dataTableVizVisitorLog .card.row:eq(1) .show-more-actions:visible');
+        await link.click();
+
+        await page.mouse.move(-10, -10);
+
+        const report = await page.jQuery('.dataTableVizVisitorLog .card.row:eq(1)');
+        expect(await report.screenshot()).to.matchImage('visitor_log_expand_pageview_actions');
+    });
+
+    it('should expand collapsed content actions', async function() {
+        // collapse previously expanded section
+        const prevlink = await page.jQuery('.dataTableVizVisitorLog .card.row:eq(1) .show-less-actions:visible');
+        await prevlink.click();
+
+        const link = await page.jQuery('.dataTableVizVisitorLog .card.row:eq(2) .collapsed-contents:visible');
+        await link.click();
+
+        await page.mouse.move(-10, -10);
+
+        const report = await page.jQuery('.dataTableVizVisitorLog .card.row:eq(2)');
+        expect(await report.screenshot()).to.matchImage('visitor_log_expand_content_actions');
+    });
+
     it('should show visitor profile', async function() {
+        // collapse previously expanded section
+        const prevlink = await page.jQuery('.dataTableVizVisitorLog .card.row:eq(2) .collapsed-contents:visible');
+        await prevlink.click();
+
         await page.evaluate(function(){
             $('.card:first-child .visitor-log-visitor-profile-link').click();
         });
diff --git a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_log.png b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_log.png
index 5fcc726b2d..92152ce679 100644
--- a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_log.png
+++ b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_log.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:403d52d525566412b7f6556d9ea109f883fd0fdd79f1a36b0a97ab610f403d81
-size 382454
+oid sha256:ad5ef092dfd4f680395950d1c5e8e0f154c7294138bb9a8091e99d215d0a9966
+size 385839
diff --git a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_log_expand_actions.png b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_log_expand_actions.png
index 7670bd0320..7fdc3de326 100644
--- a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_log_expand_actions.png
+++ b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_log_expand_actions.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:61e520ac19eaf7e2ad0a3c000d4a9f2b422337031ec76c7895f3b92d84157e87
-size 51024
+oid sha256:9fe7032dc1800897a554a6ed30d495efe80998cea1316b6447d299bba13c69f4
+size 51479
diff --git a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_log_expand_content_actions.png b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_log_expand_content_actions.png
new file mode 100644
index 0000000000..0aab20b622
--- /dev/null
+++ b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_log_expand_content_actions.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:48c1a68c50cfcc7ee6bbe9e1d1854911fe6b75311520ca01b32bf964e80cd777
+size 39805
diff --git a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_log_expand_pageview_actions.png b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_log_expand_pageview_actions.png
new file mode 100644
index 0000000000..51e72333da
--- /dev/null
+++ b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_log_expand_pageview_actions.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:8c9f4ce6ba4fca038288a79d6b6d63e997991d055b89104ab425b2640a3e5200
+size 102079
diff --git a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile.png b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile.png
index 01108007f1..893944edcf 100644
--- a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile.png
+++ b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:239c3cff34bdc37ef6e1a0a8f85ee537d548b2b0fcf255b25ce90f436c17caa8
-size 417219
+oid sha256:2d08854b59c88e7ab971f23df667daa6bb307955879063d561673b72a6c5e7f2
+size 421449
diff --git a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_action_details.png b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_action_details.png
index c420414212..892c9813f6 100644
--- a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_action_details.png
+++ b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_action_details.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:3baf4e26d25cb2cc08ba78a0c6d199ffadc88aff819af2882abbe7706824b85f
-size 286558
+oid sha256:cce674e80509201b636013a54e144992c16065983810638677d9aea905dcded0
+size 288310
diff --git a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_actions_hidden.png b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_actions_hidden.png
index 4fc4cfc765..3991102d4e 100644
--- a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_actions_hidden.png
+++ b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_actions_hidden.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:13493d125dc03edd1e3b698e9b86056f5e38ab4744aa117cf3d350a470d79b48
-size 254843
+oid sha256:d3d4d7a3ec7beb72d14853b5a99be9a8aa2c45995975de689f2a5b8e7a17ed68
+size 255311
diff --git a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_limited.png b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_limited.png
index 690d51b874..9223b651f6 100644
--- a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_limited.png
+++ b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_limited.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:407bbf4891ff749ec90af841adf6c26848848dcc2146d016c3f9c3a4c7d8abad
-size 309267
+oid sha256:f370ad5825ad62e3e9288062040046f9f15f2c6b522418747543218b912c47c4
+size 313341
diff --git a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_visit_details.png b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_visit_details.png
index c1880e2da4..9b07892f77 100644
--- a/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_visit_details.png
+++ b/plugins/Live/tests/UI/expected-screenshots/Live_visitor_profile_visit_details.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:8ff64c409f8124f250da602fb6a4cfe2d7068245a0b70820b8ea7909b52ed1c4
-size 264543
+oid sha256:8326abd7243618a9b71f4cf341c4775c23766b5b244a5fed30db82f15b0091e1
+size 264957