[Bug] Update to v2.36, not recognizing function in config.js

[dathbe]

Environment

MagicMirror² version: 2.36.0
Node version: 24.14.1
npm version: 11.11.0
Platform: Raspbian

I updated to v2.36.0 this morning, and it broke one of my modules. Specifically, I have an MMM-CalendarExt2 module specified in my config.js, which calls a custom function within the config.js file to programatically set special icons for calendar entries. The module was working fine before the upgrade, but now it is reporting [ERROR] [MMM-LogExt] [ERROR] [:4:26] Uncaught ReferenceError: checkForCustomIcon is not defined (the function name is checkForCustomIcon; I have confirmed that the function exists and is named correctly. There are many other modules I use that also rely on functions inside the config.js file, and none of those seem to be affected. I don't know what's different about this.

Which start option are you using?

node --run start:wayland

Are you using PM2?

Yes

Module

None

Have you tried disabling other modules?

• Yes
• No

Have you searched if someone else has already reported the issue on the forum or in the issues?

• Yes

What did you do?

Configuration

Here is the relevant part of my module definition:

{
  module: 'MMM-CalendarExt2',
  config: {
  calendars : [
    {
    name: "Family Calendar",
    url: "https://calendar.google.com/calendar/ical/<redacted>",
    icon: "ion:calendar-outline",
    className: "calmain",
    },
    {
    name: "US Holidays",
    url: "https://calendar.google.com/calendar/ical/<redacted>",
    icon: "mingcute:firework-line",
    className: "calholiday",
    },
    
    {
    name: "Birthdays",
    url: "https://calendar.google.com/calendar/ical/<redacted>",
    icon: "wpf:birthday",  
    className: "calbirthdays",
    },
    {
    name: "Anniversaries",
    url: "https://calendar.google.com/calendar/ical/<redacted>",
    icon: "game-icons:diamond-ring",
    className: "calanniversaries",
    },
  ],
  views: [
  {
    name: "week",
    mode: "daily",
    position: "lower_third",
    slotCount: 7,
    filterPassedEvent: true,
    timeFormat:"h:mm A",
    hideOverflow: false,
    slotMaxHeight: "auto",
    transform: (event) => {
      const iconChoice = checkForCustomIcon (event)
      if (iconChoice !== '') {
        event.icon = iconChoice
      }
      if (event.title === "a") {
        event.className = "calholiday"
        event.icon = "mingcute:a"
      }
      return event;
    },
  },
  ],
  scenes: [
    {
    name: "DEFAULT",
    views: [],
    },
	],
  },
},

And at the bottom of the config.js file, I have this function defined:

function checkForCustomIcon (event) {
  if (event.title.search("a") > -1 || event.title.search("b") > -1 || event.title.search("c") > -1 || event.title.search("d") > -1 || event.title.search("e") > -1 || event.title.search("e") > -1) {
    return "icon-park-outline:a"
  }
  else if (event.title.search("f") > -1 || event.title.search("g") > -1) {
    return "game-icons:b"
  }
  else if (event.title.search("h") > -1 || event.title.search("i") > -1 || event.title.search("j") > -1) {
    return "hugeicons:c"
  }
  else if (event.title.search("k") > -1) {
    return "iconoir:d"
  }
  else if (event.title.search("l") > -1) {
    return "ri:e"
  }
  else if (event.title.search("m") > -1) {
    return "ph:f"
  }
  return ''
}

Did something change with how functions need to be formatted with the latest release?

Steps to reproduce the issue:
Include specific functions (no idea what the specific issue is) in your config.js
Upgrade to 2.36

What did you expect to happen?

MM picks up the function and properly parses the module definition.

What actually happened?

MM complains that the function is missing.

Additional comments

No response

Participation

• I am willing to submit a pull request for this change.

[dathbe]

Possibly the result of something here? #4106

[dathbe]

I think I might be on to something with #4106. I replaced all the " with '. That didn't entirely fix my problem (the CalendarExt2 module is still not displaying on my mirror), but it did get rid of the "is not defined" error.

[sdetweil]

I have a config that does something similar for HomeAssistantDisplay.
| mine doesn't have functions referenced from config... it creates variables used in config

Can you move your function to before
config =
And see if the results are different

[khassel]

Since v2.35.0 we use the /config endpoint to get the config.js content in the browser. #4106 was a fix in v2.36.0 because the functions were missing.

Problem: The /config endpoint contains only the content of the config object and your function definition is outside of this object.

I found this workaround (sorry for the bad formatting) which did not produce any errors in browser or backend, can you test this with real data?

let config = {
checkForCustomIcon: (event) => {
  if (event.title.search("a") > -1 || event.title.search("b") > -1 || event.title.search("c") > -1 || event.title.search("d") > -1 || event.title.search("e") > -1 || event.title.search("e") > -1) {
    return "icon-park-outline:a"
  }
  else if (event.title.search("f") > -1 || event.title.search("g") > -1) {
    return "game-icons:b"
  }
  else if (event.title.search("h") > -1 || event.title.search("i") > -1 || event.title.search("j") > -1) {
    return "hugeicons:c"
  }
  else if (event.title.search("k") > -1) {
    return "iconoir:d"
  }
  else if (event.title.search("l") > -1) {
    return "ri:e"
  }
  else if (event.title.search("m") > -1) {
    return "ph:f"
  }
  return ''
},
	address: "0.0.0.0",
							// - "localhost", "127.0.0.1", "::1" to listen on loopback interface
							// - another specific IPv4/6 to listen on a specific interface
							// - "0.0.0.0", "::" to listen on any interface
							// Default, when address config is left out or empty, is "localhost"
	port: 8080,
	basePath: "/",	// The URL path where MagicMirror² is hosted. If you are using a Reverse proxy
									// you must set the sub path here. basePath must end with a /
	ipWhitelist: ["127.0.0.1", "192.168.0.0/16", "172.0.0.0/8"],	// Set [] to allow all IP addresses
									// or add a specific IPv4 of 192.168.1.5 :
									// ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.1.5"],
									// or IPv4 range of 192.168.3.0 --> 192.168.3.15 use CIDR format :
									// ["127.0.0.1", "::ffff:127.0.0.1", "::1", "::ffff:192.168.3.0/28"],

	useHttps: false,			// Support HTTPS or not, default "false" will use HTTP
	httpsPrivateKey: "",	// HTTPS private key path, only require when useHttps is true
	httpsCertificate: "",	// HTTPS Certificate path, only require when useHttps is true

	language: "en",
	locale: "en-US",   // this variable is provided as a consistent location
			   // it is currently only used by 3rd party modules. no MagicMirror code uses this value
			   // as we have no usage, we  have no constraints on what this field holds
			   // see https://en.wikipedia.org/wiki/Locale_(computer_software) for the possibilities

	logLevel: ["INFO", "LOG", "WARN", "ERROR"], // Add "DEBUG" for even more logging
	timeFormat: 24,
	units: "metric",

	modules: [
{
  module: 'MMM-CalendarExt2',
  config: {
  calendars : [
    {
    name: "Family Calendar",
    url: "https://ics.calendarlabs.com/76/mm3137/US_Holidays.ics",
    icon: "ion:calendar-outline",
    className: "calmain",
    },
    {
    name: "US Holidays",
    url: "https://ics.calendarlabs.com/76/mm3137/US_Holidays.ics",
    icon: "mingcute:firework-line",
    className: "calholiday",
    },
    
    {
    name: "Birthdays",
    url: "https://ics.calendarlabs.com/76/mm3137/US_Holidays.ics",
    icon: "wpf:birthday",  
    className: "calbirthdays",
    },
    {
    name: "Anniversaries",
    url: "https://ics.calendarlabs.com/76/mm3137/US_Holidays.ics",
    icon: "game-icons:diamond-ring",
    className: "calanniversaries",
    },
  ],
  views: [
  {
    name: "week",
    mode: "daily",
    position: "lower_third",
    slotCount: 7,
    filterPassedEvent: true,
    timeFormat:"h:mm A",
    hideOverflow: false,
    slotMaxHeight: "auto",
    transform: (event) => {
      const iconChoice = config.checkForCustomIcon (event)
      if (iconChoice !== '') {
        event.icon = iconChoice
      }
      if (event.title === "a") {
        event.className = "calholiday"
        event.icon = "mingcute:a"
      }
      return event;
    },
  },
  ],
  scenes: [
    {
    name: "DEFAULT",
    views: [],
    },
	],
  },
},
		{
			module: "alert",
		},
		{
			module: "updatenotification",
			position: "top_bar"
		},
		{
			module: "clock",
			position: "top_left"
		},
		{
			module: "calendar",
			header: "US Holidays",
			position: "top_left",
			config: {
				calendars: [
					{
						fetchInterval: 7 * 24 * 60 * 60 * 1000,
						symbol: "calendar-check",
						url: "https://ics.calendarlabs.com/76/mm3137/US_Holidays.ics"
					}
				]
			}
		},
		{
			module: "compliments",
			position: "lower_third"
		},
		{
			module: "weather",
			position: "top_right",
			config: {
				weatherProvider: "openmeteo",
				type: "current",
				lat: 40.776676,
				lon: -73.971321
			}
		},
		{
			module: "weather",
			position: "top_right",
			header: "Weather Forecast",
			config: {
				weatherProvider: "openmeteo",
				type: "forecast",
				lat: 40.776676,
				lon: -73.971321
			}
		},
		{
			module: "newsfeed",
			position: "bottom_bar",
			config: {
				feeds: [
					{
						title: "New York Times",
						url: "https://rss.nytimes.com/services/xml/rss/nyt/HomePage.xml"
					}
				],
				showSourceTitle: true,
				showPublishDate: true,
				broadcastNewsFeeds: true,
				broadcastNewsUpdates: true
			}
		},
	]
};

/*************** DO NOT EDIT THE LINE BELOW ***************/
if (typeof module !== "undefined") { module.exports = config; }

[dathbe]

Thanks for the suggestions. I'll try when I have a moment. Any idea why this one (of about 5-7) function isn't working while the others are? Do I need to migrate the rest of my functions to the let config = format? And should we update the documentation to make this clear?

[khassel]

Any idea why this one (of about 5-7) function isn't working while the others are?

no, you did not provide the others so we can not test/debug

Do I need to migrate the rest of my functions to the let config = format?

I don't know, test it. You can take a look into the /config endpoint to see if/how they are displayed there

And should we update the documentation to make this clear?

I haven't found anything in the documentation regarding custom functions in config.js, though perhaps I simply overlooked it.

[sdetweil]

I haven't found anything in the documentation regarding custom functions in config.js, though perhaps I simply overlooked it.

I don't think we have that doc. its sort of 'accidental'/nodejs stuff that functions will exist in a js file that was loaded with require/import
and people have leveraged it

and I think we will HAVE to document it now that we pre-process ONLY the config part..