2011-03-03 2 views
1

에서 리튬을 선택합니다 :어떻게 입력 할 때, 우리는이 구조 복용 목록 생성 자동 완성이 텍스트 상자에 자동 완성

<div class="results"> 
    <ul> 
    <li class="even"> 
    <li class="odd"> 
    <li class="even"> 
    etc... 

나는 오이 (플러스 카피 바라와 Webdriver)와 테스트를 쓰고 있어요 및 먼저 li을 선택해야합니다.

page.execute_script 다음 코드 단편은 null을 계속 반환하기 때문에 올바른 jQuery가 전달되지 않습니다.

page.execute_script %Q{ $('li').eq(1).trigger("mouseenter").click(); } 

,이 오류 받고 있어요 즉 : 나는 단지 jQuery를 주운

TypeError: $("li") is null (Selenium::WebDriver::Error::UnexpectedJavascriptError) 

을, 그래서 누군가는 그것을 해결하는 방법을 가능성이 잘못된 이유, 뭐가 잘못 말해 것이다 ?

li 요소가 페이지에 있으며 원본을 확인하여 확실하게 찾을 수 없으므로 혼란 스럽습니다.

답변

5

아마도 page.execute_script 메소드를 사용하여 자동 완성 목록 항목을 클릭하지 않았을 것입니다. 이상적으로 When 오이 단계는 항상 사용자가 수행 할 수있는 것을 100 % 모방해야합니다. 그리고 나는 그들이 자바 스크립트 콘솔을 열어 목록 항목을 선택하기 위해 실행할 스크립트를 입력하기를 기대하지 않을 것입니다.)

당연히 나는 그것이 당신이하려고하는 것이 아니라는 것을 알고 있습니다. 방법.

더 좋은 방법은 당신의 오이 단계 정의 중 하나 : 내가 그 일을해야한다고 생각

When /^I follow the autocomplete link containing "([^"]*)"$/ do |link_text| 
    page.find(:css, ".results ul li", :text => link_text).click 
end 

에 다음과 같은 것, 그것은 당신의 오이 단계에서 JS 코드에 해킹하는 것보다 낫다 .

page.find 메서드는 Capybara :: Node :: Element를 반환합니다 (필자는 믿는다). : text 해시 옵션은 지정된 텍스트가 포함 된 요소 만 찾도록합니다. 요소가 발견되지 않으면 capybara는 예외를 발생시킵니다.

리에 실제로 클릭 할 수있는 텍스트가없는 경우 선택자를 ".results ul li:first"으로 변경할 수 있지만 이상적으로 첫 번째 항목을 선택하는 것 이상으로 정의를 사용할 수 있습니다.

발생할 수있는 버그가 있습니다 ('노드'방법이 없거나 일부 shinanigans에 대한 것). 이 작업을 수행 할 때 설명 할 수없는 이상한 오류가 발생하여 즉시 무엇인지 모르면 오이의 지원 디렉토리 인 env.rb에서 다음 줄을 주석 처리해야 할 수 있습니다.

require 'cucumber/rails/capybara_javascript_emulation' 

capybara가 업그레이드되었을 때 거기에 넣은 monkeypatch 오이가 부서졌고 마지막으로 확인한 것이 아직 안정적인 릴리스로 배포되지 않았습니다.

난 그냥 다시 질문을 보았고, 나는 $ ("리")이 반환 될 이유를 알 수 있도록 할 수 있습니다 느낌 :

는 희망이 추가하려면 문제 :

편집을 해결합니다 없는. 이 스크립트 실행 전에 "And I see should ..."단계를 추가하면 capybara에는 페이지에서 요소를 찾을 때 기본 요소 인 wait-for-element-default가 사용됩니다. 아직 거기 있지. 지정된 시간에 나타나지 않으면 (기본값은 5 초라고 생각하십니까?) 다음 capybara가 실패한 테스트를 제공합니다.

그러나 execute_script 호출을 실행하면 Capybara의 멋진 프레임 워크를 모두 우회하고 jquery를 사용하여 DOM과 직접 상호 작용하려고 시도합니다. Capybara가 아직 개체가 나타나기를 '기다리지'않았다는 것을 제외하면 자바 스크립트 아마 그것을 찾을 수 없습니다.

나는 page.find를 사용하여 게시 한 솔루션이 오류를 발생시키기 전에 해당 요소가 페이지에 표시 될 때까지 기다리지 않는다고 생각합니다. 파인더에 대한 자세한 내용은 https://github.com/jnicklas/capybara에서 "찾기"아래에 추가 정보가 표시된 하위 제목 아래에 설명되어 있습니다.

