Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

I am getting a blank screenshot when I test on mobile screen #55

Open
trandinhhiep789 opened this issue Feb 25, 2023 · 1 comment
Open

Comments

@trandinhhiep789
Copy link

trandinhhiep789 commented Feb 25, 2023

Whenever I use this plugin to take a screenshot, I always get a blank screenshot.
Whenever I use this plugin to take a screenshot with mobile screen size, I always get a blank screenshot.
If I use website size or ipad size everything works fine, but when I minimize the website to phone screen size it doesn't work

"use-react-screenshot": "^3.0.0",
"html2canvas": "^1.4.1",

This is my code.

`
import { useScreenshot, createFileName } from "use-react-screenshot";
...
const imgBillPrint = useRef(null);
const [image, takeScreenShot] = useScreenshot({
type: "image/jpeg",
quality: 1.0
});

const download = (image: any, { name = "img", extension = "jpg" } = {}) => {
	const a = document.createElement("a");
	a.href = image;
	a.download = createFileName(extension, name);
	a.click();
};
const downloadScreenshot = () => takeScreenShot(imgBillPrint.current, {
	allowTaint: false,
	useCORS: true,
  }).then(download);

....

    <TabPanel>
          <Box h="100%" ref={imgBillPrint}>
                /// content want to screenshot
          </Box>


   <button style={{ marginBottom: '10px' }} onClick={downloadScreenshot}>
Take screenshot
   </button>
    <img width={'100%'} src={image} alt={'Screenshot'} />

   </TabPanel>

`

image

image

@tawago
Copy link
Contributor

tawago commented Apr 23, 2023

@trandinhhiep789 second parameter is not accepted. @vre2h hasn't maintained this project lately so PR: #36 is still waiting there to be merged.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants