Dark mode setting ignored when embedding BI dashboard inside Databricks App

[chie_789]

When using the '@databricks/aibi-client' library to embed a BI dashboard inside a databricks app, the " colorScheme: 'dark' " setting is ignored when the app's 'prefer-color-scheme' is 'light' by default.
As a result, I am unable to set my dashboards to dark mode when they are embedded inside a databricks app.

const dashboard = new DatabricksDashboard({
  instanceUrl: ...,
  workspaceId: ...,
  dashboardId: ...,
  token: ...,
  container: containerElement,
  colorScheme: 'dark'
}

Summary:

• Environment: Databricks Apps
• Library: @DataBricks/aibi-client
• Configuration: " colorScheme: 'dark' "
• Result: Dashboard object contains colorScheme='dark' but iframe root renders: ' :root { color-scheme: light; }'
• Local environment: dashboard correctly renders in dark mode when " colorScheme: 'dark' " is set
• Databricks app environment: dashboard always renders incorrectly in light mode

[DB-RKL]

Hey @chie_789 

Have you tried setting the colour scheme using javascript? we have an example in the AIBI client docs?
https://www.jsdelivr.com/package/npm/@databricks/aibi-client

[chie_789]

Hi @DB-RKL 

Yes I have followed the example in the AIBI client docs.
I have verified that the colour scheme will render in dark mode just fine when running my app (Nuxt.js framework) in a local server, but when running it inside a Databricks App server the colour scheme will not render in dark mode.