Implementing UserStyleSheetLocation in CefSharp

[Netizine]

Does anyone know how to inject custom css into a page before the page renders. I have tried achieving this using javascript but it doesn't remove the scroll bars.

If it isn't currently in the road-map, would anyone be interested in a Paypal donation to a Friday night out to try implement this. :-)

The CSS is as follows.
html, body, iframe {margin: 0 ;padding: 0;border: 0 ;overflow-y: auto;overflow-x: hidden;max-width: 320px;}::-webkit-scrollbar {width: 0;height: 0;}::-webkit-scrollbar-thumb {min-height: 0;min-width: 0;}

In Chromium and xilium it is set by implementing the UserStyleSheetLocation which is basically a style sheet added to every page before its rendered. Line 121 here https://searchcode.com/codesearch/view/66862333/

[amaitland]

Issue #315 may provide some additional information

[Netizine]

Unfortunately it doesn't help as the end solution seems to be they reverted to using javascript to inject it but injecting the CSS after the page loads will not change the scroll-bar with. Thanks for the link though.

[amaitland]

From what I can tell user_style_sheet_location was removed from Chromium.

More background here peters@c734580#commitcomment-7839142

[Netizine]

@amaitland Thanks. Any chance you know if chrome extension are supported in chromium?

[jornh]

They are not 😢

[Netizine]

Thanks @jornh

[amaitland]

When I do something basic like this the scrollbars are hidden.

private void OnFrameLoadStart(object sender, FrameLoadStartEventArgs e)
{
    Browser.ExecuteScriptAsync("var node = document.createElement('style'); node.innerHTML = 'html, body, iframe {overflow:hidden;}'; document.body.appendChild(node);");
}

Have to tried using the DevTools to debug the issue? I'd say with some tweaks you can get it working.

DevTools
https://github.com/cefsharp/CefSharp/blob/master/CefSharp/IWebBrowser.cs#L247

[amaitland]

As this isn't supported upstream I'm going to close this. Feel free to create another issue if required.

[evaldsurtans]

JS snippet to inject CSS Link hrefs

Maybe someone find it helpful

$('link[rel="stylesheet"]').each(function () {
   var href = $(this).attr('href');
    $.get( href, function( data ) {
        //console.log( "Data Loaded: " + data );
        var node = document.createElement('style');
        node.innerHTML = data;
        document.body.appendChild(node);
    });
});