This code send the first emit to client and client get the messageStart : 'Job is starting...' This is OK. After that the code launch puppeteer and make the screen shot example.png. This is OK too. But the second emit is not fired and not send to client. In the console.log of the server I get :

• job is starting
• CAPTURE FINISHED
• job is finished

This is OK too.

What happened? Why is the second emit not fired?

const express = require('express');
const puppeteer = require('puppeteer')
const app = express();
const server = app.listen(3000);

app.set('view engine', 'ejs');
var io = require('socket.io').listen(server);

app.get('/', function (req, res, next) {
  res.render('index');
});

app.get('/scan', function (req, res, next) {
  console.log('job is starting');

  io.sockets.on('connection', function (socket) {
    socket.emit('messageStart', 'Job is starting...');
  });

  (async () => {
    const browser = await puppeteer.launch({headless:false});
    const page = await browser.newPage();
    await page.goto('');
    await page.screenshot({ path: 'example.png' });
    await browser.close();
    console.log('CAPTURE FINISHED');
  })().then(()=>{
      console.log('job is finished');

      io.sockets.on('connection', function (socket) {
          socket.emit('messageEnd', 'Job is done!');
        });
    });
  res.render('scan');
});

This code send the first emit to client and client get the messageStart : 'Job is starting...' This is OK. After that the code launch puppeteer and make the screen shot example.png. This is OK too. But the second emit is not fired and not send to client. In the console.log of the server I get :

• job is starting
• CAPTURE FINISHED
• job is finished

This is OK too.

What happened? Why is the second emit not fired?

const express = require('express');
const puppeteer = require('puppeteer')
const app = express();
const server = app.listen(3000);

app.set('view engine', 'ejs');
var io = require('socket.io').listen(server);

app.get('/', function (req, res, next) {
  res.render('index');
});

app.get('/scan', function (req, res, next) {
  console.log('job is starting');

  io.sockets.on('connection', function (socket) {
    socket.emit('messageStart', 'Job is starting...');
  });

  (async () => {
    const browser = await puppeteer.launch({headless:false});
    const page = await browser.newPage();
    await page.goto('https://example.');
    await page.screenshot({ path: 'example.png' });
    await browser.close();
    console.log('CAPTURE FINISHED');
  })().then(()=>{
      console.log('job is finished');

      io.sockets.on('connection', function (socket) {
          socket.emit('messageEnd', 'Job is done!');
        });
    });
  res.render('scan');
});

• javascript
• node.js
• express
• async-await
• puppeteer

2 Answers 2

You need to listen to the connection once and emit to the socket twice.

const scanner = async () => {
  const browser = await puppeteer.launch({headless:false});
  const page = await browser.newPage();
  await page.goto('https://example.');
  await page.screenshot({ path: 'example.png' });
  await browser.close();
  console.log('CAPTURE FINISHED');
}

app.get('/scan', async function (req, res, next) {
  // emit to all clients on start
  console.log('job is starting');
  io.emit('messageStart', 'Job is starting...');

  // do the actual stuff
  await scanner();

  // emit to all clients on finish
  console.log('job is finished');
  io.emit('messageEnd', 'Job is done!');

  res.render('scan');
});

Here the plete code based on code of Md. Abu Taher :

const scanner = async () => {
    // emit this message when the scan really starts
    io.sockets.on('connection', function (socket) {
        io.emit('messageDoing', 'Doing the Job ...');
    });
    const browser = await puppeteer.launch({ headless: false });
    const page = await browser.newPage();
    await page.goto('https://example.');
    await page.screenshot({ path: 'example.png' });
    await browser.close();
    console.log('CAPTURE FINISHED');
};

app.get('/scan', async function (req, res, next) {
    // emit to all clients on start
    console.log('job is starting');
    io.sockets.on('connection', function (socket) {
        io.emit('messageStart', 'Job is starting...');
    });

    // do the actual stuff
    await scanner();

    // emit to all clients on finish
    console.log('job is finished');
    io.sockets.on('connection', function (socket) {
        io.emit('messageEnd', 'Job is done...');
    });
    res.render('scan')
});