基于Python+Selenium开发预约脚本无法定位登录元素报NoSuchElementException咨询

开发背景 #

正在开发可一键运行的健身课程自动预约脚本，目前处于开发初期，技术栈采用Python搭配Selenium与Chromedriver，目标预约站点地址为http://www.360functionalfitness.se/boka-pass/，脚本整体流程为：加载目标页面→点击登录按钮→输入账号信息完成登录→导航至课程列表找到目标课程完成预约。

当前遇到的报错 #

执行如下初始开发代码时，抛出找不到元素的异常：

from selenium import webdriver
from selenium.webdriver.common.keys import Keys

d = webdriver.Chrome()

d.get("http://www.360functionalfitness.se/boka-pass/")
# 尝试定位登录按钮
elem = d.find_element_by_name("showLogin")

异常完整栈信息：

python3.9/site-packages/selenium/webdriver/remote/errorhandler.py", line 242, in check_response
    raise exception_class(message, screen, stacktrace)
selenium.common.exceptions.NoSuchElementException: Message: no such element: Unable to locate element: {"method":"css selector","selector":"[name="showLogin"]"}
  (Session info: chrome=87.0.4280.141)

查看页面DOM结构后，实际登录按钮对应的HTML代码为：

<li ng-if="!member" class="ng-scope">
    <a href="" ng-click="showLogin()" toggle-off-canvas="">
        <i class="fa fa-sign-in">
            <span class="icon-bg bg-darkgreen"></span>
        </i>
        <span class="ng-binding">Logga in</span>
    </a>
</li>

• 定位规则与DOM实际结构完全不匹配：代码中使用的showLogin是Angular框架给元素绑定的点击事件方法名，不是元素的name属性，Selenium按照name="showLogin"的规则遍历DOM时，自然找不到任何匹配的元素。
• 页面存在动态渲染时序问题：该站点基于AngularJS开发，页面元素不是随初始HTML静态加载完成的，直接发起定位请求时，目标元素可能还未渲染到DOM树中，也会触发找不到元素的异常。

所有方案都需要搭配显式等待逻辑，等待元素可点击后再执行操作，避免时序问题：

• 通过链接文本定位：登录按钮的可见文本是瑞典语“Logga in”（对应“登录”语义），可以直接匹配这个文本定位元素

  from selenium.webdriver.common.by import By
  from selenium.webdriver.support.ui import WebDriverWait
  from selenium.webdriver.support import expected_conditions as EC
  
  # 最长等待10秒，直到登录按钮可点击
  login_btn = WebDriverWait(d, 10).until(
      EC.element_to_be_clickable((By.LINK_TEXT, "Logga in"))
  )
  login_btn.click()
  

• 通过ng-click属性定位：直接匹配绑定了showLogin()方法的a标签元素

  login_btn = WebDriverWait(d, 10).until(
      EC.element_to_be_clickable((By.CSS_SELECTOR, "a[ng-click='showLogin()']"))
  )
  login_btn.click()
  

• 通过图标类名定位：匹配带登录图标的对应链接元素

  login_btn = WebDriverWait(d, 10).until(
      EC.element_to_be_clickable((By.CSS_SELECTOR, "a i.fa-sign-in"))
  )
  login_btn.click()
  

• 替换老旧的定位API：早期Selenium版本提供的find_element_by_name这类简写定位方法已经逐步弃用，现在统一使用By类传入定位规则的写法，版本兼容性更好。
• 对动态站点强制加等待逻辑：不要在页面加载完成后立刻执行定位操作，必须通过显式等待判断元素状态后再操作，避免因渲染时序反复触发找不到元素的异常。

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