使用Puppeteer点击登录按钮后模态框消失无重定向无报错如何解决

• 直接通过$eval修改输入框value属性仅修改了DOM属性值，无法触发站点前端框架绑定的input、change等表单监听事件，表单状态管理逻辑感知不到输入的账号密码，提交时读取到的是空值，直接触发模态框关闭逻辑，没有走账号密码校验流程，因此不会出现错误提示。
• 缺少元素等待逻辑，可能出现元素未完全渲染完成就执行操作的异常。

将直接赋值的操作替换为page.type()模拟真实用户输入，该方法会触发完整的输入事件，让站点表单逻辑正确捕获输入内容；同时添加元素等待逻辑提升脚本稳定性，修复后代码如下：

const puppeteer = require('puppeteer');

(async () => {
    const browser = await puppeteer.launch({ headless: false });
    const page = await browser.newPage();
    await page.setViewport({
        width: 1550,
        height: 700,
        deviceScaleFactor: 1,
    });
    // 等待页面网络空闲后再执行后续操作，避免资源未加载完成导致的异常
    await page.goto('https://splinterlands.com', { waitUntil: 'networkidle2' });
    
    // 等待登录按钮可见后点击唤起登录模态框
    await page.waitForSelector("#log_in_button button", { visible: true });
    await page.click("#log_in_button button");

    // 模拟用户输入邮箱，添加输入间隔更贴近真实操作行为
    await page.waitForSelector("input#email.form-control", { visible: true });
    await page.type("input#email.form-control", "test@gmail.com", { delay: 80 });
    
    // 模拟用户输入密码
    await page.waitForSelector("input#password.form-control", { visible: true });
    await page.type("input#password.form-control", "wrongpass", { delay: 80 });

    // 点击登录提交按钮
    await page.waitForSelector(".form-horizontal button.btn.btn-primary.btn-lg", { visible: true });
    await page.click(".form-horizontal button.btn.btn-primary.btn-lg");
})();

修改后提交错误的账号密码，站点会走正常的校验流程，弹出账号密码不匹配的错误提示，登录模态框不会直接消失。

内容的提问来源于stack exchange，提问作者Francis