Element Explorer and iframes with generated IDs

[Corey]

Our application utilizes iframes that are not immediately available (for mouseover selection) when recording a test in Test Studio Express. When attempting to grab an HtmlButton (or similar) to validate the control is visible, a new Page is added to Elements Explorer, then a Frame element, then finally the HtmlButton.

My issue with this is the iframe has a generated ID ("client_new_12345678"), so the child HtmlButton will never again be found. I have used the DOM Explorer to find the iframe and manually add it to the Element List, then used the Find Element feature to setup a find expression (tagname is exactly iframe, id starts with client_new_). While this HtmlFindExpressionElement works for use with the Step Builder with suggested Actions and Verifications, it does not generate a Frame object with child objects I can perform other verifications with.

What has worked for me (Pages hierarchy generated through record):

HtmlAnchor MarginLink = Pages.Product.Frame1.MarginLink;
            MarginLink.Wait.ForExists(10000);
            Assert.IsTrue(MarginLink.IsVisible());
            MarginLink.Click();

Using the above model and the iframe I manually added to the Element List, I've unsuccessfully attempted:

HtmlControl frame = Pages.Product.New_IFrame;
            Element buttonSelect = frame.Find.ByAttributes("tagname=input", "value=Select", "type=button");
            buttonSelect.Wait.ForExists();

Always fails as this is always null --> buttonSelect.Wait.ForExists().
Inspecting Pages.Product.New_IFrame, I've found there are no children. I understand there are no objects generated under Pages, but how can I go about accessing the DOM and performing actions against items I'm looking for under elements with generated names that don't exist until run time?

Thanks!

//corey

[Cody]

Hi Corey,

I just want to confirm... the dynamically generated ID is for the <iframe> element itself, not the elements contained within the <iframe>? If the element has a dynamically generated ID we have this KB article that talks about how to handle such a situation.

If it is the <iframe> node with the dynamically generated ID you can best solve this problem by using partial URL properties as shown in the attached screen shot.

Let me know if you need further assistance with this problem.

All the best,
Cody
the Telerik team

[Corey]

Hey Cody,

Correct, the ID of the iframe element is generated dynamically. I will take a look at the KB article!

I knew I could use a tilde for a partial URL, but I didn't realize I could do so in the Id field. That did the trick and now my tests run successfully, and repeatedly! 

The only thing that I have issue with now is adding steps to tests. If I Run to Step, then begin recording and choose additional elements on the same iframe as previously adjusted (though, new browser, new session, technically new iframe with dynamically generated ID), still a new iframe element is added to the Element List and classes/members generated in Pages. Is there a way to consolidate the members/properties from the newly recorded iframe(s) to under the original iframe element?

Thanks for your assistance. I'm unblocked now!

//corey

[Cody]

Hi Corey,

Yes, it is true if you record additional steps another Frame node will be added to Elements Explorer. If you change the properties of the new Frame node when you're finished, Test Studio will automatically merge them under one Frame node for you again.

Regards,
Cody
the Telerik team