WebdriverIO元素数组调用isExisting()报TypeError问题排查

• 核心报错原因：browser.$$() 返回值是匹配到的DOM元素实例构成的数组，isExisting() 是单个元素实例的内置方法，数组本身不存在该方法，直接对数组调用就会抛出你遇到的类型错误，你的判断方向是正确的。
• 代码额外存在两个逻辑问题：
  • 元素查询时机错误：你在调用browser.$$()查询元素之后才执行ideOpenSidebar打开侧边栏，此时侧边栏DOM还未渲染，大概率查询不到目标元素。
  • 返回值丢失：你在.then()回调内部返回的文本数组，不会作为整个getTreeTexts函数的返回值，因为外层没有return这个Promise链，调用方拿不到最终结果。

1. 调整执行顺序：先打开侧边栏等待DOM渲染完成，再执行元素查询
2. 存在性校验直接判断返回数组的长度即可，不需要调用isExisting()；如果需要校验单个元素的存在状态，在遍历过程中对单个元素实例调用方法即可
3. 去掉不必要的.then()嵌套，直接在async函数内按顺序执行逻辑，保证返回值能正确透出

修复后的完整代码：

async function getTreeTexts(browser, sidebar, parentClass, treeClass, spanClass = 'caption') {
    const cl = c => c ? '.' + c : '';
    // 先打开侧边栏，确保目标DOM已经渲染
    await browser.ideOpenSidebar(sidebar)
    // 侧边栏打开后再查询匹配元素，$$返回元素数组
    const elementList = await browser.$$(`${cl(parentClass)} .ace_tree${cl(treeClass)} .tree-row span${cl(spanClass)}`);
    
    // 数组长度为0即代表没有匹配到元素，直接返回空数组
    if (elementList.length === 0) {
        return [];
    }

    const configs = [];
    for (const element of elementList) {
        try {
            // 如需校验单个元素存在性，可在此处对element调用isExisting()
            const text = await element.getText();
            configs.push(text);
        } catch (err) {
            configs.push('[deleted]');
        }
    }
    return configs;
}

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