Bootstrap Date Picker with CodedUI Automation [CUIT]

Eliminating Inner Text Properties : CodedUI (CUIT)

Question : CodedUI [CUIT] doesn't work with Bootstrap Date Picker
(http://stackoverflow.com/questions/31801462/codedui-cuit-doesnt-work-with-bootstrap-date-picker)

Solution. :

1. Record Each Click as one test method (for the DateTimePicker)

	#region BudgetStartDateSelection
	[TestMethod]
	public void InvokeStartDateField()
	{
	this.UIMap.InvokeStartDateField();
	}
	[TestMethod]
	public void SelectStartDateMonth()
	{
	this.UIMap.SelectStartDateMonth();
	}
	[TestMethod]
	public void SelectStartDateYear()
	{
	this.UIMap.SelectStartDateYear();
	}
	[TestMethod]
	public void SelectStartDateYearRange() { } //
	[TestMethod]
	public void SelectStartDateYearfromYears()
	{
	this.UIMap.SelectStartDateYearfromYears();
	}
	[TestMethod]
	public void SelectStartDate_Month()
	{
	this.UIMap.SelectStartDate_Month();
	}
	[TestMethod]
	public void SelectStatDate_Date()
	{
	this.UIMap.SelectStatDate_Date();
	}
	#endregion

view raw Budgets.cs hosted with ❤ by GitHub

Once these test methods are recorded, make sure to move each of the test method to UIMap.cs from UIMap.Designer.cs using UIMap.uitest
---------
Navigating back to Months
2. Select the test Method wrote for clicking on the name of the month to navigate back to years - SelectStartDateMonth().

	[TestMethod]
	public void SelectStartDateMonth()
	{
	this.UIMap.SelectStartDateMonth();
	}

view raw Budgets.cs hosted with ❤ by GitHub

select the 'SelectStartDateMonth' and press F12, which will navigate to UIMap.Designer.cs and will display the below code.

	public void SelectStartDateMonth() // Clicks on the month title on Start Date DT-Picker
	{
	#region Variable Declarations
	HtmlHeaderCell uIAugust2015Cell = this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItemTable.UIAugust2015Cell;
	#endregion
	// Click 'August 2015' cell
	Mouse.Click(uIAugust2015Cell, new Point(71, 9));
	}

view raw UIMap.Designer.cs hosted with ❤ by GitHub

3. Modify the SelectStartDateMonth() in UIMap.Designer.cs as code snippet follows to eliminate the search properties

	public void SelectStartDateMonth() // Click on the month title on Start Date DT-Picker
	{
	#region Variable Declarations
	HtmlHeaderCell uIAugust2015Cell = this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItemTable.UIAugust2015Cell;
	#endregion
	//Eliminating the InnerText search property which Spies while the runtime
	this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItemTable.UIAugust2015Cell.SearchProperties.Remove(HtmlCell.PropertyNames.InnerText);
	this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItemTable.FilterProperties.Remove(HtmlCell.PropertyNames.InnerText);
	// Click 'August 2015' cell
	Mouse.Click(uIAugust2015Cell, new Point(71, 9));
	}

view raw UIMap.Designer.cs hosted with ❤ by GitHub

---------
Navigating back to Year Range
4. Select the test Method wrote for clicking on the name of the year to navigate back to range of years - SelectStartDateYear().

	[TestMethod]
	public void SelectStartDateYear() // Click on the year title on Start Date DT-Picker
	{
	this.UIMap.SelectStartDateYear();
	}

view raw Budgets.cs hosted with ❤ by GitHub

select the 'SelectStartDateYear' and press F12, which will navigate to UIMap.Designer.cs and will display the below code.

	public void SelectStartDateYear()
	{
	#region Variable Declarations
	HtmlHeaderCell uIItem2015Cell = this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItemTable1.UIItem2015Cell;
	#endregion
	// Click '2015' cell
	Mouse.Click(uIItem2015Cell, new Point(75, 25));
	}

view raw UIMap.Designer.cs hosted with ❤ by GitHub

5. Modify the SelectStartDateYear() in UIMap.Designer.cs as code snippet follows to eliminate the search properties

	public void SelectStartDateYear()
	{
	#region Variable Declarations
	HtmlHeaderCell uIItem2015Cell = this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItemTable1.UIItem2015Cell;
	#endregion
	//Eliminating the InnerText search property which Spies while the runtime
	this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItemTable1.UIItem2015Cell.SearchProperties.Remove(HtmlCell.PropertyNames.InnerText);
	this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItemTable1.FilterProperties.Remove(HtmlCell.PropertyNames.InnerText);
	// Click '2015' cell
	Mouse.Click(uIItem2015Cell, new Point(75, 25));
	}

view raw UIMap.Designer.cs hosted with ❤ by GitHub

---------
Selecting the year from the range 2010-2019
6. Select the test Method wrote for selecting a year - SelectStartDateYearfromYears()

	[TestMethod]
	public void SelectStartDateYearfromYears()
	{
	this.UIMap.SelectStartDateYearfromYears();
	}

view raw Budgets.cs hosted with ❤ by GitHub

select the 'SelectStartDateYearfromYears()' and press F12. which will navigate to UIMap.Designer.cs as code snippet follows to eliminate the search properties

	public void SelectStartDateYearfromYears()
	{
	#region Variable Declarations
	HtmlSpan uIItem2015Pane = this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItem2015Pane;
	#endregion
	// Click '2015' pane
	Mouse.Click(uIItem2015Pane, new Point(17, 30));
	}

view raw UIMap.Designer.cs hosted with ❤ by GitHub

7. Modify the SelectStartDateYearfromYears() in UIMap.Designer.cs as code snippet follows to eliminate the search properties

	public void SelectStartDateYearfromYears()
	{
	#region Variable Declarations
	HtmlSpan uIItem2015Pane = this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItem2015Pane;
	#endregion
	//Eliminate the Class and ControlDefinition Filter Properties to ignore 'Year Active'
	this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItem2015Pane.FilterProperties.Remove(HtmlDiv.PropertyNames.Class);
	this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItem2015Pane.FilterProperties.Remove(HtmlDiv.PropertyNames.ControlDefinition);
	//Customise the Inner Text Property with desired value for Year
	uIItem2015Pane.SearchProperties.Add(HtmlDiv.PropertyNames.InnerText, "2011", PropertyExpressionOperator.Contains);
	// Click '2015' pane
	Mouse.Click(uIItem2015Pane, new Point(17, 30));
	}

view raw UIMap.Designer.cs hosted with ❤ by GitHub

--------
Selecting the month from the year
8. Select the test Method wrote for selecting a Month - SelectStartDate_Month()

	[TestMethod]
	public void SelectStartDate_Month() // Selecting a month from the year
	{
	this.UIMap.SelectStartDate_Month();
	}

view raw Budgets.cs hosted with ❤ by GitHub

select the 'SelectStartDate_Month()' and press F12. which will navigate to UIMap.Designer.cs as code snippet follows to eliminate the search properties

	public void SelectStartDate_Month()
	{
	#region Variable Declarations
	HtmlSpan uIDecPane = this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIDecPane;
	#endregion
	// Click 'Dec' pane
	Mouse.Click(uIDecPane, new Point(23, 32));
	}

view raw UIMap.Designer.cs hosted with ❤ by GitHub

9.  Modify the SelectStartDate_Month() in UIMap.Designer.cs as code snippet follows to eliminate the search properties

	public void SelectStartDate_Month()
	{
	#region Variable Declarations
	HtmlSpan uIDecPane = this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIDecPane;
	#endregion
	//Eliminate the Class and ControlDefinition Filter Properties
	this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIDecPane.FilterProperties.Remove(HtmlDiv.PropertyNames.Class);
	this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIDecPane.FilterProperties.Remove(HtmlDiv.PropertyNames.ControlDefinition);
	//Customise the Inner Text Property with desired value for Month
	uIDecPane.SearchProperties.Add(HtmlDiv.PropertyNames.InnerText, "Jun", PropertyExpressionOperator.Contains);
	// Click 'Dec' pane
	Mouse.Click(uIDecPane, new Point(23, 32));
	}

view raw UIMap.Designer.cs hosted with ❤ by GitHub

-----------
Selecting the date from the month
10.Select the test Method wrote for selecting a Date - SelectStatDate_Date()

	[TestMethod]
	public void SelectStatDate_Date()
	{
	this.UIMap.SelectStatDate_Date();
	}

view raw Budgets.cs hosted with ❤ by GitHub

select the 'SelectStatDate_Date()' and press F12. which will navigate to UIMap.Designer.cs as code snippet follows to eliminate the search properties

	public void SelectStatDate_Date()
	{
	#region Variable Declarations
	HtmlCell uIItem15Cell = this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItemTable2.UIItem15Cell;
	#endregion
	// Click '15' cell
	Mouse.Click(uIItem15Cell, new Point(17, 13));
	}

view raw UIMap.Designer.cs hosted with ❤ by GitHub

11. Modify the SelectStatDate_Date() in UIMap.Designer.cs as code snippet follows to eliminate the search properties

	public void SelectStatDate_Date()
	{
	#region Variable Declarations
	HtmlCell uIItem15Cell = this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItemTable2.UIItem15Cell;
	#endregion
	//Eliminate the Inner Text
	this.UIButtonwoodIaaSCostCeWindow1.UIButtonwoodIaaSCostCeDocument2.UIItemTable2.FilterProperties.Remove(HtmlTable.PropertyNames.InnerText);
	//Customise the Inner Text Property with desired value for Date
	uIItem15Cell.SearchProperties.Add(HtmlCell.PropertyNames.InnerText, "20");
	// Click '15' cell
	Mouse.Click(uIItem15Cell, new Point(17, 13));
	}

view raw UIMap.Designer.cs hosted with ❤ by GitHub

-------



Now the customized date selection run starts.

Recording Steps:-
Initial Stage:

Click 1 : InvokeStartDateField()

Click 3 : SelectStartDateMonth()

Click 4 : SelectStartDateYear()

Click 5 : Selecting the year from the range 2010-2019 : 2011

Click 6 : Selecting the month from the selected year :
Click 6 : Selecting the date from the selected month :