[BUG]Can't change the background color of an iframe

[CpHeat]

Describe the bug:
Not sure if it is a bug but I understood we should be able to set styles for iframes and it works to some extent but I can't get the background-color to change to anything else than white

HTML to reproduce the issue:
data: '''

<iframe width="400" src="my-widget-url" width="100%" height="120" frameBorder="0">
</iframe>

''',
style: {
"body": Style(margin: EdgeInsets.zero, padding: EdgeInsets.zero),
"iframe": Style(backgroundColor: Colors.pink),
}

Expected behavior:
The iframe contains a rounded widget, so the background behind it should be pink but is white instead

Device details and Flutter/Dart/flutter_html versions:
API 33, flutter_html 2.2.1

A picture of a cute animal (not mandatory but encouraged)

[erickok]

Did you try setting the pink to the iframe content? The iframe will render as WebView and I don't think it can have NO background color (be transparent) and so setting a pink background in the iframe won't work as the WebView will show a white again.

I hope I make myself clear; let us know if you need more instructions.

[CpHeat]

Thanks for answering !
You mean like this :

style: {
"iframe": Style(backgroundColor: Colors.blue, color: Colors.pink,),
}

or inside html like this :

<iframe width="600" style="background-color:pink;color:blue;" class="spotify" height="120" src="https://open.spotify.com/embed/episode/4i3bvkOWncOQeHzZoWcJhE?utm_source=generator&theme=0" frameBorder="0" allowfullscreen="" allow="autoplay; clipboard-write; encrypted-media; fullscreen; picture-in-picture" loading="lazy"> </iframe>

I tried both but it's still showing white background. Am I doing it wrong ?

[Sub6Resources]

The WebView widget itself controls the background color. If I remember right there's an option in the WebView constructor to change the background color. If so, we can definitely tie that into our style system.