TypeError: activePage.createVisual is not a function (Power BI JavaScript API)

I'm trying to dynamically add a visual to an embedded Power BI report using the createVisual() method as documented here: Microsoft Docs: Create a visual in Power BI embedded

However, when I try to execute the following code:

try {
      const pages = await this.report.getPages();
      const activePage = pages.find(p  => p.isActive);
      if(!activePage)return;
      const visualLayout = {
        x: 0,
        y: 0,
        z: 0,
        width: 300,
        height: 300
      };
      const visualResponse = await activePage.createVisual('pieChart', visualLayout, false);
      const newVisual = visualResponse.visual;
      await newVisual.update({ title: "Count of RelatedParty by TaxJurisdiction" });

      console.log(" Visual created:", newVisual);

    } catch (error) {
      console.error(" Error creating visual:", error);
    }

I get this error:

TypeError: activePage.createVisual is not a function
at _PowerBiService.<anonymous> (power-bi-service.service.ts:151:47)
at Generator.next (<anonymous>)
at fulfilled (main.js:10:24)

What I’ve Checked So Far:

• white_heavy_check_mark: My Power BI JavaScript API version is up to date ( "powerbi-client": "^2.23.1")
• white_heavy_check_mark: The report is properly embedded and interactive
• white_heavy_check_mark: getPages() works fine, meaning activePage is a valid object

Any insights or solutions would be really helpful!

Thanks in advance!

createVisual is a Report authoring API which is not present in "powerbi-client" package. You need to install powerbi-report-authoring package to use that API.