Newbie Test Studio problems using test recorder with dynamic control IDs

[Stefan]

Hi all,

I'm writing on behalf of our test team that's getting started with WebIO Test Studio QA Edition and have run into a few challenges in setting up tests. Together we weren't able to find samples to do what we're hoping to get done but I assume it's possible in some way.
We have several tests created in the test studio that are running great but are seeing failures usually due to unreliable element IDs. The test team is less technical than a typical QA department so are relying heavily on the test recorder.

1) One of our pages contains an arbitrary number of textboxes (HTML INPUT fields). Our test script adds a new textbox by triggering a postback using other controls on the page. After that, we want to verify that there exists a textbox on the page containing the text we entered.
Using the recorder, the textbox is always identified by ID which fails on subsequent runs.
I suppose the short form of the question is "how do I verify that there exists on the page (or within a particular div) an INPUT with value X?". Can this be done using the GUI tools without (or using minimal) code?

2) How do we verify that a list (HTML SELECT) contains (not necessarily selected) a particular value? The IDs of the items are also unreliable, but we know the value we're looking for. The ID of the SELECT element is known.

3) How do we verify that a list (HTML SELECT) does NOT contain a particular value? I suspect a GUI-created solution isn't possible for a case like this.

4) How do we verify that a list (HTML SELECT) contains no items (OPTIONs)?

The test recorder is great for static pages but dynamic IDs have proven challenging to them. We went through a getting started guide together and didn't find anything that went into the areas we're having troubled with. If there is some supplemental documentation that points us in the right direction that would be super.

Thanks!

[Keaegan]

Hi Stefan,

Those are some good questions, and I'll do my best to answer each one for you. 

1. Building special rules for finding (advanced find expression)

Regarding your first inquiry, this can be accomplished through creating a more complex Find expression. I have attached a screenshot showing the final outcome for the find expression. We can assist with creating this logic with you, but will have an easier time doing so with access to the application. Easiest way to do this is:

1. Locate the element within the DOM
2. After located, find the tag that contains your target element (for mine, the target was located within a DIV, so I highlighted the DIV)
3. Right-click the tag that contains your element and choose "Add to project elements"
4. Next, go to QA edition and find the element you just added within the Element Explorer. Click it once to highlight it and look at the properties for the element. Change the Friendlyname to something dissimilar to the rest of the elements (for quick location later).
5. If you review my provided "FindExpression.png", you will see that blue bars separate the find logic after a THEN is used. What this means is that the Find expression will group logic together only if they all use AND. The moment a THEN is used, it is considered the next "string" in the logic (find the div with name X and ID X, THEN find select). This will first find the DIV listed, then look for a select box within the div. More logic can be used to make it more selective, but this is just a basic example. Continue adding logic until the find expression locates the anticipated element.
6. Click OKAY to save the changes.

You can use a variation of the above to locate your dynamic items. If you need help getting this setup initially, please let us know.

2. Verify that a list (HTML Select) contains, not necessarily has selected, a specific option

To do this, turn on highlighting, locate the nub, and click the Expression Builder button. Make your step use "InnerText", "Contains", and then use the final field to input what you want to ensure is present within the list.

3. Verify that a list (HTML Select) DOES NOT contain a specific option

This would be the same as the previous, only you would select "NotContain" instead of Contain. See provided screenshot SelectNotContain.png for an example.

4. Verify that a list is empty

See SelectEmpty.png. This rule is simple to setup, but more difficult to explain. It will essentially look identical to the last two verifications you created, but the final field will be left empty. If there is any content within the list (option), this verification will fail. Otherwise it will pass.

If you need further assistance and/or explanation for the above, please don't hesitate to ask. 

Best wishes,
Keaegan
the Telerik team

[Stefan]

Hi Keaegan,

Thanks! That was a big help.

A question about how find expression work - do they attempt to match any place in the DOM that satisfies the rules? For example, if I define a really generic expression like "an INPUT within a DIV", will it turn up the first match in the DOM, or do I need to provide rules to guide the expression from the highest level in? From what I've seen it looks like the former is correct.
By extension, does that mean it's also possible to just create a very simple expression like "INPUT with value 'Some text'" as a lazy man's way of determining that somewhere on the page there's a textbox with 'Some text' in it?


Also a couple of feature requests (assuming I'm not just missing them):

• When copying and pasting test steps, it would be great if the item would be pasted at the location where my mouse pointer was when I selected 'Paste' from the context menu. It can get frustrating to always have to drag the step up from the very bottom of the list.
• There doesn't seem to be a way to reorder items in the Find Expression Builder. It's usually not an issue but something if you need to add a parent item, the only way to accomplish this (that I've found) is to add a new step and then copy the contents of every step down one level so I can edit the top one.
• A way to manually insert a test step. It seems as though I can't create my own steps from scratch, and often I can't just create a similar step using the builder and then modify the PrimaryTarget. This was especially problematic for me when I was trying to add a step to verify that an element was visible. The element itself only became visible after an AJAX callback, and once I hovered on the element and clicked the 'magic blue button', it triggered a blur event on the DIV I was hovered over which made it disappear. The Quick Steps that I could then use were for the element that was _behind_ the DIV that had disappeared.

Thanks,
Stefan

[Keaegan]

Hello Stefan,

Glad to hear the previous data helped!

First, to answer you first example, it will find the first INPUT contained within a DIV. When you create rules using the find expression builder, you will notice items being writ as follows:

Expression:  name=attribname,|,tagIndex=attribtype

So, if you are targeting the 2nd input within the 3rd div, it would read more similar to the following:

Expression:  TagIndex=div:3,TagIndex=input:2

With only these two items within the find rule for the element, it should find the 3rd Div, then the 2nd input within it regardless of what other data is present (such as names).

On your final question, yes, one of the easier ways to find an element within the page is exactly what you stated: having your developers put a special tag on the "special element" (a more unique id, name, etc.), then making that part of the rule for finding the element.

Regarding your feature requests:

• We have logged a request to have it made possible to copy/paste steps in a selected location within the test. Currently, if you are not recording and using the "Record after selected" option, the test will apply the most recently recorded steps to the bottom. I apologize that there is not a work-around for copy/pasting steps in the interim.
• I like the sounds of re-ordering items within an already built expression to find an element. Currently the method you listed is the only viable workaround I can find as well. To make sure i get all of it within the request, tell me more in regards to what you would expect from this type of feature (being able to re-order items within the expression builder). I'll be happy to file this request on your behalf.
• Can you tell me a little more on this last inquiry? Is this something where you wouldn't be able to use the Record Tab > Add > Script Step? This sounds like you may be unaware of the "Record Next Step" feature (Right-click any test step in QA edition, mouse over "Record Next Step", then choose the best option for your current needs) as well. Please let me know more in regards to what the application is/isn't doing for you in regards to this specific inquiry.

I'll look for your reply on the above, hope you had a good holiday season thus far!

Regards,
Keaegan
the Telerik team