[weather] better null value handling for weather type (#3892)

As mentioned
[here](https://github.com/MagicMirrorOrg/MagicMirror/pull/3878#issuecomment-3275344406)
our weather module needs a bit better handling for null values in the
type field.

This pr adds this and cleans up the layout a little.

CHANGELOG.md

@@ -47,6 +47,7 @@ Thanks to: @dathbe.
 - [calendar] Update defaultSymbol name and also the link to the icon search site (#3879)
 - [core] Update dependencies including electron to v38 as well as github actions (#3831, #3849, #3857, #3858, #3872, #3876, #3882, #3891)
 - [weather] Update feels_like temperature calculation formula (#3869)
+- [weather] Update null value handling for weather type (#3892)
 
 ### Fixed
 

modules/default/weather/current.njk

@@ -43,7 +43,7 @@
       {% endif %}
     </div>
   {% endif %}
-  <div class="large">
+  <div class="large type-temp">
     {% if config.showIndoorTemperature and indoor.temperature or config.showIndoorHumidity and indoor.humidity %}
       <span class="medium fas fa-home"></span>
       <span style="display: inline-block">
@@ -59,7 +59,9 @@
         {% endif %}
       </span>
     {% endif %}
-    <span class="light wi weathericon wi-{{ current.weatherType }}"></span>
+    {% if current.weatherType %}
+      <span class="light wi weathericon wi-{{ current.weatherType }}"></span>
+    {% endif %}
     <span class="light bright">{{ current.temperature | roundValue | unit("temperature") | decimalSymbol }}</span>
     {% if config.showHumidity === "temp" %}
       <span class="medium bright">{{ humidity() }}</span>

modules/default/weather/weather.css

@@ -1,9 +1,6 @@
 .weather .weathericon,
 .weather .fa-home {
   font-size: 75%;
-  line-height: 65px;
-  display: inline-block;
-  transform: translate(0, -3px);
 }
 
 .weather .humidity-icon {
@@ -37,10 +34,6 @@
   padding-right: 0;
 }
 
-.weather tr .weathericon {
-  line-height: 25px;
-}
-
 .weather tr.colored .min-temp {
   color: #bcddff;
 }
@@ -48,3 +41,9 @@
 .weather tr.colored .max-temp {
   color: #ff8e99;
 }
+
+.weather .type-temp {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+}

modules/default/weather/weather.js

@@ -168,7 +168,7 @@ Module.register("weather", {
 		this.scheduleUpdate();
 
 		if (this.weatherProvider.currentWeather()) {
-			this.sendNotification("CURRENTWEATHER_TYPE", { type: this.weatherProvider.currentWeather().weatherType.replace("-", "_") });
+			this.sendNotification("CURRENTWEATHER_TYPE", { type: this.weatherProvider.currentWeather().weatherType?.replace("-", "_") });
 		}
 
 		const notificationPayload = {

tests/e2e/modules/weather_current_spec.js

@@ -18,12 +18,16 @@ describe("Weather module", () => {
 
 			it("should render temperature with icon", async () => {
 				await expect(weatherFunc.getText(".weather .large span.light.bright", "1.5°")).resolves.toBe(true);
+
+				const elem = await helpers.waitForElement(".weather .large span.weathericon");
+				expect(elem).not.toBeNull();
 			});
 
 			it("should render feels like temperature", async () => {
 				// Template contains   which renders as \xa0
 				await expect(weatherFunc.getText(".weather .normal.medium.feelslike span.dimmed", "93.7\xa0 Feels like -5.6°")).resolves.toBe(true);
 			});
+
 			it("should render humidity next to feels-like", async () => {
 				await expect(weatherFunc.getText(".weather .normal.medium.feelslike span.dimmed .humidity", "93.7")).resolves.toBe(true);
 			});