Getting the hostPage in the test file?

[Goose]

Hello All!

I just wanted to start off by saying I'm absolutely in love with your product, it's one of the nicest testing frameworks that I've come across and I can not wait to become proficient in it.

With that said, I've been having a little bit of an issue getting the ball rolling.

I've included my url & hostpage in the harness, but am not sure how to access those files with the GetExt function. In my codes current state, the test is returning the error "Test suite threw an exception: TyperError: Object[object DOMWindow] has no method 'getExt'"

I'm trying to get a simple test up just to get my feet and I'm having a hard time getting around this.

ManageVehicleRates.t.js

StartTest(function (t) {

var Ext = this.getExt();

  t.chain({
    action  : 'type',
    target  : Ext.getCmp('HourlyRate'), 
    text    : '5'
},{
    action  : 'type',
    target  : Ext.getCmp('MilageRate'), 
    text    : '42'
},{
    action  : 'type',
    target  : Ext.getCmp('MilageMinimum'),
    text    : '15' 
})
});

index.js

var Harness = Siesta.Harness.Browser.ExtJS

Harness.configure({
    title       : 'Siesta self-hosting test suite',
    
    testClass   : Class({
        
        isa     : Siesta.Test.ExtJS,
        
        does    : Siesta.Test.Self
    }),
    
    preload : [
        'https://cdn.sencha.io/ext-4.0.7-gpl/resources/css/ext-all.css',
        'https://cdn.sencha.io/ext-4.0.7-gpl/ext-all-debug.js',
        '../siesta-all.js',
        'lib/Siesta/Test/AssertionsTranslator.js',
	{
            // copy the feature test results from the harness
            text        : 'Siesta.supports = Ext.clone((window.opener || window.parent).Siesta.supports.results)'
        }
    ],
    
    overrideSetTimeout  : false
})


Harness.start(
    '010_sanity.t.js',
    '020_test.t.js',
    '021_assertions_1.t.js',
    '030_test_more.t.js',
    '031_test_more_chain.t.js',
    '040_keyevent_simulation.t.js',
    '041_keyevent_simulation2.t.js',
    '042_keyevent_simulation3.t.js',
    '043_special_keys.t.js',
    '201_function.t.js',
{
	group : 'Manage Vehicle Rates',

	items : [
    {url:'ManageVehicleRates.t.js', hostPageUrl:'../../ManageVehicleRates.php'},
		]
},
	
    {
	group               : 'Visual tests',
        
        items               : [
            '050_mouse_click.t.js',
            '050_mouse_click_jquery.t.js',
            '051_mouse_overout.t.js',
            '051_mouse_overout_with_span.t.js',
            '052_mouse_move.t.js',
            '060_element.t.js',
            '061_element_wait_for_selectors.t.js',
            '070_chaining_with_actions.t.js',
            '071_chain_click.t.js'
        ]
    },
    
    '100_util_queue.t.js',
    {
        url             : '110_util_serializer.t.js',
        // need to reach the "done" call, since in FF, serializing the `window.location` property
        // may cause a silent and undetectable exception
        needDone        : true
    },
    '120_util_xml_node.t.js',
    
    {
        group               : 'ExtJS related',
        
        items               : [
            '500_extjs_observable.t.js',
            {
                url         : '501_extjs_combo_autocomplete.t.js',
                speedRun    : false
            },
            '502_extjs_component.t.js',
            '502_extjs_wait_for_cq.t.js',
            '503_extjs_dataview.t.js',
            '504_extjs_element.t.js',
            '505_extjs_grid.t.js',
            '506_extjs_observable.t.js',
            '510_extjs_require_singleton.t.js',
            '520_extjs_dataview.t.js'
        ]
    }
)

ManageVehicleRates.js

