Drop in dataTransfer not working in cypress( drag is fine) - cypress

I have a scenario where I need to drag an item from one listbox to another. When I tried with dataTransfer, I could see the item is removed from the listbox1 but it is not dropping it in listbox2. I could also see it has identified the place to drop the item too. but it is not able to drop it over there. Any suggestions? I am using cypress version 4.1.2. I tried the following steps:
const dataTransfer = new DataTransfer();
cy.get('#draggable:nth-child(1)').trigger("dragstart", {dataTransfer});(This works)
cy.get('#droppable:nth-child(1)').trigger("dragover"); (This works)
cy.get('#droppable:nth-child(1)').trigger("drop", {dataTransfer});(This doesn't work!)

You have an extra : in the last selector, is that a typo or does it resolve your problem?
cy.get('#draggable:nth-child(1)').trigger("dragstart", {dataTransfer});
cy.get('#droppable:nth-child(1)').trigger("dragover");
cy.get('#droppable:nth-child(1)').trigger("drop", {dataTransfer});

Related

How to select a specific element inside editor (tinymce 4.x)

I have an image inside the editor using plugin 'imagetools' and added an additional image operation on it (that works fine). After this custom operation is done I'm loosing the selection of the image, that I try to select again.
Since the image is initally selected I would have the chance to capture some information to select it again after custom image operation. But whatever I try it doesn't work:
Before operation (while the image is selected by user):
var node = tinymce.activeEditor.selection.getNode();
After operation:
tinyMCE.activeEditor.dom.select(node);
-> nothing selected
tinyMCE.activeEditor.selection.select(node);
-> Error: Argument 1 ('refNode') to Range.setStart must be an instance of Node
I assume the solution is pretty simple. I just don't get it and tinymce documentation is not really helpful on this.
Found it: You can set a bookmark before doing any changes on or inside the element:
var bookmark = tinymce.activeEditor.selection.getBookmark();
After element processing you set back the bookmark:
tinymce.activeEditor.selection.moveToBookmark(bookmark);
Now your previously selected element should will be selected again.

ListMultiplechoice wicket behaving differently when selecting list from bottom to top

I have a ListMultipleChoice which has a Ajax Behavior. When I try to select the list using (Shift + DownArrow), it's not letting me select more than 10 rows. It's just moving up after reaching 10 selections. Whereas, when I select from bottom to top, it's letting me select properly. I know it sounds weird, but that's what this is. Can someone help me with this issue.
Code from comment:
users = new ListMultipleChoice<User>("userList", new PropertyModel<List<User>>( this, "userList"), userModel, new FrUserChoiceRenderer());
Try it on different browsers and see what happens. What does this AjaxEventBehavior do exactly? Does it work without this AjaxEventBehavior? Does it work with a plain html <select> list? What have you tried yourself? Show some code.

wysihtml5 - setting a value won't work, because 'sandbox iframe isn't loaded yet'

I'm just working on a little webservice. Therefore I am using an AJAX call and append my data to a table on my website. Here I can read and update already existing entries or write new entries. Everything works fine.
I want to have the possibility to update already existing with the wysihtml5 editor. I already integrated this editor on my website and I can use it on new entries. That works, too.
But now there's the problem with existing data. When it comes to the form to update data, I want the existing data being displayed as the value. Everything works fine on all inputs, just the wysihtml5 don't work.
I already know that there's an iframe and that's why I can't set the value of the textarea. I searched for a solution and found the following code (last line):
var editor = new wysihtml5.Editor("textareaid", { // id of textarea element
toolbar: "wysihtml5-toolbar", // id of toolbar element
parserRules: wysihtml5ParserRules, // defined in parser rules set
});
editor.setValue('Here's the content', true);
Usually this should work, but no content appears and the console just tells me:
Error: wysihtml5.Sandbox: Sandbox iframe isn't loaded yet
I tried it with a timeout-function but nothing works. Searching on the internet it also seems that there is noone else with that problem. I hope you can help me out, would be great!
Is there a way to set the value?
This code work for me
$("#product_details").data("wysihtml5").editor.getValue();// to get the value
$("#product_details").data("wysihtml5").editor.setValue('new content')// to set the value
I got the solutions, below code worked for me
$('#id ~ iframe').contents().find('.wysihtml5-editor').html(my_html);
This work for me
$('.wysihtml5-sandbox').contents().find('.wysihtml5-editor').html(my_html);
the ".wysihtml5-sandbox" is a class name of iframe, create by wysihtml5 by default.
I finally got it working by myself. I just change the second parameter of setValue to false. I don't know why, but it works then.
this code worked for me :
var wysihtml5Editor = $('#text_editor').data("wysihtml5").editor;
wysihtml5Editor.setValue("<p>foobar</p>", true);
console.log(wysihtml5Editor.getValue());

Selenium WebDriver - Unable to close select drop down menu in Chrome on Mac OS X

I have been Working with Selenium WebDriver for a few months now and I have a problem with a drop down menu within a web app that I am working on.
What is happening is that the test is opening the page, verifying several elements on the page by finding them and then ensuring they are displayed.
After doing that there is some text entered into different fields, then the option select box is clicked on to open the drop down menu.
Following this the test iterates through all the options in the drop down menu until it finds the one it needs, then clicks on that option.
At this point the option is selected but the drop down menu is not closed.
I have tried clicking on the option select again but this has no effect, during the rest of the test other pages are navigated to and the menu does not close.
Then the page is saved and then navigated away from.
However the drop down menu remains until the browser is closed.
This is the code from the app:
<select id="options" name="options" class="options">
<option value="option1 (auto)">option1 (auto)</option>
<option value="option2">option2</option>
<option value="option3">option3</option>
</select>
the first solution I would try is to click on menu options in different ways. Selenium API provides us with this possibility.
1) locate e.g. css selectors of the elements.
String cssOption1 = "select[id='options']>option[value='option1 (auto)']";
String cssOption2 = "select[id='options']>option[value='option2']";
String cssOption3 = "select[id='options']>option[value='option3']";
Also don't forget to verify that you found elements properly e.g .in firepath, firebug addon in ffox:
approach 1
driver.findElement(By.cssSelector(cssOption2)).click();
approach 2 using actions builder API
WebElement mnuOptionElement;
mnuOptionElement = driver.findElement(By.cssSelector(cssOption2));
Actions builder = new Actions(driver);
// Move cursor to the Main Menu Element
builder.moveToElement(mnuOptionElement).click();
more info about Actions builder you can get here
approach 3 using jsExecutor to click on web element. Always works for me in all situations.
JavascriptExecutor js = (JavascriptExecutor) driver;
StringBuilder stringBuilder = new StringBuilder();
stringBuilder.append("var x = $(\'"+cssOption2+"\');");
stringBuilder.append("x.click();");
js.executeScript(stringBuilder.toString());
Hope this works for you
I have solved the problem with a work around, as this is the only way that I have found to work.
Firstly thank you eugene.polschikov for your answer although it didn't solve the problem it did open my eye somewhat, I had no knowledge of action builder, and it has given me some great ideas about future tests.
Also thank you to anyone who read this and pondered over a possible solution.
The workaround that is now in place is that the select is not opened.
The way the code works is that it would open the list and find the one it wanted and click on it, at this point the select wouldn't close, so now the code no longer opens the select in the first place, it clicks on the hidden option to select it, not 100% what i wanted, but it works.
Happy Programming,
Ben.
If a human can press Escape to exit the combobox, you can do that in Selenium by switching to the active element:
from selenium.webdriver.common.keys import Keys
element = driver.switch_to.active_element
element.send_keys(Keys.ESCAPE)

JqGrid multi select list always has first option selected in edit mode with IE7/8

The grid (v4.3.1) selects the correct values in the drop down when going into edit mode.
However, there seem to be an issue with IE 7 and IE 8, which automatically select the first item, along with the other values that also should get selected.
Have anyone stumbled upon this with IE7/8?
While studying the source for jqgrid I also saw a commented line that actually would fix this issue. It was commented in this changeset and fixed another issue, as Oleg commented. Haven't yet found out what that issue was though.
I examined the described problem and can confirm, that it's a bug in jqGrid. So +1 for you in any way.
The line
//if(i===0) { this.selected = ""; }
was commented after the fix which you referenced was made based on the problem with single selected selects. See the post. So I can suggest two ways to fix the problem:
1) replace the above comment to the following lines
// fix IE8/IE7 problem with selecting of the first item on multiple=true
if (i === 0 && elem.multiple) { this.selected = false; }
2) add instead of that after the $("option",elem).each(function(i){...}) the lines
// fix IE8/IE7 problem with selecting of the first item on multiple=true
var $first = $("option:first",elem);
if($.inArray($.trim($first.text()),ovm) < 0 && $.inArray($.trim($first.val()),ovm) < 0 ) {
$first[0].selected = false;
}
I am not sure which bug fixing is the most safe.
The demo can be used to reproduce the bug. One can use IE9, start Developer Tools with F12, choose IE8 as the "Browser mode" and choose "IE Standards" as the "Document Mode". After all one can select item "SM000237" in the grid and verify that "Accounting free" item are selected together with "Bank Fees" instead of selecting only the "Bank Fees".
The first and the second demos both fixes the bug and use the described above fixes.

Resources