如何使用 selenium 查找输入类型和提交类型答案

【问题标题】：How to find a input type and submit type with selenium如何使用 selenium 查找输入类型和提交类型
【发布时间】：2021-12-23 11:21:03
【问题描述】：

有一个HTML页面，我想在selenium和python3的帮助下找到两种输入类型的元素并按一个按钮登录。问题是我似乎找不到正确的方法。

这两个文本和按钮是一个没有id或一些标签的表单，我也是这个的新手。

下面是带有两个文本字段（电子邮件和密码）的 HTML 代码，我需要使用 selenium WebDriver 以及提交按钮。

HTML 代码：

<form action="https://www.example.com/login" autocomplete="on" method="post" role="form">
<input type="hidden" name="_token" value="asdc">

<div class="form-group">
<input type="email" name="email"                                       class="form-control " placeholder="Email"
value="" autofocus>
</div>

<div class="form-group">
<input type="password" name="password" class="form-control " placeholder="Password">
</div>

<div class="form-group">
<button type="submit" class="btn btn-primary btn-block" style1="height: 41px; font-size: 18px">Sign In</button></div>
</form>

完整的 HTML（网址已更改）：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Login</title>

   
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">

    <link rel="shortcut icon" type="image/png" href="https://example.com/favicon.png?"/>

    <link href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i,900"
          rel="stylesheet">

    <!-- Icon fonts -->
    <link href="/fonts/fontawesome-pro/css/all.min.css" rel="stylesheet" type="text/css"/>

    <!-- theme -->
    <link id="theme-link" href="https://example.com/theme.css?&amp;ver=a_230wednesday_10_nov_2021_135539_utc" rel="stylesheet" type="text/css"/>

        <link href="https://example.com/login.css?&amp;ver=a_230wednesday_10_nov_2021_135539_utc" rel="stylesheet" type="text/css"/>


<script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag( 'js', new Date() );
    gtag( 'config', "UA-101862321-1" );
</script>
</head>

<body>
    <div class="limiter d-none">
        <div class="container-login100">
            <div class="wrap-login100 align-content-center align-items-center">
                <div class="login100-pic js-tilt" data-tilt>
                    <img src="https://example.com/login-illustration.png?"/>
                </div>
                <div class="login100-form">
                    <div class="text-center mb-3">
                        <img src="https://example.com/logo-login.png?"/>
                    </div>

                    <div class="card-body p-4">
                                                                        <form action="https://www.example.com/login" autocomplete="on" method="post" role="form">
                            <input type="hidden" name="_token" value="Somevalue">
                            <div class="form-group">
                                <input type="email" name="email"
                                       class="form-control " placeholder="Email"
                                       value="" autofocus>


                                                            </div>
                            <div class="form-group">
                                <input type="password" name="password" class="form-control " placeholder="Password">

                                                            </div>
                            <div class="form-group">
                                <label class="custom-control custom-checkbox">
                                    <input id="remember" name="remember" type="checkbox" class="custom-control-input" value="1">
                                    <span class="custom-control-label">Remember me</span>
                                </label>
                            </div>
                            <div class="form-group">
                                <button type="submit" class="btn btn-primary btn-block" style1="height: 41px; font-size: 18px">Sign In</button>
                            </div>
                        </form>
                        <div class="d-flex align-items-center form-group">
                            <hr class="flex-grow-1"/>
                            <div class="text-muted px-3">
                                OR CONNECT WITH
                            </div>
                            <hr class="flex-grow-1"/>
                        </div>
                                                    <a href="https://example.com/login/office" class="btn btn-default text-center btn-block">
                                <img src="https://example/office-365.png?&amp;ver=a_230wednesday_10_nov_2021_135539_utc" class="img-fluid"/>
                            </a>
                                                                        <div class="text-right mt-3">
                            <a href="https://www.example.com/password/reset">
                                Forgot Your Password?
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>





    <div class="login-cover-bg">
        <div class="login-box d-flex justify-content-between align-items-center">
            <div class="login100-pic">
                <img src="https://example.com/logo-login.png?"/>
            </div>
            <div class="login100-form">
                <div class="text-center mb-3">
                    <img src="https://example.com/logo-login.png?" class="img-fluid"/>
                </div>
                <div class="card-body p-4">
                                                            <form action="https://www.example.com/login" autocomplete="on" method="post" role="form">
                        <input type="hidden" name="_token" value="somevalue">
                        <div class="form-group">
                            <input type="email" name="email"
                                   class="form-control " placeholder="Email"
                                   value="" autofocus>


                                                    </div>
                        <div class="form-group">
                            <input type="password" name="password" class="form-control " placeholder="Password">

                                                    </div>
                        <div class="form-group">
                            <label class="custom-control custom-checkbox">
                                <input id="remember" name="remember" type="checkbox" class="custom-control-input" value="1">
                                <span class="custom-control-label">Remember me</span>
                            </label>
                        </div>
                        <div class="form-group">
                            <button type="submit" class="btn btn-primary btn-block" style1="height: 41px; font-size: 18px">Sign In</button>
                        </div>
                    </form>
                    <div class="d-flex align-items-center form-group">
                        <hr class="flex-grow-1"/>
                        <div class="text-muted px-3">
                            OR CONNECT WITH
                        </div>
                        <hr class="flex-grow-1"/>
                    </div>
                                            <a href="https://www.example.com/login/office" class="btn btn-default text-center btn-block">
                            <img src="office-365.png?&amp;ver=a_230wednesday_10_nov_2021_135539_utc" class="img-fluid"/>
                        </a>
                                                            <div class="text-right mt-3">
                        <a href="https://www.example.com">
                            Forgot Your Password?
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>

