Improvements to the in-app feature rating mechanism (#18280)

* Changes to in-app feedback mechanism

* Fix for dialog close issue

* Update plugins/Feedback/API.php

Co-authored-by: Stefan Giehl <stefan@matomo.org>

* Update plugins/Feedback/lang/en.json

Co-authored-by: Stefan Giehl <stefan@matomo.org>

* Update plugins/Feedback/lang/en.json

Co-authored-by: Stefan Giehl <stefan@matomo.org>

* Update plugins/Feedback/lang/en.json

Co-authored-by: Stefan Giehl <stefan@matomo.org>

* Update plugins/Feedback/lang/en.json

Co-authored-by: Stefan Giehl <stefan@matomo.org>

* Update plugins/Feedback/lang/en.json

Co-authored-by: Stefan Giehl <stefan@matomo.org>

* Added UI tests

* UI improvements, shorter questions text, autofocus text field

* Layout tweaks

* Added custom questions for like choices

* Fix for UI tests, added UI screenshot

* Updated UI test screenshots

* Updated UI test screenshots

* Build vue

* built vue files

* Update plugins/Feedback/lang/en.json

Co-authored-by: Stefan Giehl <stefan@matomo.org>

* Tidied message validation, text fixes, added privacy policy link

* built vue files

* Update plugins/Feedback/API.php

* Update plugins/Feedback/API.php

* built vue files

* Added missing selection.json

* Restored deleted ReviewLinks which is to be displayed after a positive Rate Feature

* built vue files

* Added null check for javascript focus call

* built vue files

* Remove unnecessary inline test check for rate feature feedback mail

* Updated UI test screenshot

Co-authored-by: Stefan Giehl <stefan@matomo.org>
Co-authored-by: bx80 <bx80@users.noreply.github.com>
Co-authored-by: sgiehl <sgiehl@users.noreply.github.com>

5 files changed, 100 insertions, 0 deletions

diff --git a/plugins/Feedback/tests/UI/RateFeature_spec.js b/plugins/Feedback/tests/UI/RateFeature_spec.js
new file mode 100644
index 0000000000..829e656550
--- /dev/null
+++ b/plugins/Feedback/tests/UI/RateFeature_spec.js
@@ -0,0 +1,88 @@
+/*!
+ * Matomo - free/libre analytics platform
+ *
+ * UsersManager screenshot tests.
+ *
+ * @link https://matomo.org
+ * @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
+ */
+
+describe("RateFeature", function () {
+    this.timeout(0);
+
+    var url = "?module=CoreHome&action=index&idSite=1&period=day&date=yesterday#?idSite=1&period=day&date=yesterday&segment=&category=General_Visitors&subcategory=General_Overview";
+
+    before(async function() {
+        await page.webpage.setViewport({
+            width: 1250,
+            height: 768
+        });
+    });
+
+    it('should display the like feature popup', async function () {
+        await page.goto(url);
+        await page.waitForNetworkIdle();
+
+        const like = await page.$('.like-icon');
+        await like.evaluate(b => b.click());
+
+        var modal = await page.waitForSelector('.modal.open', { visible: true });
+
+        await page.waitForTimeout(1000);
+
+        expect(await modal.screenshot()).to.matchImage('rate_feature_like_questions');
+    });
+
+    it('should accept like feedback', async function () {
+
+        const useful = await page.$('#useful');
+        await useful.evaluate(b => b.click());
+
+        await page.type('#feedbacktext', 'test');
+
+        const submit = await page.$('a.modal-action:nth-child(1)');
+        await submit.click();
+        await page.waitForNetworkIdle();
+
+        var modal = await page.waitForSelector('.modal.open', { visible: true });
+        expect(await modal.screenshot()).to.matchImage('rate_feature_like_submit');
+    });
+
+    it('should display the dislike feature popup', async function () {
+        await page.goto(url);
+        await page.waitForNetworkIdle();
+
+        const like = await page.$('.dislike-icon');
+        await like.evaluate(b => b.click());
+
+        var modal = await page.waitForSelector('.modal.open', { visible: true });
+
+        await page.waitForTimeout(1000);
+
+        expect(await modal.screenshot()).to.matchImage('rate_feature_dislike_questions');
+    });
+
+    it('should accept dislike feedback', async function () {
+
+        const useful = await page.$('#missingfeatures');
+        await useful.evaluate(b => b.click());
+
+        await page.type('#feedbacktext', 'test');
+
+        const submit = await page.$('a.modal-action:nth-child(1)');
+        await submit.click();
+        await page.waitForNetworkIdle();
+
+        var modal = await page.waitForSelector('.modal.open', { visible: true });
+        expect(await modal.screenshot()).to.matchImage('rate_feature_dislike_submit');
+    });
+
+    function delay(interval) {
+       return it('should delay', done =>
+       {
+          setTimeout(() => done(), interval)
+       }).timeout(interval + 100);
+    }
+
+
+});
diff --git a/plugins/Feedback/tests/UI/expected-screenshots/RateFeature_rate_feature_dislike_questions.png b/plugins/Feedback/tests/UI/expected-screenshots/RateFeature_rate_feature_dislike_questions.png
new file mode 100644
index 0000000000..25284e5e08
--- /dev/null
+++ b/plugins/Feedback/tests/UI/expected-screenshots/RateFeature_rate_feature_dislike_questions.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:0740df6c25fc9e54c468f60cacfecb012285f40a7e317d92cf19a63e32bd96d3
+size 23521
diff --git a/plugins/Feedback/tests/UI/expected-screenshots/RateFeature_rate_feature_dislike_submit.png b/plugins/Feedback/tests/UI/expected-screenshots/RateFeature_rate_feature_dislike_submit.png
new file mode 100644
index 0000000000..1520c52004
--- /dev/null
+++ b/plugins/Feedback/tests/UI/expected-screenshots/RateFeature_rate_feature_dislike_submit.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:1e4aa120799b510a349c6772ef725db93b1ba181f7007899102f699e38bb8ee1
+size 11859
diff --git a/plugins/Feedback/tests/UI/expected-screenshots/RateFeature_rate_feature_like_questions.png b/plugins/Feedback/tests/UI/expected-screenshots/RateFeature_rate_feature_like_questions.png
new file mode 100644
index 0000000000..f5446c33f6
--- /dev/null
+++ b/plugins/Feedback/tests/UI/expected-screenshots/RateFeature_rate_feature_like_questions.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:dd45b8f1ef3ae54c87779ac722d144cd4ec7cf4851ee38c7faa416e06e52e9db
+size 21922
diff --git a/plugins/Feedback/tests/UI/expected-screenshots/RateFeature_rate_feature_like_submit.png b/plugins/Feedback/tests/UI/expected-screenshots/RateFeature_rate_feature_like_submit.png
new file mode 100644
index 0000000000..27f2f2bc30
--- /dev/null
+++ b/plugins/Feedback/tests/UI/expected-screenshots/RateFeature_rate_feature_like_submit.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:84eda11b8aad6af6fe793e2bfd8bf8b6f054a8449c8c8c3e188196195420fa21
+size 32793