How do I add a JQuery locators to Selenium Remote Control

Question

I've been using XPath with Selenium quite happily and even using getEval with a but of Javascript, but a colleague said wouldn't it be great to be able to use JQuery selectors in Selenium.

I've googled it, but can't find any articles that seem to work for me. Could anyone provide a comprehensive guide on how to use JQuery syntax to extract doc elements and their respective values out of selenium.

I'm using C# to write my selenium tests, so if any examples could be from a C# perspective that'd be great.

Thanks

Answer 1

Karl Swedberg wrote an excellent blog entry about it which can be found at http://www.learningjquery.com/2009/04/better-stronger-safer-jquerify-bookmarklet

We adapted this and basically in the Selenium Server jar file we modified RemoteRunner.html to include the jquery JavaScript (obtained from http://code.jquery.com/jquery-latest.min.js):

        <script language="JavaScript" type="text/javascript" src="jquery.min.js"></script>
        <script language="JavaScript" type="text/javascript">
            function openDomViewer() {
                var autFrame = document.getElementById('selenium_myiframe');
                var autFrameDocument = new SeleniumFrame(autFrame).getDocument();
                this.rootDocument = autFrameDocument;
                var domViewer = window.open(getDocumentBase(document) + 'domviewer/domviewer.html');
                return false;
            }
        </script>

Then to enable this for use in Selenium we add the location strategy:

mySelenium.addLocationStrategy("jquery",
            "var loc = locator; " +
            "var attr = null; " +
            "var isattr = false; " +
            "var inx = locator.lastIndexOf('@'); " +

            "if (inx != -1){ " +
            "   loc = locator.substring(0, inx); " +
            "   attr = locator.substring(inx + 1); " +
            "   isattr = true; " +
            "} " +

            "var found = jQuery(inDocument).find(loc); " +
            "if (found.length >= 1) { " +
            "   if (isattr) { " +
            "       return found[0].getAttribute(attr); " +
            "   } else { " +
            "       return found[0]; " +
            "   } " +
            "} else { " +
            "   return null; " +
            "}"
        );

Note the above addition of locator strategy is in Java but its just a string so should be easily replicated in C#. JQuery does make things a lot faster, especially in Internet Explorer!

To modify the jar you can use the java command line tool to update the downloaded selenium server jar. Make a folder at the same level as the jar called "core" and put the modified RemoteRunner.html and jquery.min.js files there. Then run something like:

jar -uf selenium-server-standalone-2.0b3-APT.jar core\RemoteRunner.html
jar -uf selenium-server-standalone-2.0b3-APT.jar core\jquery.min.js

If jar isn't in your path you can use the full path, for example on windows you could execute it with something like:

"C:\Program Files\Java\jdk1.6.0_22\bin\jar.exe" <arguments>