Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

let win = new BrowserWindow({width: 302, height: 793,show:false});
win.once('ready-to-show', () => win.hide());
    fs.writeFile(path.join(__dirname,'/print.txt'), "Test Print From the app",function(){
        win.loadURL(`file://${path.join(__dirname,'/print.txt')}`);
        win.webContents.on('did-finish-load', () => {
            let printersInfo = win.webContents.getPrinters();
            let printer = printersInfo.filter(printer => printer.isDefault === true)[0];
            win.webContents.print({silent: true, printBackground: true, deviceName : printer.name},() => {
                win = null;
win.webContents.print(silent: true, printBackground: true, deviceName : "POS-1") yields unusual data like the below image:
win.webContents.print(silent: false, printBackground: true, deviceName : "POS-1") yields unusual data and overlapping the file text like the below image:
if i write it with silent : true and without the deviceName then it's yields nothing..
let win = new BrowserWindow({show:false});
win.once('ready-to-show', () => win.hide());
win.loadURL(`file://${path.join(__dirname,'/hello.html')}`);
win.webContents.on('did-finish-load', () => {
    win.webContents.print({silent: true});
  
if i write it with the deviceName then it's yields the same output
  which i have shown in the picture above.
let win = new BrowserWindow({show:false});
win.once('ready-to-show', () => win.hide());
win.loadURL(`file://${path.join(__dirname,'/hello.html')}`);
win.webContents.on('did-finish-load', () => {
    let printersInfo = win.webContents.getPrinters();
    let printer = printersInfo.filter(printer => printer.isDefault === true)[0];
    win.webContents.print({silent: true, deviceName : printer.name});
How to reproduce
silent = true
win.webContents.print({
  silent: true,
  printBackground: false,
  deviceName: 'POS-1'
silent = false
win.webContents.print({
  silent: false,
  printBackground: false,
  deviceName: 'POS-1'
Even in electron 11.0, I faced this issue while printing HTML template. And found the solution. The problem is margin of the page. I added margin-top for my header content and  now its printing correctly without unusual data.
Main.js
ipcMain.on('print', (event, arg) => {
    let win = new BrowserWindow({ width: 302, height: 793, show: false });
    win.once('ready-to-show', () => win.hide());
    fs.writeFile(path.join(__dirname, '/printme.html'), arg, function () {
        win.loadURL(`file://${path.join(__dirname, '/printme.html')}`);
        win.webContents.on('did-finish-load', () => {
        // Finding Default Printer name
            let printersInfo = win.webContents.getPrinters();
            let printer = printersInfo.filter(printer => printer.isDefault === true)[0];
            const options = {
                silent: true,
                deviceName: printer.name,
                pageSize: { height: 301000, width: 50000 }
            win.webContents.print(options, () => {
                win = null;
    event.returnValue = true;
printme.html
<style type="text/css">   
    #content {
        margin-top: 15px;
</style>
<div id="page-wrap">
    <div id="content">
        my header content
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.