- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我在通过 Selenium Webdriver 的 PhantomJS API 提交表单时遇到了一个奇怪的问题。单击提交按钮后,表单将得到验证(用户名和密码是否太短或为空等),但最终不会提交。也就是说,如果我提交无效的表单,并检查屏幕截图,就会有警报通知。如果我提交有效的表格,则不会发生任何事情。页面上的 JS 应该验证表单,然后在单击提交按钮时提交它。
一些排除情况。我在提交按钮(一个按钮元素)上尝试了 .click()
和 .submit()
。我还在表单本身以及表单中的任意元素(如密码)上尝试过 .submit()
,这是 Selenium 允许的。
事实上,如果我使用 Firefox 而不是 PhantomJS,相同的代码可以正常工作。不过,我不想切换,因为 Firefox 速度较慢,并且会给我带来不可预测的连接问题。
我的规范:我在 Ubuntu 14.04 LTS (GNU/Linux 3.17.1-elastic x86_64) 上通过 Python 2.7 使用 Selenium 版本 1.43 和 PhantomJS 1.98。
代码如下。首先是我的 Selenium 代码。然后是表单的 html。然后是该网站的login.js 源代码。我认为js中发生的情况是,由于某种原因,.validate
函数中的invalidHandler
正在运行,但submitHandler
没有运行?预先感谢您的关注。
# enter username and password up here first
submitEl = self.find_element_by_css_selector("button[type='submit']")
submitEl.click()
self.save_screenshot('login_submission.png')
Edit2:“self”是一个继承自Webdriver.PhantomJS
类的驱动程序对象。现在是 html 表单:
<form class="form-login" action="" name="login" method="POST">
<div class="errorHandler alert alert-danger no-display">
<i class="fa fa-remove-sign"></i> You have some form errors. Please check below.
</div>
<fieldset>
<div class="form-group">
<span class="input-icon">
<input type="text" class="form-control" name="username" placeholder="Username">
<i class="fa fa-user"></i> </span>
</div>
<div class="form-group form-actions">
<span class="input-icon">
<input type="password" class="form-control password" name="password" placeholder="Password">
<i class="fa fa-lock"></i>
<a class="forgot" href="forgot.php">
I forgot my password
</a> </span>
</div>
<div class="form-group">
<img src="captcha/captcha.php" alt="captcha" />
<span class="input-icon" style="width:200px; float: right;">
<input type="text" class="form-control" name="captcha">
<i class="fa fa-key"></i> </span>
</div>
<div class="form-actions" ><div class="slideExpandUp">
<label for="remember" class="checkbox-inline">
<input type="checkbox" class="grey remember" id="remember" name="remember">
Keep me signed in
</label>
<button type="submit" class="btn btn-bricky pull-right" name="submit">
Login <i class="fa fa-arrow-circle-right"></i>
</button></div>
</div>
<div class="new-account">
Don't have an account yet?
<a href="register.php" class="register">
Create an account
</a>
</div>
</fieldset>
</form>
登录.js
var Login = function () {
var runSetDefaultValidation = function () {
$.validator.setDefaults({
errorElement: "span", // contain the error msg in a small tag
errorClass: 'help-block',
errorPlacement: function (error, element) { // render error placement for each input type
if (element.attr("type") == "radio" || element.attr("type") == "checkbox") { // for chosen elements, need to insert the error after the chosen container
error.insertAfter($(element).closest('.form-group').children('div').children().last());
} else if (element.attr("name") == "card_expiry_mm" || element.attr("name") == "card_expiry_yyyy") {
error.appendTo($(element).closest('.form-group').children('div'));
} else {
error.insertAfter(element);
// for other inputs, just perform default behavior
}
},
ignore: ':hidden',
highlight: function (element) {
$(element).closest('.help-block').removeClass('valid');
// display OK icon
$(element).closest('.form-group').removeClass('has-success').addClass('has-error').find('.symbol').removeClass('ok').addClass('required');
// add the Bootstrap error class to the control group
},
unhighlight: function (element) { // revert the change done by hightlight
$(element).closest('.form-group').removeClass('has-error');
// set error class to the control group
},
success: function (label, element) {
label.addClass('help-block valid');
// mark the current input as valid and display OK icon
$(element).closest('.form-group').removeClass('has-error');
},
highlight: function (element) {
$(element).closest('.help-block').removeClass('valid');
// display OK icon
$(element).closest('.form-group').addClass('has-error');
// add the Bootstrap error class to the control group
},
unhighlight: function (element) { // revert the change done by hightlight
$(element).closest('.form-group').removeClass('has-error');
// set error class to the control group
}
});
};
var runLoginValidator = function () {
var form = $('.form-login');
var errorHandler = $('.errorHandler', form);
form.validate({
rules: {
username: {
minlength: 2,
required: true
},
password: {
minlength: 6,
required: true
}
},
submitHandler: function (form) {
errorHandler.hide();
form.submit();
},
invalidHandler: function (event, validator) { //display error alert on form submit
errorHandler.show();
}
});
};
return {
//main function to initiate template pages
init: function () {
runSetDefaultValidation();
runLoginValidator();
}
};
}();
编辑:修正标题
PhantomJS 日志文件输出,按请求:
PhantomJS is launching GhostDriver...
[INFO - 2015-01-27T16:58:04.367Z] GhostDriver - Main - running on port 48152
[INFO - 2015-01-27T16:58:05.366Z] Session [a9641420-a645-11e4-95fd-c78c9ec356b6] - page.settings - {"XSSAuditingEnabled":false,"javascriptCanCloseWindows":true,"javascriptCanOpenWindows":true,"javascriptEnabled":true,"loadImages":true,"localToRemoteUrlAccessEnabled":false,"userAgent":"Mozilla/5.0 (Windows NT 5.1; rv:31.0) Gecko/20100101 Firefox/31.0","webSecurityEnabled":true}
[INFO - 2015-01-27T16:58:05.366Z] Session [a9641420-a645-11e4-95fd-c78c9ec356b6] - page.customHeaders: - {}
[INFO - 2015-01-27T16:58:05.366Z] Session [a9641420-a645-11e4-95fd-c78c9ec356b6] - Session.negotiatedCapabilities - {"browserName":"phantomjs","version":"1.9.8","driverName":"ghostdriver","driverVersion":"1.1.0","platform":"linux-unknown-64bit","javascriptEnabled":true,"takesScreenshot":true,"handlesAlerts":false,"databaseEnabled":false,"locationContextEnabled":false,"applicationCacheEnabled":false,"browserConnectionEnabled":false,"cssSelectorsEnabled":true,"webStorageEnabled":false,"rotatable":false,"acceptSslCerts":false,"nativeEvents":true,"proxy":{"proxyType":"direct"},"phantomjs.page.settings.userAgent":"Mozilla/5.0 (Windows NT 5.1; rv:31.0) Gecko/20100101 Firefox/31.0"}
[INFO - 2015-01-27T16:58:05.366Z] SessionManagerReqHand - _postNewSessionCommand - New Session Created: a9641420-a645-11e4-95fd-c78c9ec356b6
[ERROR - 2015-01-27T16:59:08.083Z] WebElementLocator - _handleLocateCommand - Element(s) NOT Found: GAVE UP. Search Stop Time: 1422377948079
最后的ERROR
不是我的问题的一部分,但这里更像是一个书挡。当抓取算法查找应该在登录后显示的页面上的链接时,就会发生这种情况。由于我们没有成功提交登录表单,因此该链接自然不存在。
最佳答案
我不太确定我的哪些更改导致了突破,但我可以说我添加了以下代码。编辑:其中只有两个是新的。删除了一个。
webdriver.DesiredCapabilities.PHANTOMJS["phantomjs.page.settings.localToRemoteUrlAccessEnabled"] = True
webdriver.DesiredCapabilities.PHANTOMJS["phantomjs.page.settings.browserConnectionEnabled"] = True
我提交了表单本身,而不是单击按钮(在更改上述配置之前,我之前也尝试过此操作)。
formEl = self.find_element_by_css_selector("form[name='login']")
formEl.submit()
关于javascript - Selenium 与 PhantomJS : Form being validated but not submitted,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28095196/
我创建了一个函数来在两个元素的 style.display 之间切换为“none”或“block”。我在这里遇到的问题是“发送”按钮似乎与“切换”按钮具有相同的行为。这不是我指定它要做的事情。我想知道
当我使用 validate.js 添加表单验证时,其验证正常并显示验证消息。但输入 type="submit"值在操作页面结构中显示两次。 为了说明,我有两个 .cfm 文件,index.cfm 具有
我有一个 s:form,里面有 sj:submit 和 s:submit,sj:submit 工作正常,但 s:submit 按钮不起作用。当我点击 s:submit 按钮时没有任何反应。 我尝试在表
参见http://jsfiddle.net/8KNc7/5/有关我正在讨论的内容的工作示例(目前在 Firefox 15 中进行测试,尚未尝试其他版本)。 我有一个带有 submit 输入和 butt
我有一个包含表单的 HTML 页面。我想做一些字段 "required" 。问题是我没有使用 在我的表单中,我使用 Javascript 函数来提交表单,因为我需要将 Javascript 变量发送到
如果用户提交表单,我想运行特定的 PHP block 。如果我使用带有 name="submit"的提交按钮并且: 我对 javascript 一无所知,我希望代码在用户更改下拉菜单时运行。如果我将
我有一个网站 www.abc.com,其中有一个页面 xyz.php。 xyz.php 采用表单提交事件读取数据并保存在数据库中。 www.abc.com 有一个针对 xyz.php 执行操作的表单。
这个问题在这里已经有了答案: JavaScript post request like a form submit (32 个答案) 关闭 9 年前。 我查看了不同的线程,但找不到合适的解决方案。
我有一个表单提交触发器和一个确认引导框,它显示在单击表单提交按钮上。在 bootbox 中确认如果用户同意我提交表单。我的问题是 onsubmit 在用户说是之前触发,并且当我在 bootbox 中调
我正在使用 JavaScript .submit() 函数提交我的表单。 form.submit(); 但是当我使用 addEventListener 来捕获我的提交事件时,它不起作用。 form.a
编辑:在考虑回答问题之前,请仔细阅读问题的所有内容。我既不是在生产代码中使用内联事件处理程序的可取性,也不是在实现我所引用的文章所 promise 的结果的最佳方法。这是关于Javascript语义和
这是我的形式,对我来说看起来不错。在这种形式中,我放置了这个按钮: 这是它调用的函数: function confirmSubmit() { // get the number of st
以下哪个 CSS 选择器更快? input[type="submit"] { /* styles */ } 或 [type="submit"] { /* styles */ } 只是好
在表单上添加提交按钮的符合标准的正确语义方式是什么?我不需要按钮中的图像或背景,只需要简单的文本,也许是带弯 Angular 的渐变背景(使用 CSS3)。这些是我所知道的方法: click her
我的 App.js 包含以下代码: var app = angular.module('githubApp', []); 我有 githubAppController 和以下代码: app.contr
jQuery 允许通过以下任一方式以编程方式触发表单提交: $('.js-form-class-hook').submit(); $('.js-form-class-hook').trigger('s
我有一个表单,其中一个按钮使用 onClick 事件提交。 " 此外,我有一个输入,当输入处于焦点状态时按下回车键时会触发 couponButton。 虽然它们都触发相同的事件 (.submit()
目前只是尝试实现这些按钮:http://web.archive.org/web/20110721191046/http://particletree.com/features/rediscoverin
我正在提交我的第一个构建以供 TestFlight beta 审查,在创建一个组后,添加 4 名团队成员添加我的构建,取消单击该框以表示我需要登录信息来测试该应用程序,我单击“提交”审查。” iTun
我有一个带有 onsubmit 属性的表单。我需要绑定(bind)一个新的提交事件,并且我需要在任何现有提交函数之前执行此事件。 下面的代码演示了这个问题。 Test
我是一名优秀的程序员,十分优秀!