I have a problem with the dropdown that developer just upgraded the library AntD 3 to AntD 4. The dropdown list now displays 10 items. If user scrolls down, it will load next 10 items. The current code that I wrote for automation in Java with Selenium does not work. Does anybody help me to fix this case?
Below is the HTML code
<div class="ant-select-dropdown ant-select-dropdown-placement-bottomLeft ant-select-dropdown-hidden" style="min-width: 455px; width: 455px; left: -484px; top: -571px;">
<div>
<div role="listbox" id="credential_type_list" style="height: 0px; width: 0px; overflow: hidden;">
<div aria-label="Financial" role="option" id="credential_type_list_1" aria-selected="false">1</div>
<div aria-label="KPI" role="option" id="credential_type_list_2" aria-selected="false">2</div>
<div aria-label="Royalty" role="option" id="credential_type_list_3" aria-selected="false">3</div>
</div>
<div class="rc-virtual-list" style="position: relative;">
<div class="rc-virtual-list-holder" style="max-height: 256px; overflow-y: hidden; overflow-anchor: none;">
<div style="height: 448px; position: relative; overflow: hidden;">
<div class="rc-virtual-list-holder-inner" style="display: flex; flex-direction: column; transform: translateY(0px); position: absolute; left: 0px; right: 0px; top: 0px;">
<div aria-selected="true" class="ant-select-item ant-select-item-option ant-select-item-option-selected" title="Revenue">
<div class="ant-select-item-option-content">Revenue</div>
<span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
</div>
<div aria-selected="false" class="ant-select-item ant-select-item-option" title="Financial">
<div class="ant-select-item-option-content">Financial</div>
<span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
</div>
<div aria-selected="false" class="ant-select-item ant-select-item-option ant-select-item-option-active" title="KPI">
<div class="ant-select-item-option-content">KPI</div>
<span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
</div>
<div aria-selected="false" class="ant-select-item ant-select-item-option" title="Royalty">
<div class="ant-select-item-option-content">Royalty</div>
<span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
</div>
<div aria-selected="false" class="ant-select-item ant-select-item-option" title="Marketing Fund">
<div class="ant-select-item-option-content">Marketing Fund</div>
<span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
</div>
<div aria-selected="false" class="ant-select-item ant-select-item-option" title="COGS Adjustments">
<div class="ant-select-item-option-content">COGS Adjustments</div>
<span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
</div>
<div aria-selected="false" class="ant-select-item ant-select-item-option" title="Remittance">
<div class="ant-select-item-option-content">Remittance</div>
<span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
</div>
<div aria-selected="false" class="ant-select-item ant-select-item-option" title="Payroll">
<div class="ant-select-item-option-content">Payroll</div>
<span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
</div>
<div aria-selected="false" class="ant-select-item ant-select-item-option" title="Sales Tax (County)">
<div class="ant-select-item-option-content">Sales Tax (County)</div>
<span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
</div>
<div aria-selected="false" class="ant-select-item ant-select-item-option" title="Sales Tax (State)">
<div class="ant-select-item-option-content">Sales Tax (State)</div>
<span class="ant-select-item-option-state" unselectable="on" aria-hidden="true" style="user-select: none;"></span>
</div>
</div>
</div>
</div>
<div class="rc-virtual-list-scrollbar rc-virtual-list-scrollbar-show" style="width: 8px; top: 0px; bottom: 0px; right: 0px; position: absolute; display: none;">
<div class="rc-virtual-list-scrollbar-thumb" style="width: 100%; height: 128px; top: 0px; left: 0px; position: absolute; background: rgba(0, 0, 0, 0.5); border-radius: 99px; cursor: pointer; user-select: none;"></div>
</div>
</div>
</div>
</div>
Related
<div data-component-id="flexipage_reportChart8" data-aura-rendered-by="820:0" class="flexipageComponent" data-aura-class="flexipageComponent" xpath="1">
<article class="slds-card slds-card_boundary forceBaseCard flexipageCard flexipageReportChart" aria-describedby="header_923:0" data-aura-rendered-by="926:0" data-aura-class="forceBaseCard flexipageCard flexipageReportChart">
<div class="slds-card__header slds-grid" data-aura-rendered-by="146:1058;a">
<header class="slds-media slds-media--center slds-has-flexi-truncate" data-aura-rendered-by="148:1058;a">
<!--render facet: 150:1058;a-->
<div class="slds-media__body" data-aura-rendered-by="153:1058;a">
<h2 class="header-title-container" id="header_923:0" data-aura-rendered-by="154:1058;a"><span class="slds-card__header-title slds-truncate" title="More" data-aura-rendered-by="155:1058;a">More</span></h2></div>
</header>
<!--render facet: 157:1058;a-->
</div>
<div class="slds-card__body slds-card__body--inner" data-aura-rendered-by="928:0">
<div class="width_auto analyticsEmbeddedReportChart" data-aura-rendered-by="4:1058;a" data-aura-class="analyticsEmbeddedReportChart">
<!--render facet: 5:1058;a-->
<div class="outerbound" data-aura-rendered-by="10:1058;a">
<div class="chartContainer size_auto" data-aura-rendered-by="11:1058;a">
<!--render facet: 17:1058;a-->
<div class="autoWidth analyticsEmbeddedChart" style="height:300px;" data-aura-rendered-by="25:1058;a" data-aura-class="analyticsEmbeddedChart">
<div class="loadingMask hideLoading" data-aura-rendered-by="26:1058;a">
<div class="loadingPanel" data-aura-rendered-by="27:1058;a"></div><span class="loadingMsg" data-aura-rendered-by="28:1058;a">Loading report chart...</span></div>
<!--render facet: 30:1058;a-->
<!--render facet: 75:1058;a-->
<!--render facet: 82:1058;a-->
<!--render facet: 96:1058;a-->
<div class="eclair-component-container reportsEclairChart" data-aura-rendered-by="106:1058;a" data-aura-class="reportsEclairChart">
<div class="eclair-component-chart ng-cursor-default" data-aura-rendered-by="107:1058;a" data-ngname="chart_5" style="width: 380.844px;">
<div style="position: relative;">
<div style="z-index: 2; position: absolute; overflow: hidden; background-color: rgba(255, 255, 255, 0); width: 380.844px; height: 300px; left: 0px; top: 0px;" class="ps-container" data-ps-id="414c4b20-2e6b-f1a2-2116-7ff0144f88a4">
<div style="width: 381px; height: 300px;"></div>
<div class="ps-scrollbar-x-rail" style="left: 0px; bottom: 3px;">
<div class="ps-scrollbar-x" style="left: 0px; width: 0px;"></div>
</div>
<div class="ps-scrollbar-y-rail" style="top: 0px; right: 3px;">
<div class="ps-scrollbar-y" style="top: 0px; height: 0px;"></div>
</div>
</div>
<canvas class="chart" style="z-index: 1; position: absolute; -webkit-font-smoothing: antialiased; width: 380.844px; height: 300px; left: 0px; top: 0px;" width="571" height="450"></canvas>
<button aria-live="polite" class="reportsEclairChart ng-button assistiveText">Enable Tab Navigation for This Chart<span class="assistiveText">Enable table equivalent for screen reader users</span></button>
</div>
<div data-ngname="legend_chart_5" style="">
<div style="position: relative;">
<div class="ps-container" data-ps-id="1d1e50a4-a66a-2415-9d77-2a3c62481170" style="z-index: 3; position: absolute; overflow: hidden; background-color: rgba(255, 255, 255, 0); width: 124px; height: 88px; left: 254.844px; top: 2px;">
<div style="width: 124.88px; height: 86px;"></div>
<div class="ps-scrollbar-x-rail" style="left: 0px; bottom: 3px;">
<div class="ps-scrollbar-x" style="left: 0px; width: 0px;"></div>
</div>
<div class="ps-scrollbar-y-rail" style="top: 0px; right: 3px;">
<div class="ps-scrollbar-y" style="top: 0px; height: 0px;"></div>
</div>
</div>
<canvas class="legend" style="z-index: 2; position: absolute; -webkit-font-smoothing: antialiased; width: 124px; height: 88px; left: 254.844px; top: 2px;" width="186" height="132"></canvas>
</div>
</div>
<div class="ng-annotations-container" style="margin: 2px; width: 376.844px; height: 296px;"></div>
</div>
<div class="error-div hide" data-aura-rendered-by="108:1058;a"></div><span class="eclair-component-alt-text" data-aura-rendered-by="109:1058;a">Chart: Untitled</span></div>
<!--render facet: 111:1058;a-->
</div>
</div>
</div>
<DIV CLASS="LIGHTNING" DATA-AURA-RENDERED-BY="113:1058;A"><SPAN CLASS="REPORTFOOTER" DATA-AURA-RENDERED-BY="114:1058;A"><BUTTON CLASS="SLDS-BUTTON NAVIGATEBUTTON UIBUTTON" ARIA-LIVE="OFF" TYPE="BUTTON" DATA-AURA-RENDERED-BY="118:1058;A" DATA-AURA-CLASS="UIBUTTON"><!--RENDER FACET: 119:1058;A--><SPAN CLASS=" LABEL BBODY" DIR="LTR" DATA-AURA-RENDERED-BY="121:1058;A">VIEW REPORT</SPAN>
<!--render facet: 123:1058;a-->
</button>
<div class="refreshContainer" data-aura-rendered-by="125:1058;a"><span class="asOfDate" data-aura-rendered-by="128:1058;a">As of Yesterday at 10:15 AM</span>
<button class="slds-button refreshButton uiButton" aria-live="off" type="button" data-aura-rendered-by="137:1058;a" data-aura-class="uiButton">
<!--render facet: 138:1058;a--><span class="assistiveText" data-aura-rendered-by="141:1058;a">Refresh</span>
<lightning-icon class="slds-icon-utility-refresh slds-icon_container" data-data-rendering-service-uid="602" data-aura-rendered-by="135:1058;a">
<lightning-primitive-icon lightning-primitiveicon_primitiveicon-host="">
<svg lightning-primitiveIcon_primitiveIcon="" focusable="false" data-key="refresh" aria-hidden="true" class="slds-icon slds-icon-text-default slds-icon_xx-small">
<use lightning-primitiveIcon_primitiveIcon="" xlink:href="/_slds/icons/utility-sprite/svg/symbols.svg?cache=9.28.0#refresh"></use>
</svg>
</lightning-primitive-icon><span class="slds-assistive-text">Refresh</span></lightning-icon>
</button>
</div>
</span>
</div>
</div>
</div>
<div class="slds-card__footer" data-aura-rendered-by="930:0">
<!--render facet: 931:0-->
</div>
</article>
</div>
I am trying to find a dynamic xpath for a large section of code. When I pull the dynamic xpath from chropath, I receive a very large response, which is too large to include in the test
I've tried trimming the dynamic xpath pulled from chropath but cannot seem to do so. I have capitalized the section of the code that is relevant.
More
Loading report chart...
Enable Tab Navigation for This ChartEnable table equivalent for screen reader users
Chart: Untitled
<!--render facet: 111:1058;a-->
</div>
</div>
</div>
<DIV CLASS="LIGHTNING" DATA-AURA-RENDERED-BY="113:1058;A"><SPAN CLASS="REPORTFOOTER" DATA-AURA-RENDERED-BY="114:1058;A"><BUTTON CLASS="SLDS-BUTTON NAVIGATEBUTTON UIBUTTON" ARIA-LIVE="OFF" TYPE="BUTTON" DATA-AURA-RENDERED-BY="118:1058;A" DATA-AURA-CLASS="UIBUTTON"><!--RENDER FACET: 119:1058;A--><SPAN CLASS=" LABEL BBODY" DIR="LTR" DATA-AURA-RENDERED-BY="121:1058;A">VIEW REPORT</SPAN>
<!--render facet: 123:1058;a-->
</button>
<div class="refreshContainer" data-aura-rendered-by="125:1058;a"><span class="asOfDate" data-aura-rendered-by="128:1058;a">As of Yesterday at 10:15 AM</span>
<button class="slds-button refreshButton uiButton" aria-live="off" type="button" data-aura-rendered-by="137:1058;a" data-aura-class="uiButton">
<!--render facet: 138:1058;a--><span class="assistiveText" data-aura-rendered-by="141:1058;a">Refresh</span>
<lightning-icon class="slds-icon-utility-refresh slds-icon_container" data-data-rendering-service-uid="602" data-aura-rendered-by="135:1058;a">
<lightning-primitive-icon lightning-primitiveicon_primitiveicon-host="">
<svg lightning-primitiveIcon_primitiveIcon="" focusable="false" data-key="refresh" aria-hidden="true" class="slds-icon slds-icon-text-default slds-icon_xx-small">
<use lightning-primitiveIcon_primitiveIcon="" xlink:href="/_slds/icons/utility-sprite/svg/symbols.svg?cache=9.28.0#refresh"></use>
</svg>
</lightning-primitive-icon><span class="slds-assistive-text">Refresh</span></lightning-icon>
</button>
</div>
</span>
</div>
</div>
</div>
<div class="slds-card__footer" data-aura-rendered-by="930:0">
<!--render facet: 931:0-->
</div>
</article>
I need a shorter dynamic xpath
Does this work?
//button[text() = 'VIEW REPORT' or text() = 'view report' or text() = 'View Report']
If there are multiple View Report links showing up in the page, you can choose an item like
(//button[text() = 'view report'])[1]
Hi I am new to selenium via VBA, so I am trying to automate a process by loging into a webpage navigate and get data extracted into the excel file. the problem is after login i am unable to input values in a search box.
Here are the codes i have tried
bot.FindElementById("placeholder-3vgh2").SendKeys "AAA"
bot.FindElementByClass(".public-DraftStyleDefault-block.public-DraftStyleDefault-ltr").SendKeys "AAA"
bot.FindElementByClass("public-DraftStyleDefault-block public-DraftStyleDefault-ltr").SendKeys "AAA"
bot.FindElementByXPath("//*[#data-contents='true']").SendKeys "AAA"
bot.FindElementByXPath("//*[#class='public-DraftStyleDefault-block public-DraftStyleDefault-ltr']").SendKeys "AAA"
bot.FindElementByXPath("//*[#data-offset-key='dtaef-0-0'][2]").SendKeys "AAA"
Here is HTML Code
<div class="db-World-topContent Box-root Box-background--surface Padding-vertical--20">
<div class="Box-root Flex-flex Flex-alignItems--center Flex-justifyContent--spaceBetween">
<div class="db-SearchField db-SearchField--tokenizable">
<div class="db-SearchField-input db-SearchField-input--highlighted">
<div class="DraftEditor-root">
<div class="DraftEditor-editorContainer">
<div aria-describedby="placeholder-3vgh2" class="notranslate public-DraftEditor-content" contenteditable="true" role="textbox" spellcheck="false" style="outline: none; user-select: text; white-space: pre-wrap; word-wrap: break-word;">
<div data-contents="true">
<div class="" data-block="true" data-editor="3vgh2" data-offset-key="dtaef-0-0">
<div data-offset-key="dtaef-0-0" class="public-DraftStyleDefault-block public-DraftStyleDefault-ltr"><span class="db-SearchField-token" data-offset-key="dtaef-0-0"><span data-offset-key="dtaef-0-0"><span data-text="true">is:</span></span>
</span>
</div>
</div>
</div>
</div>
</div>
</div><span></span><span></span></div><span></span></div>
<div class="Box-root">
<div class="Box-root Flex-flex Flex-alignItems--center Flex-direction--row Flex-justifyContent--flexStart" style="margin-left: -12px;">
<div class="Box-root Box-hideIfEmpty Margin-left--12"></div>
<div class="Box-root Box-hideIfEmpty Margin-left--12">
<div class="Box-root Padding-right--8">
<div class="db-FeedbackInput-container Card-root Card-shadow--small">
<div class="db-FeedbackInput-box Box-root Box-background--offset Padding-horizontal--8 Padding-vertical--4 Flex-flex Flex-alignItems--center">
<div class="Box-root Margin-right--8 Flex-flex"><span class="db-FeedbackInput-defaultIcon"></span></div>
<div class="TruncatedText" style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap;"><span class="Text-color--gray400 Text-fontSize--14 Text-fontWeight--regular Text-lineHeight--20 Text-typeface--base Text-wrap--wrap Text-display--inline"><span>Feedback about this page?</span></span>
</div>
</div>
</div>
</div>
</div>
<div class="Box-root Box-hideIfEmpty Margin-left--12">
<div>
<div class="Box-root Flex-flex">
<div class="Box-root Flex-flex"><button aria-label="Documentation" class="db-DocumentationMenu-root" tabindex="-1"></button></div>
</div>
</div>
</div>
<div class="Box-root Box-hideIfEmpty Margin-left--12">
<div>
<div class="Box-root Flex-flex">
<div class="Box-root Flex-flex">
<div tabindex="-1" style="outline: none;"><button aria-label="Notifications" class="db-Notifications-button"><span class="db-Notifications-icon db-Notifications-icon--empty"></span></button></div>
</div>
</div>
</div>
</div>
<div class="Box-root Box-hideIfEmpty Margin-left--12">
<div>
<div class="Box-root Flex-flex">
<div class="Box-root Flex-flex"><button class="bs-Button bs-DeprecatedButton db-UserMenu" aria-label="User menu" type="button" tabindex="-1"><div class="db-GravatarImage db-UserMenu-image db-GravatarImage--none"></div></button></div>
</div>
</div>
</div>
</div>
</div>
</div><span class="db-World-topContent--left"></span><span class="db-World-topContent--right"></span></div>
Here is the outerHTML of iframe:
<iframe src="https://js.stripe.com/v2/m/outer.html#ping=false" style="width: 1px !important; height: 1px !important; position: absolute !important; left: -10000px !important; top: -1000px !important;"></iframe>
Try, following our debug session:
bot.FindElementByCss(".notranslate.public-DraftEditor-content").SendKeys "AAA"
I am a newbie in selenium webdriver,
I am writing a test case- "Create new account in gmail" unable to select month..
Here is code i used:
driver.findElement(By.id("link-signup")).click();
WebElement element =driver.findElement(By.id("BirthMonth"));
Select mSelection = new Select(element);
mSelection.selectByVisibleText("July");
i am getting error::
Unexpected Tagname exception :Element should have been select but was span
--i didnt find any select tag in html code.. how to resolve this
html code::
<label id="month-label" class="month">
<span id="BirthMonth" class=" " aria-invalid="false">
<div class="goog-inline-block goog-flat-menu-button jfk-select goog-flat-menu-button-hover goog-flat-menu-button-focused" role="listbox" style="-moz-user-select: none;" aria-expanded="false" tabindex="0" aria-haspopup="true" title="" aria-activedescendant=":0">
<div id=":0" class="goog-inline-block goog-flat-menu-button-caption" role="option" aria-setsize="12" aria-posinset="0">Month</div>
<div class="goog-inline-block goog-flat-menu-button-dropdown" aria-hidden="true"/>
</div>
<div class="goog-menu goog-menu-vertical" style="-moz-user-select: none; visibility: visible; left: 0px; top: -107.133px; display: none;" role="listbox" aria-haspopup="true">
<div id=":1" class="goog-menuitem" role="option" style="-moz-user-select: none;">
<div id=":2" class="goog-menuitem" role="option" style="-moz-user-select: none;">
<div id=":3" class="goog-menuitem" role="option" style="-moz-user-select: none;">
<div id=":4" class="goog-menuitem" role="option" style="-moz-user-select: none;">
<div id=":5" class="goog-menuitem" role="option" style="-moz-user-select: none;">
<div id=":6" class="goog-menuitem" role="option" style="-moz-user-select: none;">
<div id=":7" class="goog-menuitem" role="option" style="-moz-user-select: none;">
<div id=":8" class="goog-menuitem" role="option" style="-moz-user-select: none;">
<div id=":9" class="goog-menuitem" role="option" style="-moz-user-select: none;">
<div id=":a" class="goog-menuitem" role="option" style="-moz-user-select: none;">
<div id=":b" class="goog-menuitem" role="option" style="-moz-user-select: none;">
<div id=":c" class="goog-menuitem" role="option" style="-moz-user-select: none;">
</div>
<input id="HiddenBirthMonth" type="hidden" name="BirthMonth"/>
</span>
</label>
--thanks
If you did not find any select tag over there, and you want to select a month: You can click on the month element and select the month.
//Click on the month listbox
driver.findElement(By.xpath(".//*[#id='BirthMonth']/div")).click();
//Select the february month
driver.findElement(By.xpath(".//*[#id=':2']/div")).click();
Every month has different id over there, so you can select the month you want.
You can also get all months over there in a list and select the one you need
List<WebElement> months = driver.findElements(By.xpath("//*[#class='goog-menuitem']"));
for (int i=0; i<months.size(); i++){
if (months.get(i).getText().trim().equals("July"))
months.get(i).click();
}
Above code will select July from the list
How can I add 2 more rows to the JSSOR tiled menu slider? Thank you.
Given a slide defined as follows, you will see all content in a slide is fully customizable. To define 4 rows instead of 2 rows, you can edit css.
<div>
<a class=appicon01 style="left: 0px; top: 0px; background-position:0px 0px;" href="#">
<div class=appiconcb></div>
<div class=appiconc>Menu Item 01</div>
</a>
<a class=appicon01 style="left: 160px; top: 0px; background-position:-160px 0px;" href="#">
<div class=appiconcb></div>
<div class=appiconc>Menu Item 02</div>
</a>
<a class=appicon01 style="left: 320px; top: 0px; background-position:-320px 0px;" href="#">
<div class=appiconcb></div>
<div class=appiconc>Menu Item 03</div>
</a>
<a class=appicon01 style="left: 480px; top: 0px; background-position:-480px 0px;" href="#">
<div class=appiconcb></div>
<div class=appiconc>Menu Item 04</div>
</a>
<a class=appicon01 style="left: 640px; top: 0px; background-position:-640px 0px;" href="#">
<div class=appiconcb></div>
<div class=appiconc>Menu Item 05</div>
</a>
<a class=appicon01 style="left: 0px; top: 160px; background-position:0px -160px;" href="#">
<div class=appiconcb></div>
<div class=appiconc>Menu Item 06</div>
</a>
<a class=appicon01 style="left: 160px; top: 160px; background-position:-160px -160px;" href="#">
<div class=appiconcb></div>
<div class=appiconc>Menu Item 07</div>
</a>
<a class=appicon01 style="left: 320px; top: 160px; background-position:-320px -160px;" href="#">
<div class=appiconcb></div>
<div class=appiconc>Menu Item 08</div>
</a>
<a class=appicon01 style="left: 480px; top: 160px; background-position:-480px -160px;" href="#">
<div class=appiconcb></div>
<div class=appiconc>Menu Item 09</div>
</a>
<a class=appicon01 style="left: 640px; top: 160px; background-position:-640px -160px;" href="#">
<div class=appiconcb></div>
<div class=appiconc>Menu Item 10</div>
</a>
</div>
I am using the following code, in order to display a Menu with the right click (In Selenium context menu).
# encoding: utf-8
require 'watir-webdriver'
b = Watir::Browser.new
b.goto 'localhost:8080/swbadmin'
b.text_field(:name => 'wb_username').set 'admin'
b.text_field(:name => 'wb_password').set 'webbuilder'
b.button(:text => 'Login').click
a = b.div(:class => 'dijitTreeNodeContainer').div(:class => 'dijitTreeIsRoot').div(:class => 'dijitTreeRow').span(:class => 'dijitTreeContent')
c= a.span(:text => 'tst')
c.right_click
The thing is that dijitTreeNodeContainer is made by a dojo. So i have to wait until it loads all the information, I tried to use Watir::wait.until{ span(:text => 'tst').visible ?} but it dindn't work.
With this code without the line
c= a.span(:text => 'tst')
and with c.click, I'm able to click the default TreeContent, but when I try with right click or double_click, it throws an exception ( ..cannot preform native interactions...)
This is the html code
<div id="dijit_layout_AccordionPane_0" class="dijitContentPane dijitAccordionContainer-child dijitAccordionContainer-dijitContentPane dijitContentPaneSingleChild" selected="true" dojotype="dijit.layout.AccordionPane" widgetid="dijit_layout_AccordionPane_0" title="" style="width: 238px; height: 76.5px;">
<div url="/swbadmin/jsp/Tree.jsp?id=mtree" jsid="mtreeStore" dojotype="dojo.data.ItemFileWriteStore"></div>
<div childrenattrs="children" rootid="root" store="mtreeStore" jsid="mtreeModel" dojotype="dijit.tree.ForestStoreModel"></div>
<div id="mtree" class="dojoDndSource dojoDndTarget dojoDndContainer dijitTree" role="presentation" widgetid="mtree" tabindex="0" _dijitmenumtreemenu="1" style="width: 238px; height: 76.5px;">
<div class="dijitInline dijitTreeIndent" data-dojo-attach-point="indentDetector" style="position: absolute; top: -9999px"></div>
<div class="dijitTreeExpando dijitTreeExpandoLoading" data-dojo-attach-point="rootLoadingIndicator" style="display: none;"></div>
<div class="dijitTreeContainer" role="presentation" data-dojo-attach-point="containerNode" style="width: 100%;">
<div id="dijit__TreeNode_0" class="dijitTreeIsRoot dijitTreeNode dijitTreeNodeLoaded dijitLoaded" role="presentation" style="background-position: 0px 0px;" widgetid="dijit__TreeNode_0">
<div class="dijitTreeRow" role="presentation" data-dojo-attach-point="rowNode" style="padding-left: 0px; display: none;">
<div class="dijitTreeNodeContainer" style="height: auto;" role="tree" data-dojo-attach-point="containerNode" aria-expanded="true" aria-multiselectable="true">
<div id="dijit__TreeNode_3" class="dijitTreeIsRoot dijitTreeNode dijitTreeNodeNotLoaded dijitNotLoaded" role="presentation" style="background-position: 0px 0px;" widgetid="dijit__TreeNode_3">
<div class="dijitTreeRow dijitTreeRowSelected" role="presentation" data-dojo-attach-point="rowNode" title="" style="padding-left: 0px;">
<span class="dijitInline dijitTreeExpando dijitTreeExpandoClosed" role="presentation" data-dojo-attach-point="expandoNode"></span>
<span class="dijitExpandoText" role="presentation" data-dojo-attach-point="expandoNodeText">+</span>
<span class="dijitTreeContent" role="presentation" data-dojo-attach-point="contentNode">
<span class="dijitInline dijitIcon dijitTreeIcon swbIconWebSite" data-dojo-attach-point="iconNode" role="presentation"></span>
<span class="dijitTreeLabel" aria-selected="true" tabindex="-1" role="treeitem" data-dojo-attach-point="labelNode,focusNode" aria-expanded="false">Demo</span>
</span>
</div>
<div class="dijitTreeNodeContainer" style="display: none;" role="presentation" data-dojo-attach-point="containerNode"></div>
</div>
<div id="dijit__TreeNode_4" class="dijitTreeIsRoot dijitTreeNode dijitTreeNodeLoaded dijitLoaded" role="presentation" style="background-position: 0px 0px;" widgetid="dijit__TreeNode_4">
<div class="dijitTreeRow" role="presentation" data-dojo-attach-point="rowNode" title="" style="padding-left: 0px;">
<span class="dijitInline dijitTreeExpando dijitTreeExpandoClosed" role="presentation" data-dojo-attach-point="expandoNode"></span>
<span class="dijitExpandoText" role="presentation" data-dojo-attach-point="expandoNodeText">+</span>
<span class="dijitTreeContent" role="presentation" data-dojo-attach-point="contentNode">
<span class="dijitInline dijitIcon dijitTreeIcon swbIconWebSiteU" data-dojo-attach-point="iconNode" role="presentation"></span>
<span class="dijitTreeLabel" aria-selected="false" tabindex="-1" role="treeitem" data-dojo-attach-point="labelNode,focusNode" aria-expanded="false">tst</span>
</span>
</div>
<div class="dijitTreeNodeContainer" style="height: auto; display: none;" role="group" data-dojo-attach-point="containerNode">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
You didn't mention which browser you're using - is it Firefox on Windows? In that case try spawning Chrome instead:
b = Watir::Browser.new :chrome
If you have to stick with Firefox, try disabling native events.
profile = Selenium::WebDriver::Firefox::Profile.new
profile.native_events = false
b = Watir::Browser.new :firefox, :profile => profile