FilteringSelect text alignment - dojo

Using Dojo 1.6.1
I have a FilteringSelect that looks like:
When an address is selected, it looks like:
What I'd really like to see instead is:
Any ideas on how this could be accomplished?

When you select a value in a Filtering select, the caret position is at the end of the text, so it's not CSS that will help you there.
You have to move the cursor to the beginning of the text.
I see no other option than javascript here.
If you look at the template of dijit.form.FilteringSelect, you will see that the input node is bound to the property "focusNode" of the widget. So you could use that to move the caret, like this :
dijit.byId('your_filteringSelect_id').onChange = function(evt) {
this.focusNode.setSelectionRange(0,0);
}

This appears to be an IE & FF issue see this listed bug:
http://bugs.dojotoolkit.org/ticket/8298
and also this test case (issue seen in IE7-9):
http://jsfiddle.net/snover/96Ud8/
The work around suggested is to set the function _setCaretPos to do notthing e.g
dijit.byId('your_filteringSelect_id')._setCaretPos = function() {};

.setSelectionRange doesn't work at IE
Use dijit.selectInputText(widget.focusNode,0,0); instead

Related

How to check input span styled as checkbox is selected using Selenium? Only :: after as the difference between states

I am trying to check whether a checkbox is selected. My checkbox is styled using input and span, not using the checkbox tag. As it's not a default checkbox I can't use methods such as isSelected or isChecked to check its state. I was then trying to check if any class belongs to a state but not the other. However, the only difference I've found so far is that when the element is selected an ::after appears but not sure how to go about checking this?
I found a tutorial with a similar issue, but don't know much about Javascript and not sure how to adapt it to my case.
https://www.quora.com/How-do-I-locate-After-and-Before-css-tag-in-selenium-webdriver
Before clicked
After clicked
That's what is being used and as per #pguardiario answer
System.out.println(js.executeScript("return window.getComputedStyle(document.querySelector('.custom-checkmark'), ':after').getPropertyValue('content')"));
But both when it's selected or not it returns the same output (empty string)
UPDATE
Found the difference between the selected and unselected states. The .custom-checkmark:after style has display-none when the checkbox is not selected.
Not sure still how to use this info as that's what I have at moment and they return display none both before and after the checkbox is clicked.
#Test
public void testingCheckbox() {
JavascriptExecutor js = (JavascriptExecutor) wd;
System.out.println(js.executeScript("return window.getComputedStyle(document.querySelector('.custom-checkmark'), ':after').getPropertyValue('display')"));
lp.clickCheckBox();
System.out.println(js.executeScript("return window.getComputedStyle(document.querySelector('.custom-checkmark'), ':after').getPropertyValue('display')"));
}
NEW FINDING
It seems there's actually 'two checkboxes'. One with the span tag and the other one with the span. They appear together when unselecting some attributes.
Thanks for the help.
I can't test it but it should look something like this:
driver.executeScript('return window.getComputedStyle(document.querySelector(".custom-checkmark"), ":after").getPropertyValue("content")')
Sorry about the long line btw, Java doesn't have heredocs which makes this painful :(
Try use JavascriptExecutor, import them :
import org.openqa.selenium.JavascriptExecutor;
Try this :
WebElement chk = driver.findElement(By.xpath("//*[#class='custom-checkmark' and ./preceding-sibling::*[#id='terms_checkbox']]"));//or you have
String getPro;
getPro = ((JavascriptExecutor)driver).executeScript("return window.getComputedStyle(arguments[0], ':after').getPropertyValue('background-color');",chk).toString();
System.out.println(getPro);
chk.click();
Thread.sleep(1000);
getPro = ((JavascriptExecutor)driver).executeScript("return window.getComputedStyle(arguments[0], ':after').getPropertyValue('background-color');",chk).toString();
System.out.println(getPro);
Not sure with .getPropertyValue('background-color'), but this may be a clue.
Try the below CSS selectors for identifying that
span.custom-checkmark:after
And also please see the below link for more details
Extracting content in :after using XPath
Got the code to work. Targeting the input tag instead of span solved the problem. I had a mistake on my code when tried that first time so that's why though the isSelected field wasn't working and moved on to target the span tag instead which opened this thread here. Sorry about that and thanks for everybody's help.

Remove filter description in enhanced grid dojo

