nodejs using puppeteer, how to fix 'TypeError: browser.newpage is not a function'

Question

Below is the code which is trying to execute a browser going to the specified 'rand_url'.

Upon running the script I get the following errors:

TypeError: browser.newpage is not a function
    at initBrowser
    at async checkout

I am trying to figure out where I've gone wrong in trying to get this to execute in the browser.

Below is the .js


const puppeteer = require('puppeteer');

const rand_url = "URL Redacted for Privacy";

async function initBrowser(){
    const browser = await puppeteer.launch({headless:false});
    const page = await browser.newpage();
    await page.goto(rand_url);
    return page;
}

async function addToCart(page){
    //SELECT TICKET
    await page.$eval("button[class='btn btn-block button-primary ng-scope']", elem => elem.click());
    await page.waitfor(2000);
    //BRING UP ADD TO CART
    await page.$eval("button[class='buyer-type-minicart-button-container primary ng-scope']", elem => elem.click());
    await page.waitfor(2000);
    //ADD TO CART
    await page.$eval("button[class='primary block ng-scope']", elem => elem.click());
    await page.waitfor(2000);
    //CVV
    await page.type("input[id='input-one'", '630');
    await page.waitfor(2000);
    //CONFIRM AGE
    await page.$eval("button[class='data-protection-checkbox data-protection-opt-in-checkbox ng-pristine ng-untouched ng-valid']", elem => elem.click());
    await page.waitfor(2000);
    //PLACE ORDER
    await page.$eval("button[class='btn button-primary ng-binding ng-scope']", elem => elem.click());
    await page.waitfor(2000);
}


async function checkout(){
    const page = await initBrowser();
    await addToCart(page);
}

checkout();

Please [see the docs](https://pptr.dev/api/puppeteer.browser.newpage). As an aside, [almost always avoid](https://blog.appsignal.com/2023/06/14/puppeteer-in-nodejs-more-antipatterns-to-avoid.html#adding-premature-abstractions#using-attribute-css-syntax-for-classes) selectors like `button[class='btn button-primary ng-binding ng-scope']`. They'll fail if the order changes, or whitespace changes, or an extra class shows up in that class list. Prefer `.btn.button-primary.ng-binding.ng-scope` which ignores order and allows for extra classes to be present, and is more pleasant to read and type. — ggorlen, Aug 30 '23 at 15:18
As another aside, [avoid timeouts](https://stackoverflow.com/a/73676564/6243352) which are unreliable. — ggorlen, Aug 30 '23 at 15:19

score 0 · Accepted Answer · answered Aug 30 '23 at 09:47

0

I think, that you have a typo in your method name. Try using browser.newPage instead of browser.newpage

answered Aug 30 '23 at 09:47

Magzum Kalybek

58
6

Thanks for the answer. Usually, when it's just a typo, it's best to leave a comment and let those with close privileges remove the post. We have a close reason: "Not reproducible or was caused by a typo: While similar questions may be [on-topic](https://stackoverflow.com/help/on-topic) here, this one was resolved in a way less likely to help future readers." – ggorlen Aug 30 '23 at 15:20
1

@ggorlen thanks for your comment. I will take it into account in the future – Magzum Kalybek Aug 30 '23 at 16:29

score 0 · Answer 2 · answered Aug 30 '23 at 10:07

JavaScript is language where variable / function naming is usually in camelCase and variables and method names are case sensitive.

browser.newpage() and browser.newPage() are different calls.

Instance of browser has newPage() function, but doesn't have newpage(), so you get error that property newpage is not a function.

Same thing you have with waitfor. Page instance has waitFor (which is deprecated), in new Puppeteer versions this function is called waitForTimeout.

Also I suggest you not to use implicit waits and just to wait for selector and click on it.

Example:

await page.waitForSelector("button[class='btn btn-block button-primary ng-scope']").then(el => el!.click());

nodejs using puppeteer, how to fix 'TypeError: browser.newpage is not a function'

2 Answers2