Getting null in theme

I am trying to implement theme change signal in my extension. But when I am accessing theme using themeManager I am getting null.
Below is the example of the code:


import {
  JupyterFrontEnd,
  JupyterFrontEndPlugin
} from '@jupyterlab/application';
import { IThemeManager } from '@jupyterlab/apputils';

/**
 * Initialization data for the myextension extension.
 */
const plugin: JupyterFrontEndPlugin<void> = {
  id: 'myextension:plugin',
  description: 'A JupyterLab extension.',
  autoStart: true,
  activate,
  requires: [IThemeManager],
};

export default plugin;

async function activate(
  app: JupyterFrontEnd,
  themeManager: IThemeManager | null,
)
{
  console.log('JupyterLab extension myextension is activated!101');
  if (themeManager) {
    console.log("Theme name: ", themeManager.theme);
  }
  
}

null is a perfectly valid value for themeManager.theme - it just indicates that a theme has not been set yet. You may want to try awaiting for the application shell to be ready, for example:

await app.restored;
console.log("Theme name: ", themeManager.theme);

or waiting for the themeChanged signal to fire:

themeManager.themeChanged.connect((manager, change) => {
  console.log('Theme name:', manager.theme, 'change:', change);
});
1 Like