search

MatthewHerbst / react-to-print

Print React components in the browser. Supports Chrome, Safari, Firefox and EDGE
MIT License
2.06k stars 221 forks source link

[Firefox] about:srcdoc instead of url in the header #643

Open MariaMironets opened 1 year ago

MariaMironets commented 1 year ago

Hi! I noticed an issue with Firefox, both on macOS and windows - instead of URL in the header about:srcdoc text is presented. This issue is reproducible in the sandbox and is not reproducible with window.print().

Print with react-to-print:

Screenshot 2023-09-19 at 5 19 59 PM

Print with window.print():

Screenshot 2023-09-19 at 5 21 02 PM

Here is an example: https://codesandbox.io/s/async-morning-6hchhs?file=/src/App.js

MatthewHerbst commented 1 year ago

I think this is a Codesandbox/iframe specific thing. The URL of the page within Codesandbox is the iframe they are using to sandbox the code, not codesandbox.io

MariaMironets commented 1 year ago

thanks! but definitely not codesandbox specific, it's reproducible in our app as well

MatthewHerbst commented 1 year ago

Could you show an example please?

window.print will print the entire page from the root, so it will have the correct url, but the wrong content. react-to-print prints from within an iframe, this is how it prints only the content you want printed, not the whole page.

MariaMironets commented 12 months ago

Sure! Here is the repo containing the same example - https://github.com/MariaMironets/react-to-print-example

Screenshot 2023-09-19 at 7 38 32 PM

update: it's also reproducible with your examples locally (with pageStyle set to '').

MatthewHerbst commented 12 months ago

Ah, I see. This text is set by the browser, not react-to-print (which is why we hide it by default). I don't think we have a way to control this; react-to-print must use an iframe to print. I see it working fine in Chrome. I will look through the Firefox open issues and see if this has been reported yet, thanks!

MariaMironets commented 12 months ago

Thanks a lot!

isocroft commented 8 months ago

Hey. @MatthewHerbst , is it possible to use CSS to set the text in the header to white ?

So, it's there but it's like it isn't there because it blends with the white background color and is hidden.

Since the text is set by the browser and so cannot be removed completely but maybe can be hidden

MatthewHerbst commented 8 months ago

is it possible to use CSS to set the text in the header to white ?

It's an interesting idea, I'm not sure. It would depend on if that text is injected while the page is still in its HTML state or if it's injected later on in the printing. My assumption is the latter, since if they injected it while the page was still HTML they would risk screwing up styles for the page.

ipedersenew commented 5 months ago

I am encountering this same issue in Firefox and Safari, but not in Chrome and Edge.