Forum Discussion

keerthanabasa's avatar
keerthanabasa
Regular Visitor
7 months ago
Solved

Render React Component inside Power BI visual

We are trying the bundling approach.


Here is how we are rendering the component(index.tsx):

import * as React from "react";
import { createRoot, Root } from "react-dom/client";
import Component1 from "./Component1";
let root: Root | null = null;
export function render(container: HTMLElement) {
    if (!root) {
        root = createRoot(container);
    }
    root.render(<Component1 />);
}

Our React component depends on WASM files. We are able to load these WASM files by whitelisting the corresponding lib.js file, which is loaded as part of the Power BI custom visual.

 

However, we are explicitly passing an additional worker.js file to our React component which is rendered inside Component1. Power BI is blocking this worker script, resulting in the following error:SecurityError: Failed to construct 'Worker': Script at 'https://app.powerbi.com/****/*/worker.js' cannot be accessed from origin 'null'.


In this context, will Power BI allow loading a worker.js file specific to the React component, or is this scenario fundamentally restricted by Power BI’s sandboxing model?

General Comment
Interesting Links
Need Help
Show and Tell
Tips and Tricks
Tutorial Requests
  • rohit1991's avatar
    rohit1991
    7 months ago

    Hii keerthanabasa 

     

    Power BI custom visuals run inside a strict sandboxed iframe, which blocks loading external or dynamically created Web Workers (including worker.js) due to origin and CSP restrictions (origin 'null'). Even if the worker file is bundled or hosted under app.powerbi.com, Power BI does not allow custom visuals to spawn separate worker scripts. Only inline JS and bundled assets executed on the main thread are supported. This limitation is by design, so using Web Workers in this way is fundamentally not supported in Power BI custom visuals.

3 Replies

  • rohit1991's avatar
    rohit1991
    Super User
    7 months ago

    Hii keerthanabasa 

     

    Power BI custom visuals run inside a strict sandboxed iframe, which blocks loading external or dynamically created Web Workers (including worker.js) due to origin and CSP restrictions (origin 'null'). Even if the worker file is bundled or hosted under app.powerbi.com, Power BI does not allow custom visuals to spawn separate worker scripts. Only inline JS and bundled assets executed on the main thread are supported. This limitation is by design, so using Web Workers in this way is fundamentally not supported in Power BI custom visuals.

  • v-hashadapu's avatar
    v-hashadapu
    Community Support
    7 months ago

    Hi keerthanabasa , Thank you for reaching out to the Microsoft Community Forum.

     

    We find the answer shared by rohit1991  is appropriate. Can you please confirm if the solution worked for you. It will help others with similar issues find the answer easily.

     

    Thank you rohit1991  for your valuable response.

  • v-hashadapu's avatar
    v-hashadapu
    Community Support
    7 months ago

    Hi keerthanabasa , Hope you are doing well. Kindly let us know if the issue has been resolved or if further assistance is needed. Your input could be helpful to others in the community.