I've got a very complex form and i'm using the MVC model binding to capture all the information
I've got it set up to capture all the different submissions that can happen as there are about 10 different submit buttons on the form, and there are also 2 image buttons
I tried to get a bit clever (or so i thought) with capturing the image button submissions, and have created a child class so that i can capture the x value that's returned
public class ImageButtonViewData {
public int x { get; set; }
public string Value { get; set; }
}
The parent class looks something like this
public class ViewDataObject {
public ImageButtonViewData ImageButton { get; set; }
public ViewDataObject(){
this.ImageButton = new ImageButton();
}
}
The html for the image button then looks like
<input type="image" id="ViewDataObject_ImageButton" name="ViewDataObject.ImageButton" />
This works fine in all browsers except for Chrome.
When i debug it in chrome, the Request.Form object contains the values that i would expect, but after the model binding has occurred, the ImageButton property on the ViewDataObject has been set to null
The only difference that i can see between the submission values is that Chrome passes the x as lower case (ViewDataObject.ImageButton.x) and IE passes it as upper case (ViewDataObject.ImageButton.X) but i didn't think that model binding took any notice of casing on property names
Does anyone have any ideas ?
EDIT => Just to clarify, i'm not trying to find a workaround for this, i'm trying to figure out why this technique doesn't work in Chrome considering it works in all the other browsers and the correct data is being passed through
There are a couple of options, let me list a view
To check which button was pressed, you could give all the buttons the same names, but different id's. In your FormCollection on your Controller Action, you should be able to get the button that was pressed by doing something like "collection["buttonName"]" and checking it's value.
I think this option is the correct one to go for, and it is as follows. Separate your forms properly. You can have multiple forms on a page and tie each to it's own Controller Action, you don't need to do ugly if statements and it actually separates your actions nicely.
I hope that this answers your question somehow.
I could not reproduce your problem, but I don't think that image inputs return a value, only .x and .y. The following works in Chrome, Firefox and IE (sorry about vb.net):
Public Class ImageButtonViewData
Public Property X As String
Public Property Y As String
Public ReadOnly Property WasClicked As Boolean
Get
Return Not String.IsNullOrEmpty(X)
End Get
End Property
End Class
Related
I am using Vaadin Testbench (4.1.0-alpha) for designing some integration test for my application (designed in Vaadin 7.6.1).
In a window, I use a rich test area. The idea is to design a test where the value of this rich text element is changed simulating some user behaviour. But now I realize I cannot find any method for change the value of this element, neither get the current value of the element.
I have tested some methods.getHTML() gets the HTML for the component, no the HTML of the designer. getText() gets the list of elements (font colour, background and other options of the element, but not the content).
Then I expect to have specific class methods for retrieving the value. If I explore the class RichTextAreaElement, seems that no method is implemented. All code in this class is:
#ServerClass("com.vaadin.ui.RichTextArea")
public class RichTextAreaElement extends AbstractFieldElement {
}
As you can see, no method is declared.
How can I do a test where a user change the value of this rich text area? It is not implemented?
Hmm yeah, that looks like some work in progress, probably because it's a complex component with all the features it provides. Nonetheless we can workaround the limitations a bit, again making use of chrome developer tools (or similar) and some custom classes to select the components by (actually it's just the gwt-RichTextArea).
Of course this serves just as a starting point and can be further enhanced. Also I'd be very interested to see a more elegant solution if someone finds one...
Structure inspection
Test class
public class RichTextAreaTest extends TestBenchTestCase {
#Before
public void setUp() throws Exception {
System.setProperty("webdriver.chrome.driver", "D:\\Kit\\chromedriver_win32\\chromedriver.exe");
setDriver(new ChromeDriver());
}
#After
public void tearDown() throws Exception {
// TODO uncomment below once everything works as expected
//getDriver().quit();
}
#Test
public void shouldModifyRichTextArea() throws InterruptedException {
// class to identify the editor area by
String editorClass = "gwt-RichTextArea";
// open the browser
getDriver().get("http://localhost:8080/");
// select the first rich text
RichTextAreaElement richTextArea = $(RichTextAreaElement.class).first();
// get the editor section which is where we're writing
WebElement richTextEditorArea = richTextArea.findElement(By.className(editorClass));
// click inside to make it "editable"
richTextEditorArea.click();
// send some keystrokes
richTextEditorArea.sendKeys(" + something else added by selenium");
}
}
Result:
Update for getting the value
If you simply want to get the text, the code below will do the trick:
// switch to the editor iframe
getDriver().switchTo().frame(richTextEditorArea);
// get the <body> section where the text is inserted, and print its text
System.out.println("Text =[" + findElement(By.xpath("/html/body")).getText() + "]");
Output
Text =[Some predefined text + something else added by selenium]
At the end, I was able to obtain the content of the element selecting the first iframe of the page, and searching for the body content. The final code looks like:
String currentWindow = getDriver().getWindowHandle();
getDriver().switchTo().frame(getDriver().findElement(By.tagName("iframe")));
WebElement webelement = this.findElement(By.xpath("/html/body"));
String text = webelement.getText();
getDriver().switchTo().window(currentWindow);
return text;
As I need to switch between the iframe and the window, I am only able to obtain the content of the element, not the element itself. If I return directly the element for future use, an org.openqa.selenium.StaleElementReferenceException: Element belongs to a different frame than the current one - switch to its containing frame to use it exception is obtained.
For changing the text, the solutions is very similar, only use the sendKey functions to first remove existing characters and later add the new text:
String currentWindow = getDriver().getWindowHandle();
getDriver().switchTo().frame(getDriver().findElement(By.tagName("iframe")));
WebElement webelement = this.findElement(By.xpath("/html/body"));
// Remove any previous text.
String previousText = webelement.getText();
for (int i = 0; i < previousText.length(); i++) {
webelement.sendKeys(Keys.DELETE);
}
// Set text.
webelement.sendKeys(text);
getDriver().switchTo().window(currentWindow);
can any one help on the below.
I need to open a new browser tab using command link tag in jsf, only when a condition is true.
How to set conditions in jsf tags?
You can either use the rendered attribute, and completing them with a EL expression. Using the rendered attribute, the link will only be shown if the condition is true.
If you want to open a commandlink in a new browser tab depending on a condition, you can easily achieve it using the rendered attribute:
<h:commandLink action="my_navigation_rule"
rendered="#{!MyBean.booleanValue}" />
<h:commandLink action="my_navigation_rule"
rendered="#{MyBean.booleanValue}" target="_blank"/>
As the rendered conditions are exclusionary, it will only be printed one of the commandLinks.
More info on JSF Expression Language (EL) (Very useful to set conditions in jsf tags) --> here
Note: I know the solution can be improved since you can use an EL expression to determine the target value, but in my opinion this solution is easier.
You can use managed bean actionListener of the commandMenu and then get the condition tested and redirect to the page in new tab if its true...
import javax.faces.event.ActionEvent;
public class PageBean {
String page;
public PageBean() {
}
public void getMenu(ActionEvent actionEvent) {
// Add event code here...
/* add your code to get and test condition and based upon the condition true and false conditon get commandMenu Id of the menu clicked by the following way
be sure to give the id of the command menu the same name you want to open in the next tab upon menu click like in my case i have given the command menu id as page1
String id = actionEvent.getComponent().getId();
System.out.println(" Menu ID : "+id);
now set the fetched menu id to the page variable with the proper page extension and acccess the pariable in the action from the manged bean to redirect to the page in the next tab upon menu click after testing the validation */
page = id;
System.out.println("Value assigned to the page from the menu Id is :"+page);
}
public String getPage() {
return page;
}
public void setPage(String page) {
this.page = page;
}
public void dashContentEntryCheck(){
System.out.println("entered inside dashboard content task flow");
}
}
The problem:
.Click()-ing a radio button webdriver element stales it(no control over the page that does this). The DOM element itself is still the same.
The goal:
I want to reset the existing webdriver element using its own original selector method so that it is no longer stale. I want a general solution that does not require knowing ahead of time how the element was found. I want to use the existing stale element to do the work. Ideal case would look something like this(using the following C# extension method just for sake of example):
IWebElement refreshedElement = driver.FindElement(staleElement.By());
The question:
Is there a way to expose the existing elements location? Is the 'address' of the element available anywhere? It doesn't even have to be the original method of addressing the element when it was found, I don't care about that. I'd just rather not have to make a subclass just to capture this information.
No, Selenium does not keep track of 'how' you found an element, and frankly I don't think that should be Selenium's responsibility.
I would wrap it into a new class, which inherits from RemoteWebElement, and has a method called RefindElement.
I might suggest considering adding the concept of a "Page Class". Basically, instead of adding the element to the test itself, I create a separate class that has methods that return elements.
For example, a login page would have three elements therefore 3 methods:
public class LoginPage
{
private IWebDriver driver { get; set; }
public CSCView_SalesAspx(IWebDriver driver) { this.driver = driver; }
public IWebElement Id { get { return driver.FindElement(By.Id("login_id")); } }
public IWebElement Pw { get { return driver.FindElement(By.Id("login_pw")); } }
public IWebElement SubmitBtn { get { return driver.FindElement(By.Id("submitBtn")); } }
}
Now all you have to do is instantiate the class then interact with the method. Your element should always be "fresh" since you're doing the lookup every time (without any extra work).
LoginPage loginPage = new LoginPage(driver);
loginPage.Id.SendKeys("myName");
loginPage.Pw.SendKeys("myPw");
loginPage.SubmitBtn.Click();
The best thing about this is if a page changes, instead of having to rewrite every test, you only change one page class and that fixes your broken tests.
I have a MVC3 view that enables the user to create a couple different things. Within the parent view the forms to do so are broken up via jquery ui tabs like the following:
<div id="tabs">
<ul>
<li>New Thing 1</li>
<li>Different New Thing</li>
</ul>
<div id="tabs-1">#Html.Action("CreateNewThing", "NewThingController")</div>
<div id="tabs-2">#Html.Action("CreateDifferentThing", "DifferentThing")</div>
<div></div>
</div>
<script type="text/javascript">
$(function () {
$("#tabs").tabs();
});
</script>
Within the partial view I have:
#model NewThingViewModel
#using (Html.BeginForm("CreateNewThing", "NewThingController", FormMethod.Post, new { id = "frmCreateNewThing" }))
{
...
with input fields, a submit button, etc. This seems to work well: it renders everything and posts just fine to the right controller action method.
However I'm now wiring in the validation and I've got an issue.
In the controller it is rendering the view like so:
public ActionResult CreateNewThing(NewThingViewModel model)
{
... initializing model fields, drop downs etc.
return PartialView("CreateNewThing", model);
}
I have a seperate post method like so:
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult CreateNewThing(NewThingViewModel newThingViewModel, FormCollection collection)
{
.....
}
Sample Model:
public class NewThingViewModel
{
[Required]
[StringLength(50)]
[Display(Name = "Display Name:")]
public string DisplayName { get; set; }
}
The trouble is, when the page first comes up the fields marked as [Required] through DataAnnotations in the model are showing up red as well as the validation summary showing them invalid when the page initially shows. I.E. it's acting like it's already been posted before the user gets to enter anything on the initial load or even put anything in the text boxes.
I know the first non-post CreateNewThing is firing because I can catch it in the debugger and I know the 2nd one does not on the initial load.
What would cause my validations to fire on the Get?
Is it due to the way Html.Action works and the fact that I'm rendering partial views onto another view?
I'm using UnobtrusiveJavaScriptEnabled and ClientValidationEnabled = true in web.config.
I can't find anyone else that has run into this particular problem. Every other example just seems to work, then again I don't find an example where the view is broken into three partials contained within jquery ui tabs.
How do I fix this?
Options:
Do I need to manually manipulate the Model.IsValid as a workaround?
Use a different mechanism to render the partial views on the parent view instead of Html.Action?
Use some javascript/jquery to catch the validation and stop it?
Don't have method parameters on your GET controller action. You can initialize an empty model and pass it to the view but you dont need a model to be passed into the method
You're passing in an "empty" model (which I assume has default values set for your required properties), when you should be passing in null.
If I create a user control (EDIT:not a web control/server control) it's pretty trivial to get databinding. I just add a datasourceID property.
In code behind (vb)
Partial Public Class BandedControl
Inherits UserControl
Public Property DataSourceID() As String
Get
Return MyGridView.DataSourceID
End Get
Set(ByVal value As String)
MyGridView.DataSourceID = value
End Set
End Property
End Class
In code behind (c#)
public partial class BandedControl : UserControl
{
public string DataSourceID {
get { return MyGridView.DataSourceID; }
set { MyGridView.DataSourceID = value; }
}
}
My issue is that this breaks design time rendering and also I don't get a drop down list to choose my datasource. How do I resolve this. (Hint: I think I need a type convertor, but all the info I can find relates to server controls not user controls).
You could try adding the IDReferenceProperty attribute to your property definition...
public partial class BandedControl : UserControl
{
[System.Web.UI.IDReferenceProperty(typeof(DataSourceControl))]
public string DataSourceID
{
get
{
return MyGridView.DataSourceID;
}
set
{
MyGridView.DataSourceID = value;
}
}
}
See http://msdn.microsoft.com/en-us/library/system.web.ui.idreferencepropertyattribute.aspx for more info about the IDReferencePropertyAttribute class.
If that doesn't work - I'd also try to inherit from DataBoundControl instead of UserControl and see if that gets you anywhere.
Web UserControls are compiled dynamically at run time and so are not rendered at Design time, what you want to do is create a Web Custom Control. Your best bet here is to extend one of the existing Bindable Web Controls
http://msdn.microsoft.com/en-us/library/aa651710(VS.71).aspx
Not sure if this is exactly what you want but I seem to remember them showing something similar to this in some dnr tv episodes.
I think it was Miguel Castro episodes 1 & 2, but it could be episode 31.
An archive of all the videos is here