如何使用 Pupeetersharp 从元素中获取计算的样式属性

Question

我正在尝试使用 PuppeteerSharp 来获取元素的计算颜色属性。 我已经看到使用 Puppeteer（不是 Sharp）的几个答案表明 window.getComputedStyle() 可能是解决方案，但我无法使用 PuppeteerSharp 使其工作。

看 ：

• https://browse.io/blog/puppeteer-how-to-check-visibility-of-an-element/
• 使用 Puppeteer 将鼠标悬停在 Node.js 中的元素和 getComputedStyle 上？

到目前为止，我的代码如下所示：

await new BrowserFetcher().DownloadAsync(BrowserFetcher.DefaultRevision);
using (browser = await Puppeteer.LaunchAsync(new LaunchOptions { Headless = IsHeadless }))
{
    using (var page = await Program.browser.NewPageAsync())
    {
        var jsCode = @"async() => {
        const element = document.querySelector('.productDetail svg[viewbox=""0 0 16 16""]');
        return window.getComputedStyle(element).getPropertyValue('color')};
        ;}";

        await page.GoToAsync("https://www.galaxus.ch/fr/s3/product/horizon-fitness-syros-e-velos-elliptiques-13874309");
        var results = await page.EvaluateFunctionAsync<string>(jsCode);
     }
}

任何帮助，将不胜感激 ！

Answer 1

我在您的代码中发现了一些问题。 首先是您的 javascript 代码中的一些小错误：您不需要异步和额外的括号。

var jsCode = @"() => {
  const element = document.querySelector('.productDetail svg[viewbox=""0 0 16 16""]');
  return window.getComputedStyle(element).getPropertyValue('color');
}";