function LoadManageVehicleRates()
	{
		Ext.define('VehicleRates',
		{
			extend:'Ext.data.Model',
			fields:
			[
				{name:'ID', type:'integer'},
				{name:'VehicleType_ID', type:'integer'},
				{name:'HourlyRate', type:'double'},
				{name:'HourlyMinimum', type:'double'},
				{name:'MilageRate', type:'double'},
				{name:'MilageMinimum', type:'double'},
				{name:'AreaType_ID', type:'integer'},
				{name:'Active', type:'integer'},
				{name:'VehicleType', type:'string'},
				{name:'AreaType', type:'string'},
				{name:'VehicleID', type:'integer'},
				{name:'AreaID', type:'integer'}
			]
		});
		var VehicleRatesStore = Ext.create('Ext.data.Store',
		{
			model:'VehicleRates',
			proxy:
			{
				type:'ajax',
				url:'getFiles/getVehicleRates.php',
				reader:
				{
					type:'json',
					root:'rows'
				}
			},
			autoLoad:false
		});

		Ext.define('VehicleRatesCompanies',
		{
			extend:'Ext.data.Model',
			fields:
			[
				{name:'ID', type:'integer'},
				{name:'CompanyName', type:'string'},
				{name:'CurrencyAbbr', type:'string'}
			]
		});
		var CompaniesStore = Ext.create('Ext.data.Store',
		{
			model:'VehicleRatesCompanies',
			proxy:
			{
				type:'ajax',
				url:'getFiles/getCompanies.php',
				reader:
				{
					type:'json',
					root:'rows'
				}
			},
			autoLoad:true
		});
		CompaniesStore.addListener('load', function()
		{
			if (CompaniesStore.getCount() == 1)
			{ 
				Ext.getCmp('getVehicleRatesCompanyID').setValue(CompaniesStore.getAt(0).get('ID'));
				Ext.getCmp('getVehicleRatesCompanyID').disable();
				Ext.getCmp('UpdateVehicleRatesCompanyID').setValue(CompaniesStore.getAt(0).get('ID'));
				VehicleTypesStore.load({params:{'CompanyID':CompaniesStore.getAt(0).get('ID')}});
				
				Ext.getCmp('UpdateVehicleRatesForm').getForm().findField('HourlyRate').labelEl.dom.innerText = Ext.getCmp('HourlyRate').fieldLabel + ' (' + CompaniesStore.getAt(0).get('CurrencyAbbr')+')';		
				Ext.getCmp('UpdateVehicleRatesForm').getForm().findField('MilageRate').labelEl.dom.innerText = Ext.getCmp('MilageRate').fieldLabel + ' (' + CompaniesStore.getAt(0).get('CurrencyAbbr')+')';								
			}
		});

		Ext.define('AreaTypes',
		{
			extend:'Ext.data.Model',
			fields:
			[
				{name:'ID', type:'integer'},
				{name:'Type', type:'string'}
			]
		});
		var AreaTypesStore = Ext.create('Ext.data.Store',
		{
			model:'AreaTypes',
			proxy:
			{
				type:'ajax',
				url:'getFiles/getAreaTypes.php',
				reader:
				{
					type:'json',
					root:'rows'
				}
			},
			autoLoad:true
		});

		Ext.define('VehicleTypes',
		{
			extend:'Ext.data.Model',
			fields:
			[
				{name:'ID', type:'integer'},
				{name:'Type', type:'string'}
			]
		});
		var VehicleTypesStore = Ext.create('Ext.data.Store',
		{
			model:'VehicleTypes',
			proxy:
			{
				type:'ajax',
				url:'getFiles/getVehicleTypes.php',
				reader:
				{
					type:'json',
					root:'rows'
				}
			},
			autoLoad:false
		});

		var getVehicleRatesForm = new Ext.FormPanel
		({
			renderTo:'getVehicleRatesFormdiv',
			layout:'column',
			items:
			[{
				xtype:'combo',
				name:'getVehicleRatesCompanyID',
				id:'getVehicleRatesCompanyID',
				store:CompaniesStore,
				mode:'local',
				displayField:'CompanyName',
				valueField:'ID',
				fieldLabel:'Company',
				forceSelection:true,
				listeners:
				{
					select: function(selectbox,record,index)
					{
						VehicleTypesStore.load({params:{'CompanyID':Ext.getCmp('getVehicleRatesCompanyID').getValue()}});
						Ext.getCmp('UpdateVehicleRatesCompanyID').setValue(Ext.getCmp('getVehicleRatesCompanyID').getValue());
					}
				}
			},
			{
				xtype:'combo',
				name:'RatesVehicleType',
				id:'RatesVehicleType',
				store:VehicleTypesStore,
				queryMode:'local',
				displayField:'Type',
				valueField:'ID',
				fieldLabel:'Vehicle Types',
				forceSelection:true
			}]
		});
		Ext.create('Ext.Button',
		{
			text:'Get Vehicle Rates ',
			cls:'btn ',
			renderTo:'getVehicleRatesButtonsdiv',
			handler:function()
			{
				var ID = Ext.getCmp('getVehicleRatesCompanyID').getValue();
				VehicleRatesStore.load({params:{'CompanyID':ID,'VehicleType':Ext.getCmp('RatesVehicleType').getValue()}});
			}
		});

		var VehicleRatesGrid = new Ext.grid.GridPanel
		({
			id:'VehicleRatesGrid',
			name:'VehicleRatesGrid',
			store:VehicleRatesStore,
			height:400,
			title:'Vehicle Rates',
			border:true,
			renderTo:'VehicleRatesGriddiv',
			columnLines:true,
			columns:
			[
				{header:'VehicleType', name:'VehicleType', flex:1, dataIndex:'VehicleType'},
				{header:'Hourly Rate', name:'Hourly Rate', flex:1, dataIndex:'HourlyRate'},
				{header:'Hourly Minimum', name:'Hourly Minimum', flex:1, dataIndex:'HourlyMinimum'},
				{header:'Milage Rate', name:'Milage Rate', flex:1, dataIndex:'MilageRate'},
				{header:'Milage Minimum', name:'Milage Minimum', flex:1, dataIndex:'MilageMinimum'},
				{header:'Area Type', name:'Area Type', flex:1, dataIndex:'AreaType', hidden:true},
				{header:'Active', name:'Active', flex:1, dataIndex:'Active'}
			],
			selModel :new Ext.selection.RowModel
			({
				singleSelect:true,
				listeners:
				{
					select: function(rowModel, record, index, smObj)
					{
						UpdateVehicleRatesForm.getForm().loadRecord(record);
						Ext.getCmp('VehicleType1').disable();
						Ext.getCmp('VehicleType1').setValue(record.get('VehicleType'));
						Ext.getCmp('AreaType').disable();
						Ext.getCmp('UpdateVehicleRatesID').setValue(record.get('ID'));
					}
				}
			})
		});

		Ext.create('Ext.Button',
		{
			text:'Help',
			renderTo:'VehicleRatesGridButtonsdiv',
			cls:'btn ',
			handler:function()
			{
					windowHelp('Tutorials/ManageVehicleRates.mp4');
			}
		});

		Ext.create('Ext.Button',
		{
			text:'Search',
			renderTo:'VehicleRatesGridButtonsdiv',
			cls:'btn ',
			handler:function()
			{
				searchFunction(Ext.getCmp('VehicleRatesGrid'));
			}
		});

		Ext.create('Ext.Button',
		{
			text:'Refresh',
			renderTo:'VehicleRatesGridButtonsdiv',
			cls:'btn ',
			handler:function()
			{
				Ext.getCmp('VehicleRatesGrid').getStore().clearFilter();
			}
		});

	var UpdateVehicleRatesForm = new Ext.FormPanel
	({
		renderTo:'UpdateVehicleRatesFormdiv2',
		url:'ManageVehicleRatesSubmit.php',
		id:'UpdateVehicleRatesForm',
		items:
		[{
			xtype:'textfield',
			id:'UpdateVehicleRatesID',
			name:'UpdateVehicleRatesID',
			hidden:true
		},
		{
			xtype:'textfield',
			id:'UpdateVehicleRatesCompanyID',
			name:'UpdateVehicleRatesCompanyID',
			hidden:true
		},

		{
			xtype:'textfield',
			id:'VehicleType_ID',
			name:'VehicleType_ID',
			hidden:true
		},
		{
			xtype:'textfield',
			id:'AreaType_ID',
			name:'AreaType_ID',
			hidden:true,
			value:1
		},
		{
			xtype:'combo',
			name:'VehicleType1',
			id:'VehicleType1',
			store:VehicleTypesStore,
			queryMode:'local',
			displayField:'Type',
			valueField:'ID',
			fieldLabel:'Vehicle Type',
			forceSelection:true,
			listeners:
			{
				select: function(selectbox,record,index)
				{
					Ext.getCmp('VehicleType_ID').setValue(record[0].get('ID'));
				}
			}


		},
		{
			xtype:'combo',
			name:'AreaType',
			id:'AreaType',
			store:AreaTypesStore,
			mode:'local',
			displayField:'Type',
			valueField:'ID',
			fieldLabel:'Area Type',
			hidden:true,
			value:1,
			listeners:
			{
				select: function(selectbox,record,index)
				{
					Ext.getCmp('AreaType_ID').setValue(record[0].get('ID'));
				}
			}
		},
		{
			xtype:'textfield',
			name:'HourlyRate',
			id:'HourlyRate',
			fieldLabel:'Hourly Rate '
		},
		{
			xtype:'textfield',
			name:'HourlyMinimum',
			id:'HourlyMinimum',
			fieldLabel:'Hourly Minimum'
		},
		{
			xtype:'textfield',
			name:'MilageRate',
			id:'MilageRate',
			fieldLabel:'Milage Rate'
		},
		{
			xtype:'textfield',
			name:'MilageMinimum',
			id:'MilageMinimum',
			fieldLabel:'Milage Minimum'
		},
		{
			xtype:'checkbox',
			name:'Active',
			id:'Active',
			fieldLabel:'Active',
			value:true
		},
		{
			xtype:'textfield',
			name:'Action',
			id:'Action',
			hidden:true
		}]
	});

	Ext.create('Ext.Button',
	{
		renderTo:'UpdateVehicleRatesButtonsdiv',
		text:'Update/Create',
		name:'UpdateVehicleRatesUpdate1',
		id:'UpdateVehicleRatesUpdate1',
		cls:'btn ',
		handler:function()
		{
			if (Ext.getCmp('UpdateVehicleRatesID').getValue() == '')
				var Action = 'Create';
			else
				var Action = 'Update';
			Ext.Ajax.request
			({
				url:'ManageVehicleRatesSubmit.php',
				success: function()
				{
					Ext.Msg.alert('Success', 'Vehicle Rate successfully updated');
					var ID = Ext.getCmp('UpdateVehicleRatesCompanyID').getValue();
					VehicleRatesStore.load({params:{'CompanyID':ID,'VehicleType':Ext.getCmp('RatesVehicleType').getValue()}});
					UpdateVehicleRatesForm.getForm().reset();
					Ext.getCmp('UpdateVehicleRatesCompanyID').setValue(ID);

					Ext.getCmp('VehicleType1').enable();
					Ext.getCmp('AreaType').enable();
				},
				failure: function()
				{
					Ext.Msg.alert('Error', 'Problem submitting vehicle rate');
				},
				params:
				{
					'ID':Ext.getCmp('UpdateVehicleRatesID').getValue(),
					'CompanyID':Ext.getCmp('UpdateVehicleRatesCompanyID').getValue(),
					'VehicleType_ID':Ext.getCmp('VehicleType_ID').getValue(),
					'AreaType_ID':Ext.getCmp('AreaType_ID').getValue(),
					'Action':Action,
					'VehicleType':Ext.getCmp('VehicleType1').getValue(),
					'AreaType':Ext.getCmp('AreaType').getValue(),
					'HourlyRate':Ext.getCmp('HourlyRate').getValue(),
					'HourlyMinimum':Ext.getCmp('HourlyMinimum').getValue(),
					'MilageRate':Ext.getCmp('MilageRate').getValue(),
					'MilageMinimum':Ext.getCmp('MilageMinimum').getValue(),
					'Active':Ext.getCmp('Active').getValue()
				}
			});
		}
	});

	Ext.create('Ext.Button',
	{
		renderTo:'UpdateVehicleRatesButtonsdiv',
		text:'Delete Vehicle Rate',
		name:'UpdateVehicleRatesDelete1',
		id:'UpdateVehicleRatesDelete1',
		cls:'btn ',
		handler:function()
		{
			var Action = 'Delete';
			Ext.Ajax.request
			({
				url:'ManageVehicleRatesSubmit.php',
				success: function()
				{
					Ext.Msg.alert('Success', 'Vehicle rate successfully deleted');
					var ID = Ext.getCmp('UpdateVehicleRatesCompanyID').getValue();
					VehicleRatesStore.load({params:{'CompanyID':ID,'VehicleType':Ext.getCmp('RatesVehicleType').getValue()}});
					UpdateVehicleRatesForm.getForm().reset();
					Ext.getCmp('UpdateVehicleRatesCompanyID').setValue(ID);
					Ext.getCmp('VehicleType1').enable();
					Ext.getCmp('AreaType').enable();

				},
				failure: function()
				{
					Ext.Msg.alert('Error', 'Problem deleting vehicle rate');
				},
				params:
				{
					'ID':Ext.getCmp('UpdateVehicleRatesID').getValue(),
					'Action':Action
				}
			});
		}
	});

	Ext.create('Ext.Button',
	{
		renderTo:'UpdateVehicleRatesButtonsdiv',
		text:'Reset Form',
		cls:'btn ',
		handler:function()
		{
			var ID = Ext.getCmp('UpdateVehicleRatesCompanyID').getValue();
			UpdateVehicleRatesForm.getForm().reset();
			Ext.getCmp('UpdateVehicleRatesCompanyID').setValue(ID);
			Ext.getCmp('VehicleType1').enable();
			Ext.getCmp('AreaType').enable();
		}
	});

	}
	LoadManageVehicleRates();

