Rails3 Google地圖測試與硒

Question

我想要測試一個谷歌地圖應用與Rails3。我正在使用水豚和硒的黃瓜進行JavaScript測試。 我有一張地圖，等待谷歌地圖加載，然後發送一個Ajax請求到我的服務器，在那裏我得到我插入地圖的位置。 我想知道是否有可能與硒等待谷歌地圖加載，ajax調用我的服務器已完成，標記放置在地圖內。另一個問題是，如何在谷歌地圖中選擇此標記。有沒有選擇器？

或者我應該走另一條路，並使用像Jasmine這樣的JS測試框架來測試我的類是否已加載等等。我對茉莉花沒有任何經驗，那麼是否可以測試谷歌地圖？

也許有人知道一個解決方案，或者如果它是不可能的，暗示或解決方法或...;）

[更新1]

我已經發現瞭如何在Google地圖中選擇標記。如果你看看 googles selenium tests你可以看看他們在做什麼。例如選擇一個標記：

waitForElementPresent xpath=//img[contains(@src,'marker')] 

但是，接下來的問題就來了。我如何選擇特定的標記？是否有一種方法在JavaScript谷歌地圖API中爲其分配ID，以便我可以使用 #marker_1, #marker_2 ...？

另一個奇怪的是，像wait_for_element或wait_for_condition這樣的函數在我的黃瓜步驟定義中不可用。谷歌硒測試使用自己的功能，如waitForElementPresent？或者這個標準的硒功能？我找到了很多帖子，他們總是使用類似

selenium.wait_for_condition 
selenium.wait_for_element 

or 

@selenium.wait_for_condition 
... 

在我的步驟定義selenium和@selenium VAR一比零的。我怎樣才能訪問這個方法？我也發現這個post，但它是從08年10月，所以我認爲必須有一個更好的解決方案（順便說一句，這種解決方案一見鍾情）。

像這樣page，他們給出了一些硒方法如何等待條件或元素的概述。這是否仍然存在？我怎樣才能使用這個功能？

[UPDATE 2]

靠，我已經發現，我上面提到的硒測試對谷歌地圖的V2，而不是爲V3。我試過

wait_until { page.has_xpath?("//img[contains(@src,'marker')]") } 

但它不起作用。標記在地圖上是可見的，但是我得到一個超時錯誤，因爲使用這個XPath選擇器沒有找到它。我想知道是否一般可以從DOM中選擇一個標記。

我也試圖附加屬性分配給標記，當我創建它：

// marker is the marker returned by google maps after adding it to the map 
$(marker).attr('id', "marker_1"); 

但是，當我嘗試用jQuery選擇$("#marker_1")訪問它，它沒有找到它。所以，仍然沒有解決方案。

Answer 1

我做我的是在你的步驟定義，像這樣執行的呼叫：

page.execute_script（「launchmap（）」）

然後在頁面上檢查他們的存在..然後在水豚中做正常的阿賈克斯檢查。標記將被包含在一個div中嗎？那麼，如果你打電話launchmap並創建標記，水豚應該能夠找到您的標記

UPDATE

發現了這個插件：http://vigetlabs.github.com/jmapping/examples/

它可以讓你的語義標記爲您的谷歌地圖（對於優雅的退化），讓您實際檢查是否存在使用水豚的標記。希望它有幫助（沒有時間測試它，但它看起來很有前途）

Answer 2

第一個問題 - 使用waitForCondition和腳本來測試標記的存在。

waitForCondition (script,timeout) Runs the specified JavaScript snippet repeatedly until it evaluates to "true". The snippet may have multiple lines, but only the result of the last line will be considered. Note that, by default, the snippet will be run in the runner's test window, not in the window of your application. To get the window of your application, you can use the JavaScript snippet selenium.browserbot.getCurrentWindow(), and then run your JavaScript in there 

Arguments: 

script - the JavaScript snippet to run timeout - a timeout in milliseconds, after which this command will return with an error 

Answer 3

我找到了一種方法來集成測試我的Google地圖與RSpec和Capybara。我想編寫一個測試來聲明我從內部JSON提要獲取的內容在我的地圖（Google Maps API V3）中以標記和信息窗口的形式在Rails 4應用程序中結束。

問題： 即使當我使用支持JS的Selenium Webdriver運行測試時，我也沒有找到一種方法來選擇帶有水豚的標記來檢查它們的內容。

我的解決辦法：1。 我添加了ID測試盒一個div到我的HTML標記 2.我寫了三篇helper方法到我的JS那隻好我的地圖標記訪問，並添加結果到測試盒。 3.在水豚我執行輔助方法，並期望找到預期的內容或框中的值。

代碼：

HTML：

<div id="map-canvas"></div> 
<div id="info-box"></div> 

JS-助手：在app /資產/ Java腳本/ events.js

// Test helper methods 
testInfo = function(){ 
    document.getElementById("info-box").innerHTML = markers[0].title; 
}; 

testInfoCount = function(){ 
    document.getElementById("info-box").innerHTML = markers.length; 
}; 

testInfoWindow = function(){ 
    document.getElementById("info-box").innerHTML = markers[0].title + ", " + markers[0].time; 
}; 

「標誌」 中我的代碼是一個數組，在我將它添加到地圖後，我會在每個標記中推送一個數組。我可以確定，如果內容位於標記數組中，則內容實際上位於地圖上。

測試：

spec/features/map_feature_spec.rb: 

require "rails_helper" 

describe "Map", js: true do 
    let!(:john){create(:user)} 
    let!(:event1){create(:event, user: john)} 
    let!(:event2){create(:event)} 

    it "shows a marker for a geocoded event on front page" do 
    visit '/' 
    find('#main-map-canvas') 
    page.execute_script('testInfo()') 
    expect(page.find("div#info-box").text).to eq(event1.title) 
    end 

    it "shows a marker for each geocoded event on front page" do 
    visit '/' 
    find('#main-map-canvas') 
    page.execute_script('testInfoCount()') 
    expect(page.find("div#info-box").text).to eq("2") 
    end 


    it "shows a marker for an event on event's page" do 
    visit "/events/#{event1.id}" 
    expect(page).to have_css("#single-map-canvas") 
    page.execute_script('testInfo()') 
    expect(page.find("div#info-box").text).to eq(event1.title) 
    end 

    context "Tooltips" do 
    let!(:event1){create(:event)} 
    let!(:event2){create(:event)} 

    it "shows title and date on frontpage" do 
     visit "/" 
     find('#main-map-canvas') 
     page.execute_script('testInfoWindow()') 
     expect(page.find("div#info-box")).to have_content("Pauls Birthday Party, #{event1.nice_date}") 
    end 

    end 
end 

• 要運行JavaScript的硒的webdriver和Firefox需要安裝（ '在你的Gemfile' 寶石 「硒webdriver的」 ''）

• 我正在使用Factory Girl創建測試內容（讓！）。

• 運行測試，您將在地圖上看到標記，並在測試框中顯示其內容。

Answer 4

一定要啓用URL水豚是用來運行測試服務器到您的應用程序的谷歌控制檯。

您可以通過在Capybara驅動程序配置加載塊中設置config.debug= true來檢查此URL（以及加載谷歌地圖時的錯誤消息）。