Fix comparison trends might be displayed incorrect for certain languages (#18832)

* Fix comparison trends might be displayed incorrect for certain languages

* update tests

* include trend values only when requested

* updates expected tests files

* add some code comments

* Adds ui tests for comparison sparklines in other language

* init sparklines after document fully loaded

Co-authored-by: diosmosis <diosmosis@users.noreply.github.com>

2 files changed, 17 insertions, 0 deletions

diff --git a/tests/UI/expected-screenshots/Comparison_visits_overview_widget_sv.png b/tests/UI/expected-screenshots/Comparison_visits_overview_widget_sv.png
new file mode 100644
index 0000000000..c020741684
--- /dev/null
+++ b/tests/UI/expected-screenshots/Comparison_visits_overview_widget_sv.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:a170b350af9aec503f895c76483a0285b663d789cdeb445f1838e7b298eeecc2
+size 235286
diff --git a/tests/UI/specs/Comparison_spec.js b/tests/UI/specs/Comparison_spec.js
index 9e92e9c597..7b29345b4f 100644
--- a/tests/UI/specs/Comparison_spec.js
+++ b/tests/UI/specs/Comparison_spec.js
@@ -31,6 +31,9 @@ describe("Comparison", function () {
             + "actionToWidgetize=getSearchEngines&viewDataTable=table&filter_limit=5&isFooterExpandedInDashboard=1" + comparePeriod,
         visitOverviewWidget = "?module=Widgetize&action=iframe&containerId=VisitOverviewWithGraph&disableLink=0&widget=1&" +
             "moduleToWidgetize=CoreHome&actionToWidgetize=renderWidgetContainer&disableLink=1&widget=1&" + generalParams + "&" +
+            compareParams,
+        visitOverviewSparklines = "?module=Widgetize&action=iframe&disableLink=1&widget=1&" +
+            "moduleToWidgetize=VisitsSummary&actionToWidgetize=get&forceView=1&viewDataTable=sparklines&" + generalParams + "&" +
             compareParams
     ;
 
@@ -259,4 +262,15 @@ describe("Comparison", function () {
         await page.waitForNetworkIdle();
         expect(await page.screenshot({ fullPage: true })).to.matchImage('visits_overview_widget');
     });
+
+    it('should show evolution metrics correctly formatted in other language', async () => {
+        await page.goto(visitOverviewSparklines + '&language=sv');
+        await page.waitForNetworkIdle();
+        await page.evaluate(function(){
+            // replace all metric names with `metric name` to avoid test failures when metric translation changes
+            $('.sparkline-metrics').each(function(){ $(this).html($(this).find('strong').prop('outerHTML') + ' metric name') });
+        });
+
+        expect(await page.screenshot({ fullPage: true })).to.matchImage('visits_overview_widget_sv');
+    });
 });