How can I fix the error where the game goes to game over logic immediately?

I am trying to build a simple game with JS and HTML, but I found it difficult to fix an error where my code immediately goes to the “game over” block at the time of running the program.
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Canvas Graphics</title>
  <style>
    .btn {
      margin-right: 65px;
      margin-top: 50px;
    }
  </style>
</head>

<body onload="startGame()">
  <h1>Canvas Graphics</h1>

  <script>
    // Game variables

    let comp1, block, blockArray = [];

    let xSpeed = 0,
      ySpeed = 0,
      blockSpeed = 0;

    let myInterval;

    // Game area setup
    const gameArea = {
      canvas: document.createElement("canvas"),
      start: function() {
        this.canvas.width = 400;
        this.canvas.height = 400;
        this.context = this.canvas.getContext("2d");
        document.body.insertBefore(this.canvas, document.body.childNodes[3]);
      }
    };

    // Movement functions
    function right() {
      xSpeed += 1;
      ySpeed = 0;
      blockSpeed = 1;
    }

    function up() {
      ySpeed -= 1;
      xSpeed = 0;
      blockSpeed = 1;
    }

    function left() {
      xSpeed -= 1;
      ySpeed = 0;
      blockSpeed = 1;
    }

    function down() {
      ySpeed += 1;
      xSpeed = 0;
      blockSpeed = 1;
    }

    // Update game components
    function updateComponent() {
      gameArea.context.clearRect(0, 0, gameArea.canvas.width, gameArea.canvas.height);
      let overlap = false;

      // Define boundaries for comp1
      const myRight = comp1.x + comp1.width,
        myLeft = comp1.x,
        myTop = comp1.y,
        myBottom = comp1.y + comp1.height;

      // Check for collisions with blocks
      for (let blocks of blockArray) {
        const blockLeft = blocks.x,
          blockRight = blocks.x + blocks.width,
          blockTop = blocks.y,
          blockBottom = blocks.y + blocks.height;

        // Collision detection
        if (myRight > blockLeft && myLeft < blockRight &&
          myBottom > blockTop && myTop < blockBottom) {
          overlap = true;
          break; // Exit loop on collision
        }
      }

      // If no overlap, update positions and create new blocks
      if (!overlap) {
        if (blockSpeed == 1) {
          gameArea.createBlockInterval += 50;

          // Create a new block every 3 seconds
          if (gameArea.createBlockInterval >= 3000) {
            let newBlock = new Component(gameArea.canvas.width,
              Math.random() * (gameArea.canvas.height - block.height),
              15,
              130,
              block.color);
            blockArray.push(newBlock);
            gameArea.createBlockInterval = 0; // Reset interval
          }

          // Update position of comp1
          comp1.x += xSpeed;
          comp1.y += ySpeed;

          // Draw player component
          gameArea.context.fillStyle = comp1.color;
          gameArea.context.fillRect(comp1.x, comp1.y, comp1.width, comp1.height);

          // Draw all blocks in the array
          for (let block of blockArray) {
            block.x -= blockSpeed; // Move blocks left
            gameArea.context.fillStyle = block.color;
            gameArea.context.fillRect(block.x, block.y, block.width, block.height);
          }
        } else {
          clearInterval(myInterval); // Stop the game loop
          prompt("Game Over"); // Notify player of game over
        }
      }
    }

    // Component constructor
    function Component(x, y, width, height, color) {
      this.x = x;
      this.y = y;
      this.width = width;
      this.height = height;
      this.color = color;

      // Draw the component on the canvas
      this.draw = function() {
        const ctx = gameArea.context;
        ctx.fillStyle = this.color;
        ctx.fillRect(this.x, this.y, this.width, this.height);
      };
    }


    // Start the game function
    function startGame() {
      gameArea.start();
      comp1 = new Component(20, 300, 50, 10, "red"); // Player component
      block = new Component(380, 100, 15, 130, "yellow"); // Initial block
      blockArray.push(block);
      myInterval = setInterval(updateComponent, 50); // Update loop every 50 ms
    }
  </script>

  <!-- Control buttons -->

  <button onclick="left()" class="btn">Left</button>
  <button onclick="right()" class="btn">Right</button><br>
  <button onclick="down()" class="btn">Down</button>
  <button onclick="up()" class="btn">Up</button><br>