[core] refactor: replace XMLHttpRequest with fetch and migrate e2e tests to Playwright (#3950)

### 1. Replace `XMLHttpRequest` with the modern `fetch` API for loading
translation files

#### Changes
- **translator.js**: Use `fetch` with `async/await` instead of XHR
callbacks
- **loader.js**: Align URL handling and add error handling (follow-up to
fetch migration)
- **Tests**: Update infrastructure for `fetch` compatibility

#### Benefits
- Modern standard API
- Cleaner, more readable code
- Better error handling and fallback mechanisms

### 2. Migrate e2e tests to Playwright

This wasn't originally planned for this PR, but is related. While
investigating suspicious log entries which surfaced after the fetch
migration I kept running into JSDOM’s limitations. That pushed me to
migrate the E2E suite to Playwright instead.

#### Changes
- switch e2e harness to Playwright (`tests/e2e/helpers/global-setup.js`)
- rewrite specs to use Playwright locators + shared `expectTextContent`
- install Chromium via `npx playwright install --with-deps` in CI

#### Benefits
- much closer to real browser behaviour
- and no more fighting JSDOM’s quirks

tests/e2e/modules/weather_forecast_spec.js

@@ -1,7 +1,10 @@
+const { expect } = require("playwright/test");
 const helpers = require("../helpers/global-setup");
 const weatherFunc = require("../helpers/weather-functions");
 
 describe("Weather module: Weather Forecast", () => {
+	let page;
+
 	afterAll(async () => {
 		await weatherFunc.stopApplication();
 	});
@@ -9,43 +12,46 @@ describe("Weather module: Weather Forecast", () => {
 	describe("Default configuration", () => {
 		beforeAll(async () => {
 			await weatherFunc.startApplication("tests/configs/modules/weather/forecastweather_default.js", {});
+			page = helpers.getPage();
 		});
 
 		const days = ["Today", "Tomorrow", "Sun", "Mon", "Tue"];
 		for (const [index, day] of days.entries()) {
 			it(`should render day ${day}`, async () => {
-				await expect(weatherFunc.getText(`.weather table.small tr:nth-child(${index + 1}) td:nth-child(1)`, day)).resolves.toBe(true);
+				const dayCell = page.locator(`.weather table.small tr:nth-child(${index + 1}) td:nth-child(1)`);
+				await expect(dayCell).toHaveText(day);
 			});
 		}
 
 		const icons = ["day-cloudy", "rain", "day-sunny", "day-sunny", "day-sunny"];
 		for (const [index, icon] of icons.entries()) {
 			it(`should render icon ${icon}`, async () => {
-				const elem = await helpers.waitForElement(`.weather table.small tr:nth-child(${index + 1}) td:nth-child(2) span.wi-${icon}`);
-				expect(elem).not.toBeNull();
+				const iconElement = page.locator(`.weather table.small tr:nth-child(${index + 1}) td:nth-child(2) span.wi-${icon}`);
+				await expect(iconElement).toBeVisible();
 			});
 		}
 
 		const maxTemps = ["24.4°", "21.0°", "22.9°", "23.4°", "20.6°"];
 		for (const [index, temp] of maxTemps.entries()) {
 			it(`should render max temperature ${temp}`, async () => {
-				await expect(weatherFunc.getText(`.weather table.small tr:nth-child(${index + 1}) td:nth-child(3)`, temp)).resolves.toBe(true);
+				const maxTempCell = page.locator(`.weather table.small tr:nth-child(${index + 1}) td:nth-child(3)`);
+				await expect(maxTempCell).toHaveText(temp);
 			});
 		}
 
 		const minTemps = ["15.3°", "13.6°", "13.8°", "13.9°", "10.9°"];
 		for (const [index, temp] of minTemps.entries()) {
 			it(`should render min temperature ${temp}`, async () => {
-				await expect(weatherFunc.getText(`.weather table.small tr:nth-child(${index + 1}) td:nth-child(4)`, temp)).resolves.toBe(true);
+				const minTempCell = page.locator(`.weather table.small tr:nth-child(${index + 1}) td:nth-child(4)`);
+				await expect(minTempCell).toHaveText(temp);
 			});
 		}
 
 		const opacities = [1, 1, 0.8, 0.5333333333333333, 0.2666666666666667];
 		for (const [index, opacity] of opacities.entries()) {
 			it(`should render fading of rows with opacity=${opacity}`, async () => {
-				const elem = await helpers.waitForElement(`.weather table.small tr:nth-child(${index + 1})`);
-				expect(elem).not.toBeNull();
-				expect(elem.outerHTML).toContain(`<tr style="opacity: ${opacity};">`);
+				const row = page.locator(`.weather table.small tr:nth-child(${index + 1})`);
+				await expect(row).toHaveAttribute("style", `opacity: ${opacity};`);
 			});
 		}
 	});
@@ -53,12 +59,14 @@ describe("Weather module: Weather Forecast", () => {
 	describe("Absolute configuration", () => {
 		beforeAll(async () => {
 			await weatherFunc.startApplication("tests/configs/modules/weather/forecastweather_absolute.js", {});
+			page = helpers.getPage();
 		});
 
 		const days = ["Fri", "Sat", "Sun", "Mon", "Tue"];
 		for (const [index, day] of days.entries()) {
 			it(`should render day ${day}`, async () => {
-				await expect(weatherFunc.getText(`.weather table.small tr:nth-child(${index + 1}) td:nth-child(1)`, day)).resolves.toBe(true);
+				const dayCell = page.locator(`.weather table.small tr:nth-child(${index + 1}) td:nth-child(1)`);
+				await expect(dayCell).toHaveText(day);
 			});
 		}
 	});
@@ -66,25 +74,24 @@ describe("Weather module: Weather Forecast", () => {
 	describe("Configuration Options", () => {
 		beforeAll(async () => {
 			await weatherFunc.startApplication("tests/configs/modules/weather/forecastweather_options.js", {});
+			page = helpers.getPage();
 		});
 
 		it("should render custom table class", async () => {
-			const elem = await helpers.waitForElement(".weather table.myTableClass");
-			expect(elem).not.toBeNull();
+			await expect(page.locator(".weather table.myTableClass")).toBeVisible();
 		});
 
 		it("should render colored rows", async () => {
-			const table = await helpers.waitForElement(".weather table.myTableClass");
-			expect(table).not.toBeNull();
-			expect(table.rows).not.toBeNull();
-			expect(table.rows).toHaveLength(5);
+			const rows = page.locator(".weather table.myTableClass tr");
+			await expect(rows).toHaveCount(5);
 		});
 
 		const precipitations = [undefined, "2.51 mm"];
 		for (const [index, precipitation] of precipitations.entries()) {
 			if (precipitation) {
 				it(`should render precipitation amount ${precipitation}`, async () => {
-					await expect(weatherFunc.getText(`.weather table tr:nth-child(${index + 1}) td.precipitation-amount`, precipitation)).resolves.toBe(true);
+					const precipCell = page.locator(`.weather table tr:nth-child(${index + 1}) td.precipitation-amount`);
+					await expect(precipCell).toHaveText(precipitation);
 				});
 			}
 		}
@@ -93,13 +100,15 @@ describe("Weather module: Weather Forecast", () => {
 	describe("Forecast weather with imperial units", () => {
 		beforeAll(async () => {
 			await weatherFunc.startApplication("tests/configs/modules/weather/forecastweather_units.js", {});
+			page = helpers.getPage();
 		});
 
 		describe("Temperature units", () => {
 			const temperatures = ["75_9°", "69_8°", "73_2°", "74_1°", "69_1°"];
 			for (const [index, temp] of temperatures.entries()) {
 				it(`should render custom decimalSymbol = '_' for temp ${temp}`, async () => {
-					await expect(weatherFunc.getText(`.weather table.small tr:nth-child(${index + 1}) td:nth-child(3)`, temp)).resolves.toBe(true);
+					const tempCell = page.locator(`.weather table.small tr:nth-child(${index + 1}) td:nth-child(3)`);
+					await expect(tempCell).toHaveText(temp);
 				});
 			}
 		});
@@ -109,7 +118,8 @@ describe("Weather module: Weather Forecast", () => {
 			for (const [index, precipitation] of precipitations.entries()) {
 				if (precipitation) {
 					it(`should render precipitation amount ${precipitation}`, async () => {
-						await expect(weatherFunc.getText(`.weather table.small tr:nth-child(${index + 1}) td.precipitation-amount`, precipitation)).resolves.toBe(true);
+						const precipCell = page.locator(`.weather table.small tr:nth-child(${index + 1}) td.precipitation-amount`);
+						await expect(precipCell).toHaveText(precipitation);
 					});
 				}
 			}