appsmithorg/appsmith · error · Error
onThemeChange expects a function as parameter
Error message
onThemeChange expects a function as parameter
What it means
Plain Error thrown by the custom-widget runtime's appsmith.onThemeChange(fn) when the argument is not a function. The custom widget exposes a small appsmith global; onThemeChange registers a subscriber that is invoked immediately with the current theme and on every subsequent theme change. A non-function argument cannot be invoked, so registration is rejected before the subscriber is pushed.
Source
Thrown at app/client/src/widgets/CustomWidget/component/customWidgetscript.js:208
window.appsmith.theme = event.theme;
// Notify theme subscribers
themeSubscribers.forEach((fn) => {
fn(event.theme, prevTheme);
});
}
});
if (!window.appsmith) {
// Define appsmith global object
Object.defineProperty(window, "appsmith", {
configurable: false,
writable: false,
value: {
mode: "",
theme: {},
onThemeChange: (fn) => {
if (typeof fn !== "function") {
throw new Error("onThemeChange expects a function as parameter");
}
themeSubscribers.push(fn);
fn(window.appsmith.theme);
return () => {
// Unsubscribe from theme changes
const index = themeSubscribers.indexOf(fn);
if (index > -1) {
themeSubscribers.splice(index, 1);
}
};
},
onUiChange: (fn) => {
if (typeof fn !== "function") {
throw new Error("onUiChange expects a function as parameter");
}View on GitHub (pinned to 8cd9021c24)
Solutions
- Pass a function reference: appsmith.onThemeChange((theme) => { ... }).
- Capture the returned unsubscribe function and call it on cleanup to avoid leaks.
- If invoking conditionally, guard with typeof fn === 'function' before registering.
Example fix
// before
appsmith.onThemeChange('dark');
// after
appsmith.onThemeChange((theme) => console.log(theme)); Defensive patterns
Strategy: type-guard
Validate before calling
if (typeof handler !== 'function') {
console.warn('onThemeChange: expected a function');
return;
}
const unsubscribe = appsmith.onThemeChange(handler); Type guard
function isListener(v: unknown): v is Function {
return typeof v === 'function';
} Prevention
- Always pass a function reference; never the result of calling it.
- Capture the unsubscribe return value and call it on widget teardown.
- Keep custom-widget boilerplate copy-paste consistent.
When it happens
Trigger: Calling appsmith.onThemeChange() with no argument, a string, an object, or undefined; destructuring the API incorrectly and passing the wrong value.
Common situations: Copying example code that omits the callback; passing an arrow stored in a serialised config; refactoring that renames the handler out of scope.
Related errors
- onUiChange expects a function as parameter
- The ${path} path must start with 'https://'.
- error
- Please enter a target origin URL.
- resetWidget expected STRING for 'widgetName' argument but re
AI-assisted analysis of appsmithorg/appsmith@8cd9021c24 (2026-08-12).
Data as JSON: /api/errors/b2a9e732e56086aa.
Report an issue: GitHub.