Mui-datatables: Content cut off when printing

[NullP0interEx]

I have a table which contains only one colum. I draw speech bubbles in it, similar to Whatsapp.
Now I have

responsive: 'scroll'

and

overrides: { MUIDataTable: { responsiveScroll: { maxHeight: '100%' } } }

set.

Unfortunately, when I press on Print, a part is cut off.
If I print the page with CTRL + P, it works, but the rest of the UI is on the paper.

Here is a photo (with button):
Here is a photo (CTRL + P):

I suspect, when printing with the button, the virtual page is not as big as the content. How can I change that?

| Tech | Version |
|--------------|---------|
| Material-UI | 3.9.2 |
| MUI-datatables | 2.0.0-beta.56 |
| React | 16.8.3 |
| browser | Safari / Chrome |

[andrewrains]

Also seeing this issue. When I had the table option of Responsive: 'stacked' it printed all rows. Now that I have it as 'scroll' (because it's a better view on mobile), only the first 20 rows are printing and the rest cut off where the container has not expanded vertically.

[IDrissAitHafid]

+1

[vigneshwaranl]

Also seeing this issue. When I had the table option of Responsive: 'stacked' it printed all rows. Now that I have it as 'scroll' (because it's a better view on mobile), only the first 20 rows are printing and the rest cut off where the container has not expanded vertically.

I am also facing same problem.

[Destidom]

Does anyone have an workaround for this bug or any idea what is causing this?

[NullP0interEx]

No :/

[gabrielliwerant]

I'm not sure this is a bug. Does this issue occur using the default options only, or only when overriding styles? If you are seeing this when overriding styles, then you are outside of supported print functionality, since print is dependent on styles.

For example, if you've overridden the max-height, you also need to set the overflows to "visible". But that's on you to provide, since the library cannot anticipate how people will modify and override the styles.

[s33dco]

I am also noticing this issue.
I have not overridden any styles.

with these options:

options={{
filter: true,
sort: false,
filterType: 'dropdown',
responsive: 'scrollMaxHeight',
selectableRows: 'none',
pagination: false
}}

all the records are returned on a .csv download (15) but only 8 are generated the pdf.

when I remove the responsive option all the records are on the .csv and pdf.

many thanks.

[gabrielliwerant]

@s33dco Would you mind opening a new issue with your steps to reproduce? This one is out of date, as the API has changed, so I'm going to be closing it.

[JIsbak]

I am also seeing this issue and have been trying to get around it for some days now. When I use some of the example on codepen it works until I set the dependencies to more recent versions. I also see that the new window before print doesn't come up. Can it be related to react-to-print which is used?

[gabrielliwerant]

I have to close this. Printing is dictated by styling. Default styles seem to work correctly. If there's a bug, I need an issue with specific instructions and a minimal codesandbox example.