Describe the bug

FontFaceSet's that come from an @font-face rule cant be added to the Popout Windows FontFaceSet thus leaving the page blank and bailing out of the execution process (? unconfirmed)

To Reproduce

Open the Demo with Firefox 112.0 and try to pop-out the window, it stays blank and doesnt show anything. The bug described above is observed in the same frame where the main Application resides when the popout-window has opened.

Expected behavior

It should show the component that is inside the popout-window tag.

Priority

This Problem only is observed on Firefox and should be resolved as fast as possible imho.

Screenshots/Video

Lines that cause this error:
https://github.com/Shemesh/angular-popout-window/blob/master/projects/popout-window/src/lib/popout-window.component.ts#L102-L104

Possible fix:

One way would be to create an opt-out on copying fonts from the main document to the popout document.
This could be done through creating a .forRoot(...) function with the said opt-out in the module, or to check if the currently iterated Font Face is a @font-face rule. The latter i already checked and i havent found any properties which could provide this information to check against. So we would be stuck with the first Option to create an opt-out.
I think wrapping the lines mentioned above in a try/catch block (and showing a warning on failure) would be enough to fix this current behaviour.

Desktop

• OS: Windows 11
• Browser: Firefox 112.0 (64 Bit)
• Version: 4.0.0

Do you want to create a PR for this?

Yes

Additional context

This happens only on Firefox, Chrome seems to have no problem with that behaviour whatsoever.

I also found the exact problem for this on w3c issues page: w3c/csswg-drafts#5707