Hi Jian,

EXT-JS uses css heavily and I am trying to figure out what locators to use:
XPath or jQuery.

For example a panel is a DIV with  class="x-panel"

but if hidden it looks like this: class="x-panel x-hide-display"

I used XPath so far but looks like I'd have to use contains (to look for
individual CSS classes) which might be very slow given how many things will
need to be looked up this way...

Is jQuery support as powerful as XPath?
I used jQuery before but don't quite draw a clear parallel to XPath in the
context of Tellurium.

Thoughts?
A snipped to EXT-JS generated html at the end...

Many thanks,
Nick



<div style="position: absolute; z-index: 9053; visibility: visible; left:
0px; top: 0px; width: 1126px; display: block;"
     id="mainWindow" class="x-window">
    <div class="x-window-tl">
        <div class="x-window-tr">
            <div class="x-window-tc">
                <div style="-moz-user-select: none;" id="ext-gen962"
class="x-window-header x-unselectable"><span
                        id="ext-gen989" class="x-window-header-text">Time
Entry</span></div>
            </div>
        </div>
    </div>
    <div id="ext-gen963" class="x-window-bwrap">
        <div class="x-window-ml">
            <div id="ext-gen1760" class="x-window-mr">
                <div id="ext-gen1759" class="x-window-mc">
                    <div id="ext-gen964" class="x-window-tbar">
                        <div id="mainWindow_mainToolbar" class="x-toolbar
x-small-editor">
                            <table cellspacing="0">
                                <tbody>
                                <tr>
                                    <td>
                                        <div id="ext-gen122"
class="gwt-HTML"><span id="namePanelWidget"

style="padding: 2px; color: rgb(255, 255, 255);">   <span
                                                style="font-size: larger;
font-weight: bold;">   Some Name</span>  - May 14, 2009</span>
                                        </div>
                                    </td>
                                    <td id="ext-gen1437" style="width:
100%;">
                                        <div id="ext-gen123"
class="ytb-spacer"></div>
                                    </td>
                                    <td><span id="ext-gen124"
class="ytb-sep"></span></td>
                                    <td id="ext-gen968">
                                        <table style="width: auto;"
id="feedbackButton"
                                               class="x-btn-wrap x-btn
x-btn-text-icon" border="0" cellpadding="0"
                                               cellspacing="0">
                                            <tbody>
                                            <tr>
                                                <td
class="x-btn-left"><i>&nbsp;</i></td>
                                                <td class="x-btn-center"><em
unselectable="on">
                                                    <button id="ext-gen970"
class="x-btn-text feedback-icon"

type="button">Feedback
                                                    </button>
                                                </em></td>
                                                <td
class="x-btn-right"><i>&nbsp;</i></td>
                                            </tr>
                                            </tbody>
                                        </table>
                                    </td>
                                    <td><span id="ext-gen127"
class="ytb-sep"></span></td>
                                    <td id="ext-gen977">
                                        <table style="width: auto;"
id="logoutButton"
                                               class="x-btn-wrap x-btn
x-btn-text-icon" border="0" cellpadding="0"
                                               cellspacing="0">
                                            <tbody>
                                            <tr>
                                                <td
class="x-btn-left"><i>&nbsp;</i></td>
                                                <td class="x-btn-center"><em
unselectable="on">
                                                    <button id="ext-gen979"
class="x-btn-text cross-icon" type="button">
                                                        Logout
                                                    </button>
                                                </em></td>
                                                <td
class="x-btn-right"><i>&nbsp;</i></td>
                                            </tr>
                                            </tbody>
                                        </table>
                                    </td>
                                </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                    <div style="width: 1112px; height: 562px;"
id="ext-gen965" class="x-window-body">
                        <div style="width: 1112px;"
id="mainWindow_desktopPanel" class="x-panel">
                            <div id="ext-gen991" class="x-panel-bwrap">
                                <div style="width: 1110px; height: 560px;"
id="ext-gen992"
                                     class="x-panel-body
x-panel-body-noheader">
                                    <div style="width: 1110px;"
id="mainWindow_mainPanel" class="x-panel">
                                        <div id="ext-gen993"
class="x-panel-bwrap">
                                            <div style="width: 1108px;
height: 558px;" id="ext-gen994"
                                                 class="x-panel-body
x-panel-body-noheader x-border-layout-ct">
                                                <div style="width: 200px;
left: 3px; top: 3px;"

id="mainWindow_westPanel" class="x-panel x-border-panel">
                                                    <div
style="-moz-user-select: none;" id="ext-gen1075"

class="x-panel-header x-unselectable">
                                                        <div
id="ext-gen1079"
                                                             class="x-tool
x-tool-toggle x-tool-collapse-west">
                                                            &nbsp;</div>
                                                        <span
id="ext-gen1083" class="x-panel-header-text"> </span>
                                                    </div>
                                                    <div id="ext-gen1076"
class="x-panel-bwrap">
...

--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups 
"tellurium-users" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to 
[email protected]
For more options, visit this group at 
http://groups.google.com/group/tellurium-users?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to