Текстовое поле автозаполнения

Question

У меня есть текстовое поле, и когда пользователь вводит некоторые символы, появляется блок и показываются некоторые предложения о результатах. Я хочу подсчитать количество предложений, но я не знаю, как это сделать.

Я могу ввести некоторые символы через API CasperJS, но невозможно получить содержимое блока автозаполнения, который появляется. ("# Щ-ID-6")

Моя тестовая страница: http://www.spareka.fr/pieces_detachees_accessoires_electromenager

Форма Я хочу, чтобы тест в блоке "Recherche détaillée" в верхнем левом углу. Итак, я должен выбрать значение для первого раскрывающегося поля («Quel type d'appareil»), затем я выбираю значение во втором раскрывающемся поле («Quelle marque?»). Итак, третий блок «Quelle référence d'appareil» становится активом, и это поле автозаполнения, которое я хочу проверить.

Мой пример кода: (обновлено 18 октября)

var casper = require("casper").create({}); 

casper.on("page.error", function(msg,trace){ //No message in the shell 
    this.echo("error message : " + msg, "ERROR"); 
}); 
casper.on("remote.message", function(msg,trace){ //No message in the shell 
    this.echo("remote message : " + msg); 
}); 
casper.on("ressource.error", function(ressource){ //No message in the shell 
    this.echo("ressource message errorCode : " + ressource.errorCode); 
    this.echo("ressource message errorString : " + ressource.errorString); 
    this.echo("ressource message errorUrl : " + ressource.url); 
    this.echo("ressource message errorID : " + ressource.id); 
}); 


casper.start("http://www.spareka.fr/pieces_detachees_accessoires_electromenager", function(){ 

// The first select "Quel type d'appareil" 
this.then(function(){ 
    this.fillSelectors("form#search_form_4", { 
     'select[id="finalProductType"]': 'Appareil à Fondue', 
     }, true); 
    }); 
    // No problem here 

    // The second select "Quelle marque?" 
    this.then(function(){ 
     this.fillSelectors("form#search_form_4", { 
     'select[id="manufacturer"]': 'TEFAL', 
     }, true); 
    }); 
    // No problem here 

    this.then(function(){ 
     this.sendKeys('#productReference', '*', {keepFocus: true}); //so, an element "ui-id-6" appear and in firebug, there are the suggestions of results 
     this.capture("test88_screen01.png"); 

     //try with wait... 
     /* 
     this.wait(2000, function then(){ //error : No element matching selector found : #ui-id-6 
      this.echo(this.getHTML("#ui-id-6").length); // wall of text 
     }); 
     */ 

     this.waitUntilVisible("#ui-id-6", function(){ // error : Wait timeout of 5000ms expired, existing 
      this.echo(this.getHTML("#ui-id-6").length); 
     }); 

     this.echo(this.getHTML("#ui-id-6").length); //selector found (no error), but return 0 
    }); 

    this.then(function(){ 
     this.capture("test88_screen02.png"); // very strange ! this screen shows the page after submitting the form, I don't understand, I didn't understand why the form is submited 
     this.echo("end"); 
    }); 

}); 

casper.run(); 

Моя версия Каспер: 1.1.0-бета3 и phantomjs: 1.9.7

Answer 1

Wait работает, если вы используете его then обратного вызова. Все then* и wait* функции шага кедра асинхронны. Это означает, что внутри шага вы не должны вызывать синхронные функции после других асинхронных функций.

this.then(function(){ 
    this.sendKeys('#productReference', '*', {keepFocus: true}); //so, an element "ui-id-6" appear and in firebug, there are the suggestions of results 
    this.capture("screen01.png"); 

    //try with wait... 
    this.wait(2000, function then(){ 
     this.echo(this.getHTML("#ui-id-6")); // wall of text 
    }); 

    // or 

    this.waitUntilVisible("#ui-id-6", function(){ 
     this.echo(this.getHTML("#ui-id-6")); 
    }); 
});