Cherry picked Fixed alert condition not reloading on site change

CHANGELOG.md

@@ -1,5 +1,6 @@
 ## Changelog
 
+* 4.1.1 Fixed alert conditions not reloading on site change
 * 4.1.0 Migrate AngularJS to Vue
 * 4.0.4 Fixed autocomplete for country to trigger alerts
 * 4.0.3 Grouped alert condition select in UI

plugin.json

@@ -1,7 +1,7 @@
 {
     "name": "CustomAlerts",
     "description": "Create custom Alerts to be notified of important changes on your website or app! ",
-    "version": "4.1.0",
+    "version": "4.1.1",
     "require": {
         "matomo": ">=4.10.0-b1,<5.0.0-b1"
     },

tests/Fixtures/CustomAlerts.php

@@ -11,6 +11,7 @@
 use Piwik\Piwik;
 use Piwik\Plugins\CustomAlerts\Model;
 use Piwik\Tests\Framework\Fixture;
+use Piwik\Plugins\Goals\API;
 
 /**
  * Tracks custom events
@@ -32,6 +33,13 @@ private function setUpWebsites()
         if (!self::siteCreated($idSite = 1)) {
             self::createWebsite($this->dateTime);
         }
+
+        // tests run in UTC, the Tracker in UTC
+        if (!self::siteCreated($idSite = 2)) {
+            self::createWebsite($this->dateTime);
+        }
+
+        API::getInstance()->addGoal($idSite, 'Goal for idSite 2', 'title', 'normal title', 'exact', true, 50, true);
     }
 
     private function addAlerts()

tests/UI/CustomAlerts_spec.js

@@ -33,8 +33,37 @@ describe("CustomAlerts", function () {
         expect(await elem.screenshot()).to.matchImage('edit');
     });
 
+    it('should reload alert conditions when site is changed', async function () {
+        await page.evaluate(function() {
+            $('.siteSelector .dropdown li:contains("Piwik test"):last').click();
+        });
+        await page.waitForNetworkIdle();
+        await page.evaluate(function() {
+            $('.expandableSelector .select-wrapper').click();
+            $('.expandableSelector li:contains("Goals"):first:parent .secondLevel').show();
+        });
+        await page.waitForNetworkIdle();
+        const elem = await page.$('.pageWrap');
+        await page.waitForTimeout(350); // wait for animation
+        expect(await elem.screenshot()).to.matchImage('alert_condition_reloaded_site2');
+    });
+
+    it('should reload alert conditions when site is changed back', async function () {
+        await page.evaluate(function() {
+            $('.siteSelector .dropdown li:contains("Piwik test"):first').click();
+        });
+        await page.waitForNetworkIdle();
+        await page.waitForNetworkIdle();
+        const elem = await page.$('.pageWrap');
+        await page.waitForTimeout(350); // wait for animation
+        expect(await elem.screenshot()).to.matchImage('alert_condition_reloaded_site1');
+    });
+
     it('should save changed alert', async function () {
         // only check if name was changed in list, no need to make a screenshot
+        await page.evaluate(function() {
+            $('.expandableSelector .select-wrapper').click();
+        });
         await page.type('#alertName', ' changed');
         await page.click('.matomo-save-button');
         await page.waitForNetworkIdle();

vue/src/EditAlert/EditAlert.vue

@@ -480,7 +480,7 @@ export default defineComponent({
         method: 'API.getReportMetadata',
         date: Matomo.currentDateString,
         period: this.actualAlert.period,
-        idSites: this.actualAlert.id_sites,
+        idSite: this.actualAlert.id_sites?.[0],
         filter_limit: '-1',
       }).then((data) => {
         this.renderForm(data);