Comments (15)
@TheRogue76 Try background image as base64. Because the app doesn't know whether the image path will be absolute or relative path. for the first time loading it get confused. after it working fine. I tried it's working fine.
from react-to-print.
The same problem
from react-to-print.
What path is provided for the image? is it absolute? Or relative?
My guess is that it is a relative path and I need to fix the package to handle relative paths for images. That was a recent bug in the stylesheets that I should address here regardless
from react-to-print.
absolute path @gregnb
from react-to-print.
same problem
from react-to-print.
Any update? I'm having the same issue when trying to print an image using Edge. Using Chrome, Firefox and IE it works fine. Pressing CTRL+P works fine in Edge.
from react-to-print.
I just published 1.0.18 and I've added a debug mode. To turn it on add the debug={true} prop like so:
<ReactToPrint
trigger={() => <a href="#">Print this out!</a>}
content={() => this.componentRef}
debug={true}
/>
What this will do is when you click to print it'll open the print window but it will NOT print and it will NOT close. What I would like is if anyone experiencing issues could open up console and then look for any issues? Also, if they could paste the contents HTML elements like so below:
from react-to-print.
I have an <img src="url" />
url is an Amazon S3 url.
When triggered, and the Print dialog opens,
I see the network tab, it doesn't request for this image, first time.
then I close the dialog.
And open again
this time it fetches the url.
from react-to-print.
my observations are, on trigger, it does not fetch the image first time.
on second trigger it fetches the image as 'octet-stream' and renders it in print dialog.
on further triggers, the image is not fetched, but is seen in the print dialog.
Hope this helps @gregnb
from react-to-print.
I would encourage anyone having issues to try the new beta version which is going to rely on an iframe to solve the cross origin issues some people are experiencing.
npm install [email protected]
and let me know the feedback if this solves issues
from react-to-print.
i have used https://www.npmjs.com/package/rc-print
from react-to-print.
Any update here? I'm having the same issue.
from react-to-print.
Hello, It's still not working. I have that issue. contains the img with src or the div with a background but it's not on the print. What is more it does not trigger print-system dialog while contains an image.
from react-to-print.
hello @saraems can you please possibly make a codesandbox showing the problem?
from react-to-print.
What path is provided for the image? is it absolute? Or relative?
My guess is that it is a relative path and I need to fix the package to handle relative paths for images. That was a recent bug in the stylesheets that I should address here regardless
Hi there. I'm using Electron and React for my project and while i can show the image in the app using import or require, the second i try to print it it vanishes. It's using a relative path for the image src. Calling the absolute path (ex: http://localhost:3000/static/media/logo1.0550988b.png) will work in development and show the image in both the app and the printed file, But this can not be done in production (the webpage files are not available). Any ideas?
from react-to-print.
Related Issues (20)
- Add dynamic colors to print function HOT 1
- How to check that the user click on Save in `onAfterPrint`? HOT 2
- getting Supplied Data is not a valid base64-String jsPDF.convertStringToImageData erorr while directly downloading image HOT 1
- Border top and bottom HOT 1
- Save as PDF hangs in print view HOT 1
- Blank PDF when trying to generate in production. HOT 2
- How should i handle large data to print? HOT 8
- Why does it render different content when in im browsing in mobile HOT 3
- Blank Page while printing after a certain period of time HOT 9
- How to add style using PageStyle prop, without it overriding component’s style HOT 5
- Warning: findDOMNode is deprecated outside StrictMode. HOT 10
- Unhandled error when trying to print not fully loaded canvas elements HOT 3
- HTML doctype declaration is displaying on top of the print dialog window HOT 10
- Print datatables HOT 4
- CSS "break-before" (replacing "page-break-before") not supported HOT 3
- '.brf' file : Change the save directory. HOT 3
- Disable option in browser window to automatically add headers and footers HOT 1
- img tag adds much more to the final PDF size than it should HOT 3
- State changes not effected fist time for print content HOT 6
- Content Overlaps with Footer in Printed Document HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-to-print.