+0

완료! 너무 감사합니다. 당신의 대답은 제가 필요한 것입니다. 나는 그것이 어떻게 작동하는지에 대한 세부 사항을 고맙게 생각한다. 그것은 내가 쓰고있는 테스트로해야 할 일에 대해 많은 통찰력을주었습니다. 자동 완성 목록을 표시하려면 "page.find ("# id-of-input-text-field ")를 추가해야했습니다. 그것은 작동합니다. 다시 한번 고마워요! –

+0

나는 항상 Github의 README와 Wiki를 탐색하는 데 어려움을 겪었습니다 - 많은 정보가 있습니다! ... 나는 또 다른 질문이있다. (그것은 아직 발표되지 않은 오이 수정과 관련이있을 것이다.) 언제 당신이 언제 "페이지"를 추가 할 것인가? README에는 "찾기"가 있지만 "page.find"를 제안했습니다. 이전에 "choose"대신 "page.choose"를 사용해야 할 때 비슷한 문제가 발생했습니다. –

+0

그건 좋은 질문 피터, 그리고 솔직히 말해서 나는 100 % 정확도로 답을 모른다. 어림짐작으로서 나는 name, id, 또는 label을 매개 변수로 받아들이는 메소드 (편의 메소드 fill_in, choose, select 등)에'page'를 사용하지 않고, 그것을 사용하려고 할 때'page'를 앞에 붙입니다. 파인더.그러나 나는 왜 내가 연결된 소스가'page'에있는 메소드를 호출하지 않는지 모르겠습니다. 어쩌면 페이지를 건너 뛸 때 페이지가 암시되어 있을까요? page.find없이 find (: css, ...)를 사용해 보셨습니까? 그게 효과가 있을지 모르겠다. 어쩌면 그럴지도 모른다 : 다시, 확실하지 않다. – nzifnab

0

자동 완성 기능이 생성되어 (이후) 페이지가 렌더링되고 실행 스크립트가이를 가져 오지 않을 수 있기 때문에 가능합니다.

live jQuery 명령을 사용하여 document.ready 뒤에 렌더링 된 항목에 트리거를 연결해보십시오.

+0

아, 매우 흥미 롭습니다. 그래서 나는 입력 필드에'live '를 붙이겠습니까? –

+0

그래서 내가 한 것은 스크립트 호출 이전에 "그리고 나는보아야한다"라는 것이었다. 그 단계가 지나치므로'li'이 존재하지만 여전히'null' 오류가 발생합니다. : \ –

0

다음 코드는 저에게 적합합니다. 나는 모든 여분의 코드를 제거했다. 기억해야 할 핵심 포인트는 함수가 호출 될 때 목록 항목이 존재한다는 것입니다. 즉, 페이지가 '준비'되면 액세스하고 있습니다.

경우에는 $ ('li')를 실행해야합니다. 자동 제안이 채워져 있지 않으면 null이됩니다. 또한 eq()는 0을 기반으로하므로 첫 번째 요소는 eq (1)이 아닌 eq (0)입니다.

<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script> 
    <script> 
     $(document).ready(function() { 
      console.log($('li').eq(0)); // outputs the first list element Item 1 
     }); 
    </script> 
</head> 
<body> 

    <div class="results"> 
     <ul> 
      <li class="even">Item 1</li> 
      <li class="odd">Item 2</li> 
      <li class="even">Item 3</li> 
      <li class="odd">Item 4</li> 
     </ul> 
    </div> 

</body> 
+0

안녕하세요, 크리스. 그래서 제가 작성한대로 작동한다면 작동 할 것입니다. 불행히도, 오이에서 실행하려고 해요 및이 오류 : TypeError : $ (document) .ready 않습니다 (Selenium :: WebDriver :: Error :: UnexpectedJavascriptError)' –

+0

jquery 라이브러리가 포함되어 있습니까? ? $ (document) .ready는 jquery 라이브러리가로드 된 경우에만 사용할 수있는 함수입니다. – Chris

+0

jQuery 라이브러리가 실제로로드되었습니다. 유일한 것은 jQuery를 이해하지 못할 수있는 Webdriver를 사용하여 이것을 실행하고 있다는 것입니다. 내가 실행하는 시나리오가 실패합니다. 특별히 jQuery를 오이에 포함시키는 방법이 있습니까? 아마 태그처럼? –

관련 문제