Hi there,

I try to find out how to do surface-Tests of an GXT-application. This is a quiete complexe task cause GXT-Components are complexe themselfes.

Lets take a simple text-button. he created HTML looks like this:

Code:
<div class="KNWSOK-com-sencha-gxt-core-client-resources-CommonStyles-CommonStylesDefaultAppearance-CommonDefaultStyles-inlineBlock KNWSANC-kn-webstd-sample-shop-client-resources-IShopCssResource-productSearchFilterSearchButton KNWSFL-com-sencha-gxt-core-client-resources-CommonStyles-CommonStylesDefaultAppearance-CommonDefaultStyles-unselectable" __gwtcellbasedwidgetimpldispatchingfocus="true" __gwtcellbasedwidgetimpldispatchingblur="true" id="applyFilterButtonId" style="position: absolute; margin: 0px; left: 300px; top: 0px;">
  <div style="" class="KNWSHN-com-sencha-gxt-theme-base-client-button-ButtonCellDefaultAppearance-ButtonCellStyle-button KNWSDO-com-sencha-gxt-theme-base-client-button-ButtonCellDefaultAppearance-ButtonCellStyle-small">
    <table cellspacing="0" cellpadding="0" tabindex="0" style="" class="KNWSJ2-com-sencha-gxt-theme-base-client-frame-TableFrame-TableFrameStyle-frame KNWSPK-com-sencha-gxt-core-client-resources-CommonStyles-CommonStylesDefaultAppearance-CommonDefaultStyles-noFocusOutline" hidefocus="-1">
      <tbody>
        <tr>
          <td class="KNWSP2-com-sencha-gxt-theme-base-client-frame-TableFrame-TableFrameStyle-topLeft"></td>
          <td class="KNWSO2-com-sencha-gxt-theme-base-client-frame-TableFrame-TableFrameStyle-top"></td>
          <td class="KNWSA3-com-sencha-gxt-theme-base-client-frame-TableFrame-TableFrameStyle-topRight"></td>
        </tr>
        <tr>
          <td class="KNWSK2-com-sencha-gxt-theme-base-client-frame-TableFrame-TableFrameStyle-left">
            <div>
            </div></td>
          <td class="KNWSH2-com-sencha-gxt-theme-base-client-frame-TableFrame-TableFrameStyle-contentArea">
            <div class="KNWSG2-com-sencha-gxt-theme-base-client-frame-TableFrame-TableFrameStyle-content">
              <div class=" KNWSBO-com-sencha-gxt-theme-base-client-button-ButtonCellDefaultAppearance-ButtonCellStyle-noIcon">
                <table cellspacing="0" cellpadding="0" class="KNWSPN-com-sencha-gxt-theme-base-client-button-ButtonCellDefaultAppearance-ButtonCellStyle-mainTable">
                  <tbody>
                    <tr>
                      <td valign="middle" style="">
                        <div class="KNWSGO-com-sencha-gxt-theme-base-client-button-ButtonCellDefaultAppearance-ButtonCellStyle-text">Suchen
                        </div></td>
                    </tr>
                  </tbody>
                </table>
              </div>
            </div></td>
          <td class="KNWSN2-com-sencha-gxt-theme-base-client-frame-TableFrame-TableFrameStyle-right">
            <div>
            </div></td>
        </tr>
        <tr>
          <td class="KNWSE2-com-sencha-gxt-theme-base-client-frame-TableFrame-TableFrameStyle-bottomLeft"></td>
          <td class="KNWSD2-com-sencha-gxt-theme-base-client-frame-TableFrame-TableFrameStyle-bottom"></td>
          <td class="KNWSF2-com-sencha-gxt-theme-base-client-frame-TableFrame-TableFrameStyle-bottomRight"></td>
        </tr>
      </tbody>
    </table>
  </div>
</div>
I gave the button an id, so I can address the component at top-level. Under that element there are a lot of children with quite cryptic classnames.

For that special button I found out that when the classname
Code:
KNWSFL-com-sencha-gxt-core-client-resources-CommonStyles-CommonStylesDefaultAppearance-CommonDefaultStyles-unselectable
is available on top-level, the button is disabled.

But how stable is that classname? Is that name used for this button for that build? Or does this classname always and for alle buttons indicate that they are disabled? Maybe for all components?

So my questions are:
  • Are all the classnames set for an element under the top-level element stable?
  • Is it possible to set my own classnames to that element under the top-level element?
  • Is there maybe a better approach for surface-testing GXT applications? How should be that done?
Regards,
Michael