我想填写并提交一份简单的表单,以便测试它是否按预期运行。
这是应该工作的代码,但实际上并没有。 我已经尝试过多次提交表单,但都没有触发页面重新加载。
casper.test.begin('Showcase signup works', 2, function suite(test){
casper.start('https://my.vidzor.com/accounts/signup/', function(){
test.assertExists('form', 'Signup form found');
this.fillSelectors('form', {
'input[name="name"]': 'Test User',
'input[name="email"]': 'test@example.com',
'input[name="password"]': 'example',
'input[name="password_confirm"]': 'example'
}, true);
this.click('button[type="submit"]');
this.evaluate(function submitForm(){
$('form').submit();
});
this.wait(10000);
this.captureSelector('signup-form.png','input#id_name');
var form_values = this.getFormValues('form');
console.log(JSON.stringify(form_values));
test.assertEqual(form_values.stage, "2");
});
casper.run(function() {
test.done();
});
});
我发现有许多奇怪的事情发生了。
form_values
不包含姓名和电子邮件字段,即使已填写captureSelector
截取整页的屏幕截图;实际上,当我打电话给'#form;'只是,然后它捕获了页面的不同部分我在这里想念什么?
答案 0 :(得分:2)
您必须牢记CasperJS的异步特性。所有wait*
和then*
函数都是异步步骤函数,用于调度某些行为。如果在调用captureSelector
之后调用wait
之类的同步函数,则中间没有等待。必须在then
wait
回调中安排它们
this.wait(10000, function then(){
this.captureSelector('signup-form.png','input#id_name');
var form_values = this.getFormValues('form');
console.log(JSON.stringify(form_values));
test.assertEqual(form_values.stage, "2");
});
如果表单提交处理程序不是异步的,那么以下内容应该在没有显式等待的情况下工作:
casper.start('https://my.vidzor.com/accounts/signup/', function(){
this.fillSelectors('form', {
'input[name="name"]': 'Test User',
'input[name="email"]': 'test@example.com',
'input[name="password"]': 'example',
'input[name="password_confirm"]': 'example'
}, true);
});
casper.then(function(){
this.captureSelector('signup-form.png','input#id_name');
var form_values = this.getFormValues('form');
console.log(JSON.stringify(form_values));
test.assertEqual(form_values.stage, "2");
});