使用Protractor点击连接弹窗按钮失败，报错element is not a function

报错原因及解决方案 #

1. 框架适配问题 #

element(by.xxx)是Angular专属测试框架Protractor的内置全局方法，如果你当前使用的是其他前端测试框架，不存在该全局API，就会触发该报错，对应框架的正确元素定位写法如下：

• Selenium WebdriverJS：driver.findElement(By.css('选择器'))
• Cypress：cy.get('选择器')
• Playwright：page.locator('选择器')

2. Protractor环境配置问题 #

如果确认使用的是Protractor框架，按以下步骤排查：

• 确认你是通过protractor 配置文件.js的命令启动测试，而非直接用node运行单个测试脚本，脱离Protractor运行上下文就无法调用全局element方法
• 检查你的测试代码中是否自定义了名为element的变量，覆盖了全局方法
• 弹窗如果是嵌套在iframe中，需要先切入iframe再定位元素，示例代码：

// 先定位iframe元素
const iframeEle = element(by.css('iframe的选择器'));
browser.switchTo().frame(iframeEle.getWebElement());
// 再定位弹窗内按钮
const btn = element(by.css('按钮选择器'));

• 弹窗为异步加载的情况，需要增加显式等待后再操作，示例代码：

const EC = protractor.ExpectedConditions;
const targetBtn = element(by.css('按钮选择器'));
// 最长等待5秒直到按钮可点击
browser.wait(EC.elementToBeClickable(targetBtn), 5000);
targetBtn.click();

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