scrapin' with image generator with text (dezgo) and node.js

DEZGO__code.js

/* 
BENJAMIN SANTIAGO --> Will Rogers
(with some amended ChatGPT stuff)

So this will go to specifically, dezgo, and then, find a specific
textbox, click the "run" button, wait for the image, and then save 
the image. 

You'd have to modify this to do something like..
  * choose (randomly?) from an array of prompts
  * save the images in some kind of dynamic way
    (add the date or time, and then an index)
  * work with ffmpeg to put the images into a sequence.
  * you probably have to do something like....
    refresh the page and then do the code again, 
    probably in a for or while loop of some kind a fixed amount 
    of times.
  * probably also need to select from the dropdown
*/

//vars
//-----------------------------------------> 
const puppeteer = require('puppeteer');
const fs = require('fs');
//----------------------------------------->

//our main function
//----------------------------------------->
(async () => 
{
  //this will launch a new browser window
  //additionally, this should remove the depreciation warnings
  const browser = await puppeteer.launch({ headless: false });
  const page = await browser.newPage();

  //lezzgo to dezgo
  //----------------------------------------->
  await page.goto('https://dezgo.com/txt2img');

  try
  {
    //this is the textarea that dezgo uses, 
    //I think mud is some kind of ui toolkit?
    //----------------------------------------->
    await page.waitForSelector('textarea.mud-input-slot');

    //this is where you input your text
    await page.type('textarea.mud-input-slot', 'We are the Borg. Lower your shields and surrender your ships. We will add your biological and technological distinctiveness to our own.');

    //be a good boy, error check
    console.log('TEXT GOT IN', {timeout: 5000});

    //I stopped being a good boy and error checking after that 
    //you would consider using "try" for each of the actions here

    //the button doesn't have an id, it didn't work when I used
    //less selectors
    //----------------------------------------->
    await page.click("button.mud-button-root.mud-button.mud-button-filled.mud-button-filled-success.mud-button-filled-size-medium.mud-ripple");

    console.log('clicked the button');

    //this saved the html page, helpful
    /*
    const pageHTML = await page.content();
    fs.writeFileSync('webpage_content.html', pageHTML);
    */

    //this is the id, for when an image appears
    await page.waitForSelector('img#image-output', {timeout: 20000});
    
    //some console output
    console.log('WE GOT A PIC-CHA');

    //save our image into a file
    //----------------------------------------->
    const imageSelector = 'img#image-output'; // Replace with the actual CSS selector for the image.
    const imageElement = await page.$(imageSelector);
    
    if (imageElement) {
      await imageElement.screenshot({ path: 'image.png' }); // You can specify the filename and format
      console.log('Image saved.');
    } else {
      console.log('Image not found.');
    }
    //----------------------------------------->

  } catch (error) 
  {
    //this is the error for the text area. 
    //I didn't do nested try statements partially out of laziness
    //and just to make sure it was working first.
    console.error('Textarea not found or an error occurred:', error);
  }
  // Close the browser
  await browser.close();
})();