Theme styles aren't applied within the result preview pane (iframe)

[haroonrafi]

Issue: Preview iframe doesn't use theme colours, causing text to appear "hidden" by default when using the Hain Dark theme

Hain: v0.7.0-beta.1
OS: Windows 10 64-bit
RAM: 16GB

Details:

I found when writing a Hain plugin that the result preview pane does not follow the theme styles, which is to be expected since it uses an iframe.

This is quite problematic, since using the dark theme means that you have the default (dark) text colour on top of a dark background, so it looks blank even when there is text in it. Making the text white on the other hand would cause the same issue with the light theme.

Of course there's the option of giving the iframe a specific background colour, but then that defeats the purpose of theming, and looks especially bad when transparency is enabled.

My workaround for now has been to run a script on the load event within the iframe that looks at the parent document, and then tries finds inline styles and apply those. I also had to load the Roboto font every time a result it highlighted in order to get the fonts consistent. This isn't something I'm too comfortable with since it relies on something that could easily end up being changed.

Is there any other way around this that I'm missing?

I think that iframes are generally very restrictive, and that the use of an iframe for the preview should be an option rather than the default - keeping the preview within the main DOM would make it much more flexible. Failing that, at the very least the main window should post a message to the iframe to pass it the basic colour information.

It might also be helpful if the pluginContext allowed some sort of access to the theme, or if there were perhaps some CSS classes that could be reused in the results list and preview pane for consistency.