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

  1. Pass a function reference: appsmith.onThemeChange((theme) => { ... }).
  2. Capture the returned unsubscribe function and call it on cleanup to avoid leaks.
  3. 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

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


AI-assisted analysis of appsmithorg/appsmith@8cd9021c24 (2026-08-12). Data as JSON: /api/errors/b2a9e732e56086aa. Report an issue: GitHub.