2017-02-08 202 views
0

我正在使用IDE自動化Web應用程序。我被卡在日期輸入。在通過自動化腳本輸入日期(輸入日期而不是從日曆中選取日期)後,日曆彈出窗口出現,並且在進入另一個應用程序區域後不會關閉。我在一個屏幕上有大約6個日期條目,並且在腳本運行時所有日曆都顯示爲打開,這看起來很奇怪。現在,當腳本停止,並且當我點擊屏幕上的任何地方時,輸入的日期將被清除,文本框顯示爲空白。這阻止了腳本進一步屏蔽爲日期拋出驗證消息。但是,當我手動輸入日期並繼續到其他區域時,日曆彈出窗口會關閉,日期將保存在文本框中。使用Selenium IDE輸入日期

注意:選擇日期而不是鍵入不起作用,因爲它需要許多點擊才能滾動以獲取月份和年份,特別是如果要選擇過去的日期。

如何在每次輸入日期後關閉保存的日期和日曆彈出窗口。

謝謝。

回答

0

這個問題的答案很大程度上取決於您使用的日曆插件。

要重新創建您的問題,我已經在Semantic UI前端框架中使用了this date-picker(語義UI很整潔,請檢查它:))。無論如何,爲了更清楚地瞭解發生的事情,我還建議在你的mozilla瀏覽器上安裝Firebug和Firepath插件。

假設你已經完成了這個安裝,現在你的生活應該很簡單。就我而言,彈出窗口只是一個帶鏈接的日期表。所以我做了以下幾點:

  1. 首先我點擊輸入框打開彈出窗口。我在我的Firepath插件中找到輸入框。請參閱下面的屏幕截圖:The input box selected in Firepath with popup highlighted 注意:突出顯示的區域是我的彈出窗口,當前處於隱藏狀態,我仍然沒有點擊輸入框!
  2. 接下來,我搜索Firepath以找到我想要取的日期。假設我希望挑2月1日我的日期,如紅圈所示: Date I want to pick using selenium 所以我需要找到在日期表中對應於這個日期這基本上是一個表元素的元素,如下圖所示: Firepath of the date i wish to pick using selenium
  3. 接下來,我需要表中此日期元素的x路徑,以便我可以使用Selenium IDE執行單擊操作。爲了得到x-path,我所做的就是右鍵點擊元素,如下圖所示: click on td of the corresponding date
  4. 現在有了所有這些信息,我做了以下工作:首先我使用點擊命令點擊輸入框,然後使用clickAt函數來單擊對應於首選日期的表格元素。彈出窗口出現在輸入框上的單擊命令上,彈出窗口在所需日期的clickAt命令後消失。代碼如下: The final Selenium IDE window

注:這是按日期選取器我選擇了複製你的問題,如果你願意,我可以做你的使用也是如此,但你必須分享完成你的網頁的html,以幫助你!

我儘量簡單地把它放下來,但是如果你仍然無法理解任何東西,並且需要幫助,請在評論中的特定點上共享頁面或查詢的源代碼。

的jsbin代碼如下:

$('#example1').calendar(); 
 
$('#example2').calendar({ 
 
    type: 'date' 
 
}); 
 
$('#example3').calendar({ 
 
    type: 'time' 
 
}); 
 
$('#rangestart').calendar({ 
 
    type: 'date', 
 
    endCalendar: $('#rangeend') 
 
}); 
 
$('#rangeend').calendar({ 
 
    type: 'date', 
 
    startCalendar: $('#rangestart') 
 
}); 
 
$('#example4').calendar({ 
 
    startMode: 'year' 
 
}); 
 
$('#example5').calendar(); 
 
$('#example6').calendar({ 
 
    ampm: false, 
 
    type: 'time' 
 
}); 
 
$('#example7').calendar({ 
 
    type: 'month' 
 
}); 
 
$('#example8').calendar({ 
 
    type: 'year' 
 
}); 
 
$('#example9').calendar(); 
 
$('#example10').calendar({ 
 
    on: 'hover' 
 
}); 
 
var today = new Date(); 
 
$('#example11').calendar({ 
 
    minDate: new Date(today.getFullYear(), today.getMonth(), today.getDate() - 5), 
 
    maxDate: new Date(today.getFullYear(), today.getMonth(), today.getDate() + 5) 
 
}); 
 
$('#example12').calendar({ 
 
    monthFirst: false 
 
}); 
 
$('#example13').calendar({ 
 
    monthFirst: false, 
 
    formatter: { 
 
    date: function (date, settings) { 
 
     if (!date) return ''; 
 
     var day = date.getDate(); 
 
     var month = date.getMonth() + 1; 
 
     var year = date.getFullYear(); 
 
     return day + '/' + month + '/' + year; 
 
    } 
 
    } 
 
}); 
 
$('#example14').calendar({ 
 
    inline: true 
 
}); 
 
$('#example15').calendar();
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css" rel="stylesheet" type="text/css" /> 
 
<link href="https://cdn.rawgit.com/mdehoog/Semantic-UI/6e6d051d47b598ebab05857545f242caf2b4b48c/dist/semantic.min.css" rel="stylesheet" type="text/css" /> 
 
<script src="https://code.jquery.com/jquery-2.1.4.js"></script> 
 
<script src="https://cdn.rawgit.com/mdehoog/Semantic-UI/6e6d051d47b598ebab05857545f242caf2b4b48c/dist/semantic.min.js"></script> 
 
    <meta charset="utf-8"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
    
 
    <div class="ui container"> 
 
    <h1>Calendar examples</h1> 
 
    
 
    <h3>Input</h3> 
 
    <div class="ui calendar" id="example1"> 
 
    <div class="ui input left icon"> 
 
     <i class="calendar icon"></i> 
 
     <input type="text" placeholder="Date/Time"> 
 
    </div> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>Date only</h3> 
 
    <div class="ui calendar" id="example2"> 
 
    <div class="ui input left icon"> 
 
     <i class="calendar icon"></i> 
 
     <input type="text" placeholder="Date"> 
 
    </div> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>Time only</h3> 
 
    <div class="ui calendar" id="example3"> 
 
    <div class="ui input left icon"> 
 
     <i class="time icon"></i> 
 
     <input type="text" placeholder="Time"> 
 
    </div> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>Range</h3> 
 
    <div class="ui form"> 
 
    <div class="two fields"> 
 
     <div class="field"> 
 
     <label>Start date</label> 
 
     <div class="ui calendar" id="rangestart"> 
 
      <div class="ui input left icon"> 
 
      <i class="calendar icon"></i> 
 
      <input type="text" placeholder="Start"> 
 
      </div> 
 
     </div> 
 
     </div> 
 
     <div class="field"> 
 
     <label>End date</label> 
 
     <div class="ui calendar" id="rangeend"> 
 
      <div class="ui input left icon"> 
 
      <i class="calendar icon"></i> 
 
      <input type="text" placeholder="End"> 
 
      </div> 
 
     </div> 
 
     </div> 
 
    </div> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>Year first</h3> 
 
    <div class="ui calendar" id="example4"> 
 
    <div class="ui input left icon"> 
 
     <i class="calendar icon"></i> 
 
     <input type="text" placeholder="Date/Time"> 
 
    </div> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>Initial value</h3> 
 
    <div class="ui calendar" id="example5"> 
 
    <div class="ui input left icon"> 
 
     <i class="calendar icon"></i> 
 
     <input type="text" placeholder="Date" value="5/30/2015 3pm"> 
 
    </div> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>24-hour</h3> 
 
    <div class="ui calendar" id="example6"> 
 
    <div class="ui input left icon"> 
 
     <i class="time icon"></i> 
 
     <input type="text" placeholder="Time"> 
 
    </div> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>Month and year</h3> 
 
    <div class="ui calendar" id="example7"> 
 
    <div class="ui input left icon"> 
 
     <i class="time icon"></i> 
 
     <input type="text" placeholder="Time"> 
 
    </div> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>Year only</h3> 
 
    <div class="ui calendar" id="example8"> 
 
    <div class="ui input left icon"> 
 
     <i class="time icon"></i> 
 
     <input type="text" placeholder="Time"> 
 
    </div> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>Button</h3> 
 
    <div class="ui calendar" id="example9"> 
 
    <div class="ui button">Select date</div> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>Hover</h3> 
 
    <div class="ui calendar" id="example10"> 
 
    <div class="ui button">Hover me</div> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>Min/Max date</h3> 
 
    <div class="ui calendar" id="example11"> 
 
    <div class="ui input"> 
 
     <input type="text" placeholder="Date"> 
 
    </div> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>Day first</h3> 
 
    <div class="ui calendar" id="example12"> 
 
    <div class="ui input"> 
 
     <input type="text" placeholder="Date"> 
 
    </div> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>Custom format</h3> 
 
    <div class="ui calendar" id="example13"> 
 
    <div class="ui input"> 
 
     <input type="text" placeholder="Date"> 
 
    </div> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>Inline</h3> 
 
    <div class="ui calendar" id="example14"> 
 
    </div> 
 
    <br/> 
 
    
 
    <h3>Implicit inline (no popup activator)</h3> 
 
    <div class="ui calendar" id="example15"> 
 
    </div> 
 
    <br/> 
 
    
 
    </div> 
 
</body> 
 
</html>

+1

由於阿比納夫。我可以從日曆中進行選擇,並且無需使用「點擊」打開彈出式窗口。但是,如果我必須選擇一些前幾個月或幾年(比如說六月或者可能是前一年),那麼我需要對這些文件的Xpaths進行修改,或者必須多次使用滾動的Xpath並將其包含在我的腳本中。 (如果比現在早幾個月,我想我不能保持腳本的簡短)。因此,我選擇'輸入'日期,以便即使必須通過更改日期來修改腳本,我也可以更新'值'。在這種情況下,我無法關閉彈出式窗口。 – Ses

+0

嗨Ses,請諒解遲到的迴應,但如果我理解正確,您必須輸入一個需要大量點擊日曆彈出窗口的日期,並且您想通過直接鍵入日期來繞過此問題。 好吧,完全誤解了您的在第一時間查詢! 無論如何要輸入日期,您可以使用2 命令:首先輸入日期,然後按下輸入鍵($ {KEY_ENTER})。這對我有用,試試吧!只需檢查日期格式是否準確,或者您可能會收到數據驗證錯誤。 –

+0

非常感謝Abhinav :)。 命令工作,我現在能夠繼續沒有日期問題。 – Ses