Python Selenium自动化测试send_keys输入内容后续丢失问题求助

出现输入内容叠加placeholder、操作后内容被清空、send_keys定位超时的核心原因有两个：

• 目标输入框是React/Vue/Angular等前端框架渲染的受控组件，输入框的值由框架内部状态统一管理。直接通过JS修改DOM的value属性不会触发框架监听的input/change事件，框架内部存储的输入值始终为空，一旦触发组件重渲染、失焦校验等逻辑，输入框就会被重置为空值；同时因为没触发焦点事件，placeholder不会自动隐藏，就会出现内容和placeholder叠加的显示效果。
• send_keys抛出超时异常，一般是三个原因：元素嵌套在iframe内未切换、元素id为动态生成值导致定位失效、元素上层覆盖透明遮罩层被Selenium判定为不可交互。

1. 先解决元素定位超时问题 #

• 打开浏览器开发者工具检查目标输入框是否嵌套在iframe标签内，如果存在iframe，必须先切换到对应iframe再执行定位操作：

from selenium.webdriver.common.by import By
# 替换为实际iframe的定位逻辑
iframe = driver.find_element(By.CSS_SELECTOR, 'iframe[src*="manage"]')
driver.switch_to.frame(iframe)

• 检查元素id是否包含随机生成的数字、字符串后缀，如果是动态id，放弃id定位，改用placeholder、name属性、关联label文本等稳定特征定位：

# 示例：通过placeholder属性定位输入框
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
input_locator = (By.XPATH, '//textarea[@placeholder="请输入描述内容"]')
# 优先等待元素可见，部分前端框架要等元素渲染完成才会绑定交互事件
input_ele = WebDriverWait(driver, 10).until(EC.visibility_of_element_located(input_locator))

• 检查输入框上层是否覆盖透明遮罩层（比如加载弹窗、固定定位的div），如果有，等待遮罩层消失后再操作输入框。

2. 正确输入内容，避免被前端框架清空 #

优先方案：模拟真实用户操作流程输入 #

完全复现真人点击输入的逻辑，触发所有前端依赖的交互事件：

from selenium.webdriver.common.action_chains import ActionChains
from selenium.webdriver.common.keys import Keys
import time

# 先滚动到输入框可视区域中央，避免被页面头尾、悬浮按钮遮挡
driver.execute_script("arguments[0].scrollIntoView({block: 'center'});", input_ele)
# 移动到输入框位置点击，触发焦点逻辑
ActionChains(driver).move_to_element(input_ele).click().perform()
# 等待100ms，等前端执行完焦点逻辑、placeholder隐藏
time.sleep(0.1)
# 全选输入框原有内容清空，再输入目标文本
input_ele.send_keys(Keys.CONTROL, 'a')
input_ele.send_keys(Keys.BACKSPACE)
input_ele.send_keys("TEST")
# 输入完成后点击输入框外区域触发失焦，确认值被前端框架同步
ActionChains(driver).move_by_offset(10, 10).click().perform()

备选方案：JS赋值后手动触发框架依赖事件 #

如果send_keys因为环境限制无法使用，不要只改value属性，赋值后手动派发所有前端监听的事件，同步框架状态：

js_script = """
const el = document.getElementById(arguments[0]);
// 触发焦点事件
el.focus();
// 赋值
el.value = arguments[1];
// 派发所有交互事件，和真实输入触发的事件保持一致
el.dispatchEvent(new Event('input', {bubbles: true}));
el.dispatchEvent(new Event('change', {bubbles: true}));
el.dispatchEvent(new Event('blur', {bubbles: true}));
"""
# 传入元素id和要输入的值执行
driver.execute_script(js_script, "manage_description", "TEST")

如果是React框架的受控组件，普通事件触发可能不生效，替换JS中的赋值逻辑为React专用的原生值设置方法即可：

// React 框架专用赋值逻辑
const nativeInputValueSetter = Object.getOwnPropertyDescriptor(window.HTMLTextAreaElement.prototype, 'value').set;
nativeInputValueSetter.call(el, arguments[1]);
el.dispatchEvent(new Event('input', { bubbles: true }));

3. 常见避坑点 #

• 输入完成后不要立刻执行下一步操作，预留100-200ms等待前端状态同步，避免值还没写入框架状态就触发后续逻辑被重置。
• 如果目标是富文本编辑器，不是原生input/textarea标签，要定位到带contenteditable="true"属性的编辑容器，再执行输入操作。
• 如果页面有自动化检测逻辑拦截webdriver操作，先做webdriver特征隐藏再执行用例。

内容的提问来源于stack exchange，提问作者Дарья Ковнир