如何让JavaScript版Protractor等待文件读取完成后再执行后续操作

问题根因 #

你当前使用的fs.readFile是异步API，回调函数会等到IO操作完成后才执行，但主线程不会等待回调触发，直接就返回了初始值null，所以launchAppURL中拿到的data永远是空值，自然无法正常打开目标站点。

解决方案 #

方案1：使用同步文件读取API（改动最小，最适配你的需求） #

直接把异步读取替换为同步API fs.readFileSync，代码执行到这一步会自动阻塞到文件读取完成再往下走，完全不需要额外加sleep方法：

function retrieveAppURL(){
    const fs = require('fs');
    try {
        const text = fs.readFileSync("appURL.txt");
        const data = text.toString();
        console.log("text file data = " + data);
        return data;
    } catch(err) {
        console.log("error " + err);
        return null;
    }
}

function launchAppURL(){
    try {
        var data = retrieveAppURL();
        if(data) {
            browser.waitForAngularEnabled(false);
            browser.get(data);
        }
    } catch (err) {
        console.log("exception " + err.message);    
    }
}

方案2：异步读取+Promise适配（适合大文件读取场景） #

如果读取的文件较大不想阻塞主线程，可以把读取逻辑封装为Promise，结合async/await实现等待逻辑：

function retrieveAppURL(){
    const fs = require('fs');
    return new Promise((resolve, reject) => {
        fs.readFile("appURL.txt", (err, text) => {
            if (err){
                console.log("error " + err);
                reject(err);
            } else {
                const data = text.toString();
                console.log("text file data = " + data);
                resolve(data);
            }
        });
    });
}

async function launchAppURL(){
    try {
        const data = await retrieveAppURL();
        browser.waitForAngularEnabled(false);
        browser.get(data);
    } catch (err) {
        console.log("exception " + err.message);    
    }
}

注意事项 #

• 确保appURL.txt的路径是相对Protractor执行命令的工作目录，或者直接填写绝对路径避免读取失败
• browser.waitForAngularEnabled(false)建议放在browser.get之前执行，避免进入页面后再切换模式触发多余的等待逻辑

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