Как активировать модал «Подписчики» в Instagram?

Question

Я не могу заставить свою марионетку щелкнуть ссылку "Подписчики" в Instagram.

Я предполагаю, что Instagram совершил какое-то противоботское волшебство, но, возможно, я слишком заговорщик об этом.

Как мне показать модал "Подписчики"?

Это мой код:

const puppeteer = require('puppeteer');

var instagram = {
    username: 'username',
    password: 'password'
}

var run = ()=>{
    (async () => {
        const browser = await puppeteer.launch({headless: false, args: ['--lang=en-EN,en']});

        const page = await browser.newPage();
        await page.setExtraHTTPHeaders({ 'Accept-Language': 'en' });
        await page.goto('https://www.instagram.com/accounts/login');

        await page.waitFor(1500);

        await page.click("input[type=\"text\"]")
        await page.keyboard.type(instagram.username);

        await page.click("input[type=\"password\"]")
        await page.keyboard.type(instagram.password);

        await page.click("button[type=\"submit\"]");
        await page.waitForNavigation();


        await page.click(".HoLwm");

        await page.click(".glyphsSpriteUser__outline__24__grey_9")
        await page.waitForNavigation();
        await page.waitFor(2500);

        await page.waitForSelector('a.-nal3');
        await page.evaluate(() => document.querySelector('a.-nal3')) //does not work
        //await page.click(".-nal3") //does not work
        await page.waitFor(3000);

        await page.waitFor(1000);


        //await browser.close();
    })();
}

run()

Answer 1

При просмотре вашего сценария я заметил, что не все ваши селекторы одинаковы в моем Instagram, поэтому я исправил его, стараясь не использовать точные селекторы, поскольку они могут измениться завтра.

Но это работает сегодня (см. Комментарии о том, что изменилось в скрипте):

var run = ()=>{
    (async () => {
        const browser = await puppeteer.launch({headless: false, args: ['--lang=en-EN,en']});
        const rand = function(){ return Math.floor(1000 + Math.random() * 2000) }

        const page = await browser.newPage();
        await page.setExtraHTTPHeaders({ 'Accept-Language': 'en' });
        await page.goto('https://www.instagram.com/accounts/login');

        // When you can try not to `waitFor` set periods of time
        // Wait for selectors, wait for random periods of time            
        await page.waitForSelector('button[type=\"submit\"]');

        await page.click("input[type=\"text\"]")
        await page.keyboard.type(instagram.username);
        await page.waitFor(rand())

        await page.click("input[type=\"password\"]")
        await page.keyboard.type(instagram.password);
        await page.waitFor(rand())

        await page.click("button[type=\"submit\"]");

        await page.waitForNavigation();
        await page.waitFor(rand())

        // After login we're back on the main page
        // Wait till React starts and paints the interface
        // We're waiting for "Profile" icon to be visible        
        await page.waitForSelector("span[aria-label='Profile']");

        // Then we click on the link inside of which the icon is located
        // That is link to the profile            
        await page.evaluate(() => document.querySelector("span[aria-label='Profile']").parentNode.click() );

        await page.waitForNavigation();
        await page.waitFor(rand())

        // Do not rely on a selector
        // Find a link that contains "followers" in its href
        await page.waitForSelector("a[href*='followers']");
        const followers = await page.evaluate(() => document.querySelector("a[href*='followers']").textContent)
        console.log("Total followers: " + followers);

        // Click on the followers link
        await page.evaluate( () => document.querySelector("a[href*='followers']").click() )

        // Wait for the followers modal and profiles
        await page.waitFor("div[role='presentation'] div[role='dialog'] div:nth-child(2) ul li");

        // Get followers that are in the list in the second div of that modal
        const people = await page.evaluate(() => {
            return [...document.querySelectorAll("div[role='presentation'] div[role='dialog'] div:nth-child(2) ul li")]
            .map(user => {

                const profLink = user.querySelector("a[title]")
                return {
                    "name" : profLink.textContent,
                    "url"  : profLink.href
                };

            })            
        })

        console.log(people)

        // await browser.close();
    })();
}