mirror of
https://github.com/MichMich/MagicMirror.git
synced 2026-04-26 15:52:23 +00:00
This migrates the Weather module from client-side fetching to use the server-side centralized HTTPFetcher (introduced in #4016), following the same pattern as the Calendar and Newsfeed modules. ## Motivation This brings consistent error handling and better maintainability and completes the refactoring effort to centralize HTTP error handling across all default modules. Migrating to server-side providers with HTTPFetcher brings: - **Centralized error handling**: Inherits smart retry strategies (401/403, 429, 5xx backoff) and timeout handling (30s) - **Consistency**: Same architecture as Calendar and Newsfeed modules - **Security**: Possibility to hide API keys/secrets from client-side - **Performance**: Reduced API calls in multi-client setups - one server fetch instead of one per client - **Enabling possible future features**: e.g. server-side caching, rate limit monitoring, and data sharing with third-party modules ## Changes - All 10 weather providers now use HTTPFetcher for server-side fetching - Consistent error handling like Calendar and Newsfeed modules ## Breaking Changes None. Existing configurations continue to work. ## Testing To ensure proper functionality, I obtained API keys and credentials for all providers that require them. I configured all 10 providers in a carousel setup and tested each one individually. Screenshots for each provider are attached below demonstrating their working state. I even requested developer access from the Tempest/WeatherFlow team to properly test this provider. **Comprehensive test coverage**: A major advantage of the server-side architecture is the ability to thoroughly test providers with unit tests using real API response snapshots. Don't be alarmed by the many lines added in this PR - they are primarily test files and real-data mocks that ensure provider reliability. ## Review Notes I know this is an enormous change - I've been working on this for quite some time. Unfortunately, breaking it into smaller incremental PRs wasn't feasible due to the interdependencies between providers and the shared architecture. Given the scope, it's nearly impossible to manually review every change. To ensure quality, I've used both CodeRabbit and GitHub Copilot to review the code multiple times in my fork, and both provided extensive and valuable feedback. Most importantly, my test setup with all 10 providers working successfully is very encouraging. ## Related Part of the HTTPFetcher migration #4016. ## Screenshots <img width="1920" height="1080" alt="Ekrankopio de 2026-02-08 13-06-54" src="https://github.com/user-attachments/assets/2139f4d2-2a9b-4e49-8d0a-e4436983ed6e" /> <img width="1920" height="1080" alt="Ekrankopio de 2026-02-08 13-07-02" src="https://github.com/user-attachments/assets/880f7ce2-4e44-42d5-bfe4-5ce475cca7c2" /> <img width="1920" height="1080" alt="Ekrankopio de 2026-02-08 13-07-07" src="https://github.com/user-attachments/assets/abd89933-fe03-40ab-8a7c-41ae1ff99255" /> <img width="1920" height="1080" alt="Ekrankopio de 2026-02-08 13-07-12" src="https://github.com/user-attachments/assets/22225852-f0a9-4d33-87ab-0733ba30fad3" /> <img width="1920" height="1080" alt="Ekrankopio de 2026-02-08 13-07-17" src="https://github.com/user-attachments/assets/7a7192a5-f237-4060-85d7-6f50b9bef5af" /> <img width="1920" height="1080" alt="Ekrankopio de 2026-02-08 13-07-22" src="https://github.com/user-attachments/assets/df84d9f1-e531-4995-8da8-d6f2601b6a08" /> <img width="1920" height="1080" alt="Ekrankopio de 2026-02-08 13-07-27" src="https://github.com/user-attachments/assets/4cf391ac-db43-4b52-95f4-f5eadc5ea34d" /> <img width="1920" height="1080" alt="Ekrankopio de 2026-02-08 13-07-32" src="https://github.com/user-attachments/assets/8dd8e688-d47f-4815-87f6-7f2630f15d58" /> <img width="1920" height="1080" alt="Ekrankopio de 2026-02-08 13-07-37" src="https://github.com/user-attachments/assets/ee84a8bc-6b35-405a-b311-88658d9268dd" /> <img width="1920" height="1080" alt="Ekrankopio de 2026-02-08 13-07-42" src="https://github.com/user-attachments/assets/f941f341-453f-4d4d-a8d9-6b9158eb2681" /> Provider "Weather API" added later: <img width="1910" height="1080" alt="Ekrankopio de 2026-02-15 19-39-06" src="https://github.com/user-attachments/assets/3f0c8ba3-105c-4f90-8b2e-3a1be543d3d2" />
109 lines
4.0 KiB
JavaScript
109 lines
4.0 KiB
JavaScript
const fs = require("node:fs");
|
|
const path = require("node:path");
|
|
const weatherUtils = require("../../../defaultmodules/weather/provider-utils");
|
|
const helpers = require("./global-setup");
|
|
|
|
/**
|
|
* Inject mock weather data directly via socket communication
|
|
* This bypasses the weather provider and tests only client-side rendering
|
|
* @param {object} page - Playwright page
|
|
* @param {string} mockDataFile - Filename of mock data
|
|
*/
|
|
async function injectMockWeatherData (page, mockDataFile) {
|
|
const rawData = JSON.parse(fs.readFileSync(path.resolve(__dirname, "../../mocks", mockDataFile)).toString());
|
|
|
|
// Validate that the fixture has at least one expected weather data type
|
|
if (!rawData.current && !rawData.daily && !rawData.hourly) {
|
|
throw new Error(
|
|
"Invalid weather fixture: missing current, daily, and hourly data. "
|
|
+ `Available keys: ${Object.keys(rawData).join(", ")}`
|
|
);
|
|
}
|
|
|
|
// Determine weather type from the mock data structure
|
|
let type = "current";
|
|
let data = null;
|
|
|
|
const timezoneOffset = rawData.timezone_offset ? rawData.timezone_offset / 60 : 0;
|
|
|
|
if (rawData.current) {
|
|
type = "current";
|
|
// Mock what the provider would send for current weather
|
|
data = {
|
|
date: weatherUtils.applyTimezoneOffset(new Date(rawData.current.dt * 1000), timezoneOffset),
|
|
windSpeed: rawData.current.wind_speed,
|
|
windFromDirection: rawData.current.wind_deg,
|
|
sunrise: weatherUtils.applyTimezoneOffset(new Date(rawData.current.sunrise * 1000), timezoneOffset),
|
|
sunset: weatherUtils.applyTimezoneOffset(new Date(rawData.current.sunset * 1000), timezoneOffset),
|
|
temperature: rawData.current.temp,
|
|
weatherType: weatherUtils.convertWeatherType(rawData.current.weather[0].icon),
|
|
humidity: rawData.current.humidity,
|
|
feelsLikeTemp: rawData.current.feels_like
|
|
};
|
|
} else if (rawData.daily) {
|
|
type = "forecast";
|
|
data = rawData.daily.map((day) => ({
|
|
date: weatherUtils.applyTimezoneOffset(new Date(day.dt * 1000), timezoneOffset),
|
|
minTemperature: day.temp.min,
|
|
maxTemperature: day.temp.max,
|
|
weatherType: weatherUtils.convertWeatherType(day.weather[0].icon),
|
|
rain: day.rain || 0,
|
|
snow: day.snow || 0,
|
|
precipitationAmount: (day.rain || 0) + (day.snow || 0)
|
|
}));
|
|
} else if (rawData.hourly) {
|
|
type = "hourly";
|
|
data = rawData.hourly.map((hour) => ({
|
|
date: weatherUtils.applyTimezoneOffset(new Date(hour.dt * 1000), timezoneOffset),
|
|
temperature: hour.temp,
|
|
feelsLikeTemp: hour.feels_like,
|
|
humidity: hour.humidity,
|
|
windSpeed: hour.wind_speed,
|
|
windFromDirection: hour.wind_deg,
|
|
weatherType: weatherUtils.convertWeatherType(hour.weather[0].icon),
|
|
precipitationProbability: hour.pop != null ? hour.pop * 100 : undefined,
|
|
precipitationAmount: (hour.rain?.["1h"] || 0) + (hour.snow?.["1h"] || 0)
|
|
}));
|
|
}
|
|
|
|
// Inject weather data by evaluating code in the browser context
|
|
await page.evaluate(({ type, data }) => {
|
|
// Find the weather module instance
|
|
const weatherModule = MM.getModules().find((m) => m.name === "weather");
|
|
if (weatherModule) {
|
|
// Send INITIALIZED first
|
|
weatherModule.socketNotificationReceived("WEATHER_INITIALIZED", {
|
|
instanceId: weatherModule.instanceId,
|
|
locationName: "Munich"
|
|
});
|
|
// Then send the actual data
|
|
weatherModule.socketNotificationReceived("WEATHER_DATA", {
|
|
instanceId: weatherModule.instanceId,
|
|
type: type,
|
|
data: data
|
|
});
|
|
}
|
|
}, { type, data });
|
|
}
|
|
|
|
exports.startApplication = async (configFileName, mockDataFile) => {
|
|
await helpers.startApplication(configFileName);
|
|
await helpers.getDocument();
|
|
|
|
// If mock data file is provided, inject it
|
|
if (mockDataFile) {
|
|
const page = helpers.getPage();
|
|
// Wait for weather module to initialize
|
|
// eslint-disable-next-line playwright/no-wait-for-selector
|
|
await page.waitForSelector(".weather", { timeout: 5000 });
|
|
await injectMockWeatherData(page, mockDataFile);
|
|
// Wait for data to be rendered
|
|
// eslint-disable-next-line playwright/no-wait-for-selector
|
|
await page.waitForSelector(".weather .weathericon", { timeout: 2000 });
|
|
}
|
|
};
|
|
|
|
exports.stopApplication = async () => {
|
|
await helpers.stopApplication();
|
|
};
|