Search code examples
javascriptnode.jstypescriptexpressweb-development-server

Why isn't my console message being printed out when I press the login button?


I'm trying to teach myself web server development and am modifying an ExpressJS with Typescript repo I found on Github. To start, I just want to print something to the console when I press the login button, but it's not working. I tried using both console.log() and the jet-logger package that is used in other files in this repo, but nothing shows up in the console. I'm using the dev env to run this on my localhost:3000.

login.js:

import logger from 'jet-logger';

// Login user
document.addEventListener('click', (event) => {
  event.preventDefault();

  if (event.target.matches('#login-btn')) {
    console.log('Login button was pressed')
    logger.info('Login button was pressed')
    var emailInput = document.getElementById('email-input');
    var pwdInput = document.getElementById('pwd-input');
    var data = {
      email: emailInput.value,
      password: pwdInput.value,
    };
    Http
      .post('/api/auth/login', data)
      .then(() => {
        window.location.href = '/users';
      });
  }
}, false);

Console after pressing the login button (nothing happens):

C:\Users...\api> npm run dev

[>] handheldapi@0.0.0 dev

[>] nodemon

[nodemon] 2.0.22

[nodemon] to restart at any time, enter rs

[nodemon] watching path(s): src***

[nodemon] watching extensions: ts,html

[nodemon] starting ./node_modules/.bin/ts-node --files -r tsconfig-paths/register ./src [2023-06-29T19:27:33.681Z] INFO: Express server started on port: 3000

GET / 304 4.529 ms - -

GET /stylesheets/login.css 304 1.644 ms - -

GET /scripts/http.js 304 1.489 ms - -

GET /scripts/login.js 200 2.874 ms - 730


Solution

  • The console your provided is the running nodejs process with your server script. In this place , you will see all the stdout and stderr output of your nodejs runtime. If you console.log("foo") inside your express script you will see there

    The code you provided is frontend one, so information will be logged in your navigator console (or debug console if you use remote debugging from VS code for example)