<!-- Core scripts From Bootstrap 4.4-->
<script src="https://code.jquery.com/jquery-3.4.1.min.js" ></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.1/umd/popper.min.js" ></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" "></script>

</body>
</html>

到目前为止我的代码：

from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
import time


PATH = "C:\Program Files (x86)\chromedriver.exe"

driver = webdriver.Chrome(PATH)
  

driver.get("http://example.com/")


try:
    element = WebDriverWait(driver, 10).until(
        EC.presence_of_element_located((By.LINK_TEXT, "Login to start working"))
    )
    element.click()

    element = WebDriverWait(driver, 10).until(
        EC.presence_of_element_located((By.XPATH, "//input[@placeholder='Password']"))
    )
    element.click()
    element.send_keys('random@random.com')
    element.send_keys(Keys.ENTER)

    element = WebDriverWait(driver, 10).until(
        EC.presence_of_element_located((By.ID, "Submit"))
    )
    element.click()

    
except Exception as exc:
    driver.quit()
    print(exc)

提前谢谢你！

【问题讨论】：

//form[contains(@action, '/login')] //input[@name = 'email'] - //form[contains(@action, '/login')] //input[@name = 'password'] - //form[contains(@action, '/login')] //button[@type= 'submit'] 怎么样？

标签： python python-3.x selenium xpath webdriverwait

【解决方案1】：

我刚刚将您的代码从 presence_of_element_located 预期条件更改为 presence_of_element_located，更正了定位器并使更多内容更清晰。我希望现在这应该可以了。

from selenium import webdriver
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
import time


PATH = "C:\Program Files (x86)\chromedriver.exe"

driver = webdriver.Chrome(PATH)
  

driver.get("http://example.com/")


email_input = WebDriverWait(driver, 10).until(EC.visibility_of_element_located((By.XPATH, "//input[@name='email']")))
email_input.click()
email_input.send_keys("your_email_value")

password_input = WebDriverWait(driver, 10).until(EC.visibility_of_element_located((By.XPATH, "//input[@name='password']")))
password_input.click()
password_input.send_keys("your_password_value")

WebDriverWait(driver, 10).until(EC.visibility_of_element_located((By.XPATH, "//button[@type='submit']"))).click()

【讨论】：

没有真正改变。我运行它，它进入登录页面，但 10 秒后它退出：“消息：”
消息是什么？你能分享那个页面的链接吗？
@Prophet OP 共享了相关的 HTML，并且可能 url/网页不是公共 url。因此 OP 可能无法共享 URL。通常，根据 SO 标准，纠缠页面链接/url 被视为讨好。
@DebanjanB 我知道 url/webpage 不能是私有的。但我看到我无法仅根据提供的信息帮助 OP，需要更多详细信息。
@Prophet 同意，OP 和我们都不能帮助构建这个问题的规范答案。希望现有的答案能以其他方式对未来的读者有所帮助。

【解决方案2】：

要点击链接Login to start working，然后输入凭据，最后点击提交按钮，您可以使用以下Locator Strategies： p>

driver.get("http://example.com/")
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.LINK_TEXT, "Login to start working"))).click()
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "div.form-group > input.form-control[name='email']"))).send_keys("random@random.com")
driver.find_element(By.CSS_SELECTOR, "div.form-group > input.form-control[name='password']").send_keys("random_password")
driver.find_element(By.XPATH, "//div[@class='form-group']/button[@class='btn btn-primary btn-block' and text()='Sign In']").click()

【讨论】：

与上述相同。我运行它，它进入登录页面，但 10 秒后它退出：“消息：”
查看更新的答案并让我知道状态。
还是一样...第 16 行，在 WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "div.form-group > input.form- control[name='email']"))).send_keys("random@random.com") 第 89 行，直到引发 TimeoutException(message, screen, stacktrace) selenium.common.exceptions.TimeoutException: Message:
有 iframe 吗？
没有没有

【解决方案3】：

我通过上述方法找到了解决方案并工作：

self.driver.find_element(By.XPATH, "//div[@class='login-box d-flex justify-content-between "
                                       "align-items-center']//input[@placeholder='Email']").send_keys(
        'randommail@mail.com')

密码字段也可以这样做。

它可能会在未来帮助somone :)

再次感谢您的宝贵时间！

【讨论】：