Fix

// Importing necessary modules 
console.log('Importing necessary modules');
const { chromium } = require('playwright-extra');
const stealth = require('puppeteer-extra-plugin-stealth')();

// Adding stealth plugin to the chromium browser 
console.log('Adding stealth plugin to the chromium browser');
chromium.use(stealth);

(async () => {
  const browser = await chromium.launchPersistentContext('browser_data', { headless: false });

  // Create a new page 
  console.log('Create a new page');
  const page = await browser.newPage();

    // Navigate to test page 
    console.log('Navigate to test page');
    await page.goto('http://127.0.0.1:3000/');



    async function getGameData(page, gameSelector) {

      // Get game eleement 
      console.log('Get game eleement');
      const game = await page.locator(gameSelector);

      // Get circles of game 
      console.log('Get circles of game');
      const circles = await game.locator('[data-type="coordinates"]').all();

      // Initalize variables 
      console.log('Initalize variables');
      let lastColumn = 0;
      let streakStart = 0;
      let streakLength = 0;

      // Loop through circles 
      console.log('Loop through circles');
      for (let index = 0; index < circles.count(); index++) {

        // Circle element in each iteration 
        console.log('Circle element in each iteration');
        const circle = circles[index];

        // Extract data from circle element 
        console.log('Extract data from circle element');
        let column = parseInt(await circle.getAttribute('data-x'), 10);
        let row = parseInt(await circle.getAttribute('data-y'), 10);

        // Calculate last column and index of start of streak 
        console.log('Calculate last column and index of start of streak');
        if (column > lastColumn && row === 0) {
          lastColumn = column;
          streakStart = index;
        }
      }
      
      // Slice circles array at streak start then count streak length 
      console.log('Slice circles array at streak start then count streak length');
      circles.slice(streakStart).forEach(() => {
        streakLength += 1;
      });
      
      // Return game data 
      console.log('Return game data');
      return { lastColumn, streakLength };
    } 

    // Dynamic selector for game container   
    console.log('Dynamic selector for game container  ');
    const gameSelector = '[class*="bigRoadContainer--"]';
    const game = await page.locator(gameSelector).first();
    console.log(game);
    // Loop forever 
    console.log('Loop forever');
    while (true) {
      console.log('Delay between loops');
      await page.waitForTimeout(1000);

      // If game is present 
      console.log('If game is present');
      page.addLocatorHandler(page.locator(gameSelector),

        // Then run this function 
        async() => {

          // Get all games 
          console.log('Get all games');
          let games = await page.locator(gameSelector).all();

          // Loop through each game 
          console.log('Loop through each game');
          for (let index = 0; index < games.length; index++) {

            // Get game in each iteration 
            console.log('Get game in each iteration');
            let game = await games.nth(index);

            // Get game data 
            console.log('Get game data');
            let data = await getGameData(page, game);

            // Log data of game 
            console.log('Log data of game');
            console.log(`Container ${index + 1} Last Column: ${data.lastColumn} Streak Length: ${data.streakLength}`);
          }
        }
      );

      // Delay between loops 

    }
    
    // Close browser when done 
    console.log('Close browser when done');
    await browser.close();
    })();