I would like to remove the filter description in dojo enhanced grid.
Here is the image:
The message is part of FilterBar of the plugin Filter. Try getting the filter bar from Filter like
var filterBar = dijit.byId('grid').pluginMgr.getPlugin('filter').filterBar;
Next, the text is set with attach point name as 'statusBarNode'
Once you the attachpoint, you can change the text by using set() method or innerHTML
Hope this helps.

I.click()-selector in CodeceptJS - how to find first button with specific innerHTML

I have various buttons and several buttons with the same name "Start". I need to click on the first found button with this name (innerHTML).
With jQuery this works with :
$('button:contains(Start):first').click()
How does it work with I.click()-Selector in CodeceptJS? I can't find the right syntax and always getting:
"invalid selector: An invalid or illegal selector was specified"
Here is the API for this function: https://github.com/Codeception/CodeceptJS/blob/master/docs/webapi/click.mustache
The only working solution I found is:
I.click('//button[1]');
But this solution is confusing, because you need to know the exactly number in the order of this element - and I have a lot of buttons with different names. Also this not allows me to search by innerHTML such as "Start".
You could use the I.executeScript like this:
I.executeScript("var elements = document.getElementsByName('Start');elements[0].click();"); or
I.executeScript("var elements =
document.querySelector(\"button[name*='Start']\");elements[0].click();");
You need using XPath for that
//button[1][contains(text(), 'Start')]
locate("//button[contains(text(), 'Start')]").first()
or
locate("//button[contains(text(), 'Start')]").at(1)
Works fine.

Remove the lines from a document

Goal:
Display the result without using any line between column and row
Problem:
I can't remove these line
The picture below is taken in preview mode
// Fullmetalboy
In the textbox properties for each cell of the grid, just make sure you set the BorderWidth property to 0.
Due to very limited info in the question maybe try Results-to-text instead of Results-to-grid?
I think that we need more info here... are you showing these results in a HTML page, through some dynamic language (ASP, PHP, Ruby)? or are you using reporting tools like Crystal Dynamics?
If you're doing in HTML, I guess the css rule border-collapse:collapse on the table would do the trick

Simulate TAB keypress event in Selenium RC

I need to simulate a tab keypress in Selenium RC, using the Java API.
I do this after having entered some text using:
selenium.type(input, "mytext");
I've tried 3 alternatives to get the tab working:
selenium.keyPress(input, "\\9");
and:
selenium.focus(input);
selenium.keyPressNative("09");
and even:
selenium.getEval("var evt = window.document.createEvent('KeyboardEvent');evt.initKeyEvent ('keypress', true, true, window,0, 0, 0, 0,0, 9,0);window.document.getElementsByTagName('input')[2].dispatchEvent(evt);")
The best I can get is a "tab space" to be inserted after my text so I end up with this in the input field:
"mytext "
What I actually want is to tab to the next control. Any clues? Thanks!
(Note: I have to use tab and can not use focus or select to chose the element I want to go to, for various reasons, so no suggestions along these lines please!)
selenium.keyPressNative(java.awt.event.KeyEvent.VK_TAB + "");
I don't use the Java API, but this post from google groups suggests it is your solution. I can't imagine that "9" is different from "09" in your question, but give it a try?
Try the official TAB char: \t or \u0009
Some functions may used Onblur. It will trigger the function when the field lose the key focus. here we can use fireEvent with "blur" or "focus" command as follows:
command: fireEvent
target: id=your_field_identification
value: blur
Reference: http://qaselenium.blogspot.com/2011/01/how-to-triger-tab-key-in-selenium.html
Improvising Ryley's answer, we can use
selenium.keyDownNative(java.awt.event.KeyEvent.VK_TAB + "");
selenium.keyUpNative(java.awt.event.KeyEvent.VK_TAB + "");
I tried this method for VK_CONTROL in IE and it worked good.
Use typeKeys():
Quoting the above link:
Unlike the simple "type" command, which forces the specified value into the page directly, this command may or may not have any visible effect, even in cases where typing keys would normally have a visible effect. For example, if you use "typeKeys" on a form element, you may or may not see the results of what you typed in the field.
In some cases, you may need to use the simple "type" command to set the value of the field and then the "typeKeys" command to send the keystroke events corresponding to what you just typed.