Thanks very much, I look forward to chatting with you all!
-Goose

[mats]

Hey, welcome to the forums . Don't use the Siesta self testing suite as a base, it's too complex. Use the one in the examples folder instead.

var Ext = this.getExt();

Don't use this in your test files, this is only used if you create your own external test file. So just use 'Ext' like you normally do in there. Does this get the ball rolling?

[Goose]

Thanks for the hasty response!

I've fixed my index file

var Harness = Siesta.Harness.Browser.ExtJS;

Harness.configure({
    title     : 'Gooses Test Suite',
    
    testClass : Class({
        
        isa     : Siesta.Test.ExtJS,
        
        does    : Siesta.Test.Self
    }),
    
    preload : [
        "https://cdn.sencha.io/ext-4.0.7-gpl/resources/css/ext-all.css",
        "https://cdn.sencha.io/ext-4.0.7-gpl/ext-all-debug.js"
    ]
});


Harness.start(
    {
        group : 'Manage Vehicle Rates',

   items : [
    {url:'ManageVehicleRates.t.js', hostPageUrl:'../../ManageVehicleRates.php'},
      ]
    }
);

and changed my ManageVehicleRates.t.js to remove the getExt()

StartTest(function (t) {

  t.chain({
    action  : 'type',
    target  : Ext.getCmp('HourlyRate'), 
    text    : '5'
},{
    action  : 'type',
    target  : Ext.getCmp('MilageRate'), 
    text    : '42'
},{
    action  : 'type',
    target  : Ext.getCmp('MilageMinimum'),
    text    : '15' 
})
});

but am now receiving

Test suite threw an exception: TypeError: Cannot read property 'nodeName' of null

[mats]

testClass : Class({
       
        isa     : Siesta.Test.ExtJS,
       
        does    : Siesta.Test.Self
    }),

Remove that, not relevant. Can you post a stacktrace, or a full test case if it's still not working?

[Goose]

My stacktrace is coming up as undefined in firebug. Is there something that I'm doing wrong?

The testcase that I posted above is my full testcase.

[mats]

never heard of an undefined stacktrace. Post a screenshot? The test case is 'complete' if I can copy paste and run it, I don't your PHP dependencies anywhere?

[Goose]

I think I got the stack trace, set transparent exceptions, attached.

[mats]

Looks like you're trying to type into cyberspace. what does these evaluate to, prior to the t.chain call?

Ext.getCmp('HourlyRate'),
Ext.getCmp('MilageRate'),
Ext.getCmp('MilageMinimum'),

[Goose]

Not sure what you mean, the test isn't getting that far.

I've sent you a PM.

[mats]

Yes, test is complaining about a missing target when typing... One of your getCmp calls is invalid.