I am migrating one of my old react-electron applications to electron-vite doc. This application has a pos printer feature which was implemented using react-to-print. The printing will be in portrait. When I migrated it to electron-vite printing functionality started to act weird. Print always comes in landscape. with very small font size.
old electron version
"electron": "^22.0.0",
new electron version
"electron": "^25.6.0",
I am not sure if it's a problem with the latest version of electron or electron-vite. So, I tried to update my printing options and printing functions as well.
print options in both:
const printOptions = {
silent: true,
preview: true,
printBackground: true,
color: true,
margin: {
marginType: 'printableArea'
},
landscape: false,
pagesPerSheet: 1,
collate: false,
copies: 1
}
printer function(new):
ipcMain.on('toMain', async (event, url) => {
console.log('print invoked', url)
const win = new BrowserWindow({ show: false, width: 302, nodeIntegration: true })
win.loadURL(url)
win.webContents.on('did-finish-load', () => {
win.webContents.print(printOptions, (success, failureReason) => {
console.log('Print Initiated in Main...')
if (!success) console.log('ERR', failureReason)
})
})
return true
})
In the old app I only used show: false to create the browser window.
I tried to set the approximate print page size (80mm) to the window as width:302. As per the documentation I have set print landscape to false in printer options (even if it is the default).
I am aware of the electron-pos-printer library. but it can't be used I have lot of customization to make which is out of its scope
I tried to print a sample blog webpage with landscape: false which still gave a landscape output.
It took me a while to figure out that this issue is not related to the migration to electron-vite. Actually, electrons above v22.x.x is having this issue.
What I did was to downgrade the electron dev dependency to 22.0.0 This is only a temporary fix.