如何使用 puppeteer 挂钩到 powerbi 报告加载事件答案

【问题标题】：How to use puppeteer to hook into powerbi report loaded event如何使用 puppeteer 挂钩到 powerbi 报告加载事件
【发布时间】：2019-03-06 13:18:47
【问题描述】：

我非常高兴地使用 pupeteer/chromium 嵌入了一个 power bi 报告，然后将其保存为屏幕截图/pdf。但是，一个迟到的要求要求我能够挂钩报表的加载事件。

我有以下代码 sn-p 这是我用来连接事件的模板；报告正在嵌入，但“report.on”事件没有触发，（实际上我正在尝试设置一些视觉效果和其他内容，而不仅仅是日志文本。）

       await page.evaluate((configdata) => {
             const models = window['powerbi-client'].models;
             const config = {
                         ...
             };

             const report = powerbi.embed(reportContainer, config)

             report.on('loaded', function () {
                 console.log('loaded report')
             });

       },
       configdata);

我查看了“exposeFunction()”，但无法将其与此事件（或其他事件）挂钩。

有人能告诉我我缺少什么吗？必须有办法做到这一点，但我错过了如何绑定报告对象（从 IFrame 中实例化，到使用 puppeteer 函数的事件。但是，JS/Node 不是我的主要学科，地狱它甚至不是我的第二个！

PS：我知道（并且已经开始工作）将过滤器传递给配置；但从美学的角度来看，这还不够好（屏幕上的视觉效果没有设置！）

任何帮助/指针 - 非常感谢

【问题讨论】：

你怎么知道它没有触发？您是否希望 console.log 在节点端工作？
嗨，我正在运行headless:false，显示浏览器。使用上面的 sn-p，我本来希望将 console.log 写入控制台（F12）；它不是。因此，我推断（可能是错误的）事件没有触发。
该功能被标记为“在 Firefox 中失败”github.com/GoogleChrome/puppeteer/blob/… 您需要等待该功能实现。

标签： powerbi puppeteer

【解决方案1】：

在嵌入报告时，我们一直将过滤器传递到配置中。简短而简单。

【讨论】：

【解决方案2】：

要回答这个问题，您可以使用 page.evaluate 并创建一个 Promise，该 Promise 将在触发嵌入加载事件时解决。然后你可以等待你的 loadEmbed 函数：

async function loadEmbed(page, config) {
return page.evaluate(async (config) => {
    await new Promise((resolve, reject) => {
        try {
            var embedContainer = $('#embedContainer')[0];

            var embed = powerbi.embed(embedContainer, config);

            embed.off("loaded");
            embed.on("loaded", function () {
                resolve(true);
            });
        } catch (err) {
            resolve(false);
        }
    });
}, config);

}

【讨论】：