I am using watin
and specflow
to automate the browser testing for my angular
application. I have ran into a problem with TextField.TypeText("some string")
function which does not update the angular model value.
The sample code is as follows:
public void updateTextField(string value)
{
GetTextField.TypeText(value);
UpdateButton.Click();
}
public TextField GetTextField
{
get { return TextField(Find.ById(_textFieldId)); }
}
public Button UpdateButton
{
get { return Button(Find.ById(_updateButtonId)); }
}
I can see the text being typed in the browser however the angular model does not get updated and the value typed in the text field is ignored.
I have already tried adding
GetTextField.Change();
GetTextField.TriggerEvent("onchange");
To try and force the input field to be marked changed. I had similar issue with the select dropdown as well. However radio buttons seems to work fine.
Any help will be much appreciated. Thanks.
I found out that TextField::TypeText()
function does not trigger the change
event on the element, hence the angular modal is not updated. I wrote an extension to the TextField method that will do the job.
/// <summary>
/// Type text and trigger change in the input field
/// </summary>
/// <param name="textField"></param>
/// <param name="text"></param>
public static void SendKeys(this TextField textField, string text)
{
textField.TypeText(text);
TriggerChange(textField);
}
/// <summary>
/// Trigger change on the input element
/// </summary>
/// <param name="element">Element to trigger change on</param>
private static void TriggerChange(Element element)
{
string script = String.Format(
"$('[name={1}]').change()",
element.Name
);
element.DomContainer.RunScript(script);
}
And i am using it as follows:
public void updateTextField(string value)
{
GetTextField.SendKeys(value);
UpdateButton.Click();
}