How to Create an Image from HTML Content with Specific Height Using Puppeteer Sharp

Question

We are attempting to convert HTML to an image using Puppeteer Sharp. However, we are encountering issues with extra white space being generated. For instance, when converting only a single-page content wrapped in a

tag, the conversion results in additional empty space.

Here is the code snippet we're currently using:

var options = new LaunchOptions { Headless = true, UserDataDir = "D:\\New folder" };

Console.WriteLine("Downloading chromium");

using var browserFetcher = new BrowserFetcher();
await browserFetcher.DownloadAsync();

Console.WriteLine("Navigating to Google");
await using var browser = await Puppeteer.LaunchAsync(options);
await using var page = await browser.NewPageAsync();

// Uncomment the following line to navigate to a specific URL
// await page.GoToAsync("https://www.google.com");

await page.SetContentAsync("\"<p>Hello</p>\"");

Console.WriteLine("Generating Image");
await page.ScreenshotAsync("image.png");

Console.WriteLine("Export completed");

The goal is to capture only the text area as shown in the provided image: link. We appreciate any guidance on ensuring that the generated image contains only the text without unnecessary white space.