headerHTML isn't working at all the way it is supposed to

[abhij89]

ideally, headerHTML function is supposed to accept some HTML with styling and render it at the top of the page..it is not doing anything like that at all. This is such a great library but the lack of this feature is ruining it. Ideally, it should do something like this:

Am I doing something wrong or this is really not working?

Browsershot::url(asset( 'storage/reports/' . $pdfHtmlName ))
->showBackground()
->showBrowserHeaderAndFooter()
->headerHtml($headerHTML)
->hideFooter()
->noSandbox()
->scale(0.9)
->emulateMedia("screen")
->margins(30,10,30,10)
->showBackground()
->addChromiumArguments([
     'font-render-hinting' => 'none',
])->waitUntilNetworkIdle()->ignoreHttpsErrors()
->format('letter')
->savePdf($pdf_file_url);

I already checked the other threads none of them actually provide any solutions or insights on why this isn't working?

[abhij89]

for anyone who is looking for this, this is how it's done:

<style>div.logo { content: url('{{$logo}}')</style><div style='width:50%;padding:20px 0 20px 40px;-webkit-print-color-adjust: exact;background:#FEDA14'><div style='height:30px;width:90px' class='logo'></div><div style='font-size:10px'>Name</div></div><div style='width:50%;-webkit-print-color-adjust: exact;background:#FEDA14;padding:20px 0 40px 40px;'><span style='font-size:10px;text-align:right;float:right;padding-right:40px;'>Some Text</span></div>

notice every attribute has value wrapped with single quotes. for images, you need to use CSS to put the image as content to the element. No space or new lines. And this will work. Had to go through the puppeteer's official documentation to figure this out.