如何讓午睡能夠點擊不可見的元素

我正在使用午睡來測試一個大的滾動頁面，除非你先滾動下來，否則一些元素不可見。 Siesta runner似乎認爲需要點擊的元素是可見的，所以當它試圖點擊這些元素時，它實際上已經錯過了目標。我該如何克服這一點？如何讓午睡能夠點擊不可見的元素

我已經修改了一個現有的測試用例，只是爲了添加一個可以壓下目標元素的大型面板。

任何幫助，將不勝感激。

StartTest(function (t) { 
    var fp = Ext.create('Ext.FormPanel', { 
     title: 'Check/Radio Groups Example', 
     frame: true, 
     fieldDefaults: { 
      labelWidth: 110 
     }, 
     width: 700, 
     height: 1700, 
     renderTo:Ext.getBody(), 
     bodyPadding: 10, 
     items: [ 
     { 
      xtype: 'panel', 
      title: 'a LARGE panel', 
      height: 1500 
     }, 
     { 
      xtype: 'fieldset', 
      title: 'Checkbox Groups (initially collapsed)', 
      layout: 'anchor', 
      defaults: { 
       anchor: '100%', 
       labelStyle: 'padding-left:4px;' 
      }, 
      items: [{ 
       xtype: 'checkboxgroup', 
       fieldLabel: 'Favorite browser', 
       // Put all controls in a single column with width 100% 
       columns: 1, 
       items: [ 
        {id : 'cb-chrome', boxLabel: 'Chrome', name: 'cb-col-1'}, 
        {id : 'cb-ff', boxLabel: 'Firefox', name: 'cb-col-2'}, 
        {id : 'cb-safari', boxLabel: 'Safari', name: 'cb-col-3'} 
       ] 
      },{ 
       xtype: 'checkboxgroup', 
       fieldLabel: 'Random questions', 
       allowBlank: false, 
       msgTarget: 'side', 
       autoFitErrors: false, 
       anchor: '-18', 
       layout: 'column', 
       defaultType: 'container', 
       items: [{ 
        columnWidth: .33, 
        items: [ 
         {xtype: 'component', html: 'IE 6 is:', cls:'x-form-check-group-label'}, 
         {xtype: 'checkboxfield', boxLabel: 'Awesome', name: 'cb-cust-1'}, 
         {xtype: 'checkboxfield', boxLabel: 'Not so awesome', name: 'ie6-not-awesome'} 
        ] 
       },{ 
       columnWidth: .33, 
        items: [ 
         {xtype: 'component', html: 'Chrome is', cls:'x-form-check-group-label'}, 
         {xtype: 'checkboxfield', boxLabel: 'Fast', name: 'cb-cust-3'}, 
         {xtype: 'checkboxfield', boxLabel: 'Not so fast', name: 'cb-cust-3'} 
        ] 
       },{ 
        columnWidth: .34, 
        items: [ 
         {xtype: 'component', html: 'This demo is powered by', cls:'x-form-check-group-label'}, 
         {xtype: 'checkboxfield', boxLabel: 'ActiveX', name: 'cb-cust-4'}, 
         {xtype: 'checkboxfield', boxLabel: 'Ext JS', name: 'cb-cust-5'} 
       ] 
       }] 
      }] 
     }] 
    }); 

    // Making use of Ext.ComponentQuery 
    t.chain(
     { action : 'click', target : '>>[id="cb-chrome"]' }, 
     { action : 'click', target : '>>[name="ie6-not-awesome]' }, 
     { action : 'click', target : '>>[boxLabel="Fast"]' }, 
     { action : 'click', target : '>>[boxLabel="Ext JS"]' }, 

     function() { 
      t.pass('All boxes could be clicked ok'); 
     }  
    ); 
});

來源

2014-02-13 jacoviza

在你的安全吊帶文件，您可以配置此選項：

autoScrollElementsIntoView : true,

現在午睡應自動滾動到該元素的點擊。

你也可以設置視口窗口的大小：

viewportHeight : 1200, 
viewportWidth : 1200,

如果滾動條是直接在您的應用程序，你應該能夠用它採用午睡功能移動： http://www.bryntum.com/docs/siesta/#!/api/Siesta.Test.Element-method-scrollVerticallyTo

或使用ExtJS功能： http://docs.sencha.com/extjs/5.0/apidocs/#!/api/Ext.Component-method-setScrollX

來源

2014-10-31 11:11:34 pagep

如何讓午睡能夠點擊不可見的元素

回答

相關問題