Welcome Guest Search | Active Topics | Sign In | Register

How to debug C# Website Html. Options
PAul Hughes
Posted: Friday, August 6, 2021 4:58:14 AM
Rank: Newbie
Groups: Member

Joined: 10/9/2012
Posts: 6
I'm having issues (using the latest version as of 06/08/2021) with HtmlToPdf.ConvertUrl.
The PDFer is chopping off the bottom of my report and I'm trying to debug why, it's fine when I browse to the URL myself and is perfectly formatted for print in chrome and edge.
I've been looking at your debug tools but I can't find much documentation on how to use them.

I've read this page;
https://www.essentialobjects.com/doc/webbrowser/advanced/debug.aspx#debug_ui
But this seems presume you already know how to use the debug program.

How do I link the debug program to my local website running on IIS?

Forgive my if I'm missing something obvious, but how do I run my application using EO.PDF?
We usually use Chrome / IIS hosted MVC site for debugging but these docs speak of Chromium but with no mention of how to start the process.

It just says "Load the page you wish to debug with EO.WebBrowser.WebView."
How?
I've downloaded and installed Eo.Total 2021 and can see the exe debug programs and EO.PDF dll's but no chromium launch exe?

Thanks in advance and apologies if I'm missing something obvious here.
eo_support
Posted: Friday, August 6, 2021 1:42:43 PM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,071
Hi,

Chopping off is usually caused by the fact that your page was designed for a fixed output page size/margin and this size does not match the size used by the HTML to PDF converter. In that case you can easily avoid such issues avoided by adjusting HtmlToPdf.Options.PageSize and OutputArea property. See here for more details:

https://www.essentialobjects.com/doc/pdf/htmltopdf/page_size.aspx

As to debugging the web page, you will need to start from this topic:

https://www.essentialobjects.com/doc/pdf/htmltopdf/debug.aspx

Once the code in the above page runs, the web page has already been loaded into the HTML to PDF converter but it will not start conversion at that point because the code set the conversion trigger to manual. So now you can examine the page inside the HTML to PDF converter by following the steps outlined in the link you posted.

Step 5 is your main debug UI. Our documentation does not cover details about how to use this UI because this is part of Chromium and if you search Chrome Debug Tools online, you will be able to find plenty of information about how to use it.

Step 6 is when you are ready to trigger the conversion. Once you trigger the conversion, the conversion starts and then ConvertUrl/ConvertHtml call returns.

Hope this helps. Please feel free to let us know if you still have any questions.

Thanks!

PAul Hughes
Posted: Saturday, August 7, 2021 5:48:08 AM
Rank: Newbie
Groups: Member

Joined: 10/9/2012
Posts: 6
Support, thanks for the response.

To provide some further context, we have recently implemented a CSS grid system for our dashboard software which required us to upgrade EO.PDF to the latest version (everything worked fine before this upgrade).
This fixed some layout issues but it turns out it has caused more.

The dashboard system has several tabs, in PDF mode each tab is set to an A4 page height.

We have been using the same page layout and manual trigger as the old version which worked fine, none of this code was changed, just the css to format the dashboard and EO.pdf dlls to support css grid.
We have a special print mode which removes irrelevant UI to format for print, which renders perfectly in chrome as expected, but when PDF'ed is chopped off at the bottom.

The code we have for rendering the page (which worked before our UI and EO PDF dll upgrades) is as follows (mildly edited for brevity / relevance);

Code: C#
private void On_AfterRenderPage(object sender, EO.Pdf.PdfPageEventArgs e)
        {
            EO.Pdf.HtmlToPdf.Options.TriggerMode = HtmlToPdfTriggerMode.Auto;

            EO.Pdf.HtmlToPdf.Options.OutputArea = new RectangleF(0, 0, HtmlToPdf.Options.PageSize.Width, 1f);

            EO.Pdf.HtmlToPdf.ConvertHtml(strLicenceWarning, e.Page);
        }

        public void setPDFDefaultSettings(Enums.Orientation PDFOrientation = Enums.Orientation.Landscape)
        {
            //Append Header
            EO.Pdf.HtmlToPdf.Options.AfterRenderPage = On_AfterRenderPage;

            //2021 Licence
            EO.Pdf.Runtime.AddLicense("HIDDEN");

            //Set PDF Dimensions
            if (PDFOrientation == Enums.Orientation.Portrait)
            {
                HtmlToPdf.Options.PageSize = new SizeF(PdfPageSizes.A4.Width, PdfPageSizes.A4.Height);
                HtmlToPdf.Options.OutputArea = new RectangleF(0.25f, 0.5f, HtmlToPdf.Options.PageSize.Width - 0.5f, HtmlToPdf.Options.PageSize.Height - 0.55f);
            }
            else
            {
                HtmlToPdf.Options.PageSize = new SizeF(PdfPageSizes.A4.Height, PdfPageSizes.A4.Width);
                HtmlToPdf.Options.OutputArea = new RectangleF(0.25f, 0.5f, HtmlToPdf.Options.PageSize.Width - 0.5f, HtmlToPdf.Options.PageSize.Height - 0.55f);
            }

            EO.Pdf.HtmlToPdf.Options.ZoomLevel = 1;
            EO.Pdf.HtmlToPdf.Options.JpegQualityLevel = 100;
            EO.Pdf.HtmlToPdf.Options.TriggerMode = HtmlToPdfTriggerMode.Manual;
        }

        public string GeneratePDFFile(string SaveFileName, string URLToPDF, Enums.Orientation PDFOrientation = Enums.Orientation.Landscape)
        {
            setPDFDefaultSettings(PDFOrientation);

            //Create the PDF & Save to server
            HtmlToPdf.ConvertUrl(URLToPDF, SaveFileName);

            //Return URL of new PDF
            return SaveFileName;
        }


I don't believe this issue is with the manual trigger, but here it is;
Code: JavaScript
if (typeof (eopdf) == "object") {
                    eopdf.convert();
                }
eo_support
Posted: Saturday, August 7, 2021 8:36:27 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,071
Hi,

We are not in a position to review your code --- you will have to debug it yourself. However if you have special CSS rules specifically design for print media, then you may want to set HtmlToPdf.Options.UsePrintMedia to true. By default the HTML to PDF converter uses screen media, not print media.

Thanks!
PAul Hughes
Posted: Monday, August 9, 2021 4:07:54 AM
Rank: Newbie
Groups: Member

Joined: 10/9/2012
Posts: 6
Hi, the media query is not the issue as we've formatted the page without the use of print media, but thanks for the info, I did wonder about whether that could be involved.

I provided the code as you mentioned the print area, I thought you could maybe confirm that at least this part of the application looks fine?

Regarding debugging with Chrome, I'm very familiar with debugging in chrome using debug tools.
It's how I see what the PDF version of chromium sees before it generates the PDF that I'm unclear on.
I can obviously browse to the URL using Chrome, but how do I see what the PDF sees using chromium as the PDF rendered has issues that I dont see in Chrome?

Thanks in advance.
eo_support
Posted: Monday, August 9, 2021 9:21:49 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,071
PAul Hughes wrote:
It's how I see what the PDF version of chromium sees before it generates the PDF that I'm unclear on.


This is exactly what our first reply is trying to tell you. Follow those steps and you will see what the HTML to PDF converter sees in the debug UI.
PAul Hughes
Posted: Thursday, August 12, 2021 5:11:40 AM
Rank: Newbie
Groups: Member

Joined: 10/9/2012
Posts: 6
Hi, I have followed the steps outlined in Step 1 but I do not get a debug UI.
I'm using an MVC application to run a website, I browse to a URL that triggers the PDF generation.
Where is the debug UI supposed to show?
I don't get anything, do I need to run it in a certain way through visual studio or something else?
Thanks
eo_support
Posted: Thursday, August 12, 2021 10:42:20 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,071
Hi,

You will want to debug the whole thing in an interactive application (for example, a windows console application) through a debugger (such as Visual Studio) first. MVC Web application can't show you any interactive UI.

Thanks!
PAul Hughes
Posted: Thursday, August 12, 2021 10:55:30 AM
Rank: Newbie
Groups: Member

Joined: 10/9/2012
Posts: 6
The whole application is a website wrapped in security, is there no way to debug EO.PDF without creating a custom app to do so?
Or is there a sample project I can take a look at?
Thanks
eo_support
Posted: Thursday, August 12, 2021 11:04:52 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,071
PAul Hughes wrote:
The whole application is a website wrapped in security, is there no way to debug EO.PDF without creating a custom app to do so?
Or is there a sample project I can take a look at?
Thanks


Exactly how to debug your application is something you need to figure out yourself. You want to see what's going on inside the converter. So we provide you the UI for you to see that. The next step is to make sure that either your real application, or your test application CAN display that UI. That is up to how your application is setup and it is not up to us. This is something you have to solve yourself.

An alternative way to debug such issues is not to use our debug UI, but to manually modify your input HTML and see what result you get. Try that over and over again until you get the right result. These are just all different kind of debug techniques that you can decide which one works best for you. There is no right or wrong way here. You use whatever works for you.


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.