I'm trying to get some information about the click event on the legend of a series. The problem is that attributes like shiftKey are undefined in legendItemClick but this doesn't happen in click event when you click directly on a series in the chart.
I found this old issue (2012) talking exactly about this problem and it seems to be fixed, I even looked at the source code I'm using (Highstock 2.0.3) and the fix is there:
// Pass over the click/touch event. #4.
event = {
browserEvent: event
};
// click the name or symbol
if (item.firePointEvent) { // point
item.firePointEvent(strLegendItemClick, event, fnLegendItemClick);
} else {
fireEvent(item, strLegendItemClick, event, fnLegendItemClick);
}
But I'm still having this issue. here is a jsfiddle showing this, as you can see in the dialog, shiftKey is undefined. Have any of you experienced this?
Solved! It seems that the fix introduces a different usage so instead of using event.shiftKey like in click event I have to use event.browserEvent.shiftKey and solved!
Related
I am having a scenario to click on a svg element, tried the following code, it is not throwing any error. it is clicking but the element state is not changed. tried force click also.
cy.xpath("(//app-job[contains(#class,'selected')]//highcharts-chart[#id='GMF_K_CHART']//*[name()='svg']//*[name()='g' and #class='highcharts-series-group']//*[name()='g' and #clip-path='none' and not(#visibility)])[4]//*[name()='path'][4]")
.click()
Graph how displaying after clcik
But it should be if clicked properly
I tried multiple combination of clicks
`.click({force: true})
.click()
.trigger('change')
.trigger('focus')
.click()`
Please make sure that you're selecting the svg element and then, use trigger() to click on that element.
cy.get('<svg element>').trigger('click')
It seems that cypress expects that click is preceded by mouse hover. In that case, make sure that cypress hovers the mouse over the point (the tooltip must fire) and then let the cypress perform a click event on the point.
cy.get(".highcharts-container")
.get(".highcharts-point")
.eq(1)
.trigger("mousemove");
cy.wait(1000);
cy.get(".highcharts-container")
.get(".highcharts-point")
.eq(1)
.trigger("click");
If that didn't work, it would be possible that some cypress event is not correctly triggered; in that case try the following workaround:
cy.get(".highcharts-container")
.get(".highcharts-point")
.eq(1)
.trigger("mousemove").trigger("mousemove");
cy.wait(1000);
cy.get(".highcharts-container")
.get(".highcharts-point")
.eq(1)
.trigger("click").trigger("click");
In my OSX Electron app I have a tray icon that I would like to toggle between opening and closing the Electron app window. Similar to how clicking on the OSX Dropbox tray icon will open and close the Dropbox tray menu, no matter how fast you click the tray icon.
Here is the code I'm using:
tray.on('click', function(e){
if (mainWindow.isVisible()) {
mainWindow.hide()
} else {
mainWindow.show()
}
});
This works if you click slowly (wait a second between clicks) however if you click repeatedly, more than 1x in a second, the click fails and nothing happens. I couldn't find any type of delays in the docs. Any ideas on what's going on and how to make the click event work reliably?
The problem you're describing is easy to reproduce. The result you're getting is not a bug or a wrong implementation on your side but it's the expected result regarding the current way Electron is handling these click events on a tray element.
The class Tray exposes 3 events relative to click: click, double-click and right-click.
If you use the right-click event, you're not going to have this issue, you can click as fast as you want, you'll get your callback called every times.
The Electron code for macOS for example to handle this event is the following:
- (void)rightMouseUp:(NSEvent*)event {
trayIcon_->NotifyRightClicked(
[self getBoundsFromEvent:event],
ui::EventFlagsFromModifiers([event modifierFlags]));
}
For every right click, they're firing the right-click event and that's it.
Now if we take a look at how the left click are handled, the code is slightly different:
- (void)mouseUp:(NSEvent*)event {
// ...
// Truncated to only show the relevant part...
// ...
// Single click event.
if (event.clickCount == 1)
trayIcon_->NotifyClicked(
[self getBoundsFromEvent:event],
ui::EventFlagsFromModifiers([event modifierFlags]));
// Double click event.
if (event.clickCount == 2)
trayIcon_->NotifyDoubleClicked(
[self getBoundsFromEvent:event],
ui::EventFlagsFromModifiers([event modifierFlags]));
[self setNeedsDisplay:YES];
}
When the tray icon get clicked multiple times, the event.clickCount doesn't always return 1. Instead, it returns a value that counts the clicked times.
So when you're click the tray icon very fast, event.clickCount will have a value greater than 2 and they're only emitting an event when the value is 1 or 2 and if it's not the case, they don't have any fallback, they simply don't emit any event. That's the result you're seeing in your tests when clicking fast enough.
So without modifying the Electron implementation yourself, submitting an issue or a pull request, you can't at the moment avoid this behaviour.
Electron 3.0 introduced an API that prevents waiting for double-click.
// Ignore double click events for the tray icon
tray.setIgnoreDoubleClickEvents(true)
"Sets the option to ignore double click events. Ignoring these events allows you to detect every individual click of the tray icon. This value is set to false by default."
Related Docs | Release Notes for Electron 3.0
I'm using JQuery Mobile within a PhoneGap IOS App. I'm currently successfully capturing the IOS Keyboard return within a search key as follows.
JS
function blah()
{
if(window.event.keyCode == 13 )
{ do something }
}
HTML
<input type="search" id="searchBox" value="" onblur="dothis()" data-inline="true" onKeyPress="blah();" />
I would like to capture the 'Done' key on the keyboard as well. I cant seem to find any information on this.
Thanks.
Unfortunately, pressing the "Done" key does not fire a keyCode event. So, I can't seem to find a way to detect it either.
I think the only option is to detect the "blur" event on your field. If the event occurs, then fire whatever action you need. Of course, this is only useful if you have a single field. If you have more than one field, using "blur" to be the equivalent of "Go" or "Submit" is useless.
Let us know if you found a better workaround.
I've suggested using the blur event in my original answer. However, I think a better idea is simply to listen for the keyboard hiding - which will happen after the "Done" button is pressed.
window.addEventListener('keyboardDidHide', function () {
// Describe your logic which will be run each time keyboard is closed.
});
https://github.com/cjpearson/cordova-plugin-keyboard#keyboarddidhide
Also, be sure the deregister this listener after you've done whatever you need to do after the keyboard hides. Otherwise, it will fire every time the keyboard hides in other parts of your app.
I have been looking around but I have not found a problem like this.
Gmaps4rails works great for me!
The trouble is when inserted into a JQuery tab. It loads half of the map. It actually looks like is missing pictures. I can move/resize as usual. But only shows a part of the map.
And the part missing is usually the left/bottom part. But the size of the empty part varies all the time.
At the same time, the hand that shows the mouse cursor when hovering the map turns into arrow when hovering this empty part(but this part is still inside the Google container).
If I place the gmaps container out of the JQuery tabs, it works perfectly. Has anyone seen this before?
view
#tabs-4
#gmap
=gmaps("map_options" => { "detect_location" => true, "auto_zoom" => false, "center_on_user" => true, "zoom" => 17},"markers" => { "data" => #json })
Thanks a lot!
See this link http://jqueryui.com/demos/tabs/#...my_slider.2C_Google_Map.2C_sIFR_etc._not_work_when_placed_in_a_hidden_.28inactive.29_tab.3F
But resize is called differently in V3
Try calling google.maps.event.trigger(map, 'resize')
EDIT
Every method I found refers to a change in JavaScript.
Another way I found http://snipplr.com/view/57003/
$('#tabs').tabs({
show: function (event, ui) {
google.maps.event.trigger(map, 'resize');
}
});
Although this question is a year old, it describes exactly what I was experiencing but the accepted answer did not work for me. Here is what finally worked...
$('#tabs').tabs({
activate: function (event, ui) {
var center = Gmaps.map.map.getCenter();
google.maps.event.trigger(map, 'resize');
Gmaps.map.map.setCenter(center);
}
});
Maybe Im using newer versions. I needed to use activate: instead of show: and the map was off center once it expanded to fill the container so the need for the centering code. Hope this saves someone some time!
It's a common problem. You need to ensure that the map size is known to the API (currently it thinks it has zero size).
Trigger the resize event when the map is made visible. From the docs:
Developers should trigger this event on the map when the div changes size: google.maps.event.trigger(map, 'resize')
Ok just a slight modification on the things posted above. If you use the selected answer you might get a bug with the map not being focused correctly. What #SteveO7 said works well. I also had to adjust it a little for bootstrap. Here it is in CoffeeScript:
$('a[data-toggle="tab"]').on 'shown', (e) ->
if $(e.target).attr('href') == '#tab2'
center = Gmaps.map.map.getCenter()
google.maps.event.trigger map, "resize"
Gmaps.map.map.setCenter(center)
I'm using a GRAILS UI (1.2-SNAPSHOT) an it's implementation of the YUI menubar (YUI 2.7.0.1). I am seeing flakey mouseover behavior in IE (Firefox is ok). When I mouse over the menu item with a submenu, it will show. As I try to mouse over the sub-menu, the submenu disappears before I can click. This happends in a pattern I haven't fully figured out. Usually the first time I select a menu it's fine but if I move around the menu back to a menu item, the submenu begins to display this behavior. By clicking and holding the mouse button I can usually get the sub-menu to stick around.
I've palyed with various configurations like keepopen and automenudisplay but they don't seem to change the behavior. I have not seen much posted about this. But I also don't see menu's documented in the UI plugin either. I could really use some feedback if UI menu is not ready for primetime yet or I'm missing something else. I've not worked with much AJAX before.
Below is the code with the added options I played with that did not have a positive impact.
<gui:menubar id='menubar' renderTo='mainmenu' autosubmenudisplay="false" shadow="true" keepopen="true">
<gui:menuitem url="/esmzone">Home</gui:menuitem>
<gui:submenu label='Profile'>
<gui:menuitem url="${createLink(controller:'memberProfile', action:'view')}">View</gui:menuitem>
<gui:menuitem url="${createLink(controller:'memberProfile', action:'profile')}">Edit</gui:menuitem>
<gui:menuitem url="${createLink(controller:'user', action:'account')}">Settings</gui:menuitem>
<gui:menuitem url="#">Subscription</gui:menuitem>
</gui:submenu>
Here is the code generated by the plugin:
<script>
YAHOO.util.Event.onDOMReady(function() {
GRAILSUI.menubar = new YAHOO.widget.MenuBar("menubar_div", {'autosubmenudisplay': false,
'shadow': true,
'keepopen': true});
GRAILSUI.menubar.render('mainmenu');
});
</script>
I made some progress on this by researching the YUI library. There is a documented bug with IE7. Apparently the grails-ui plugin does not address the fix. I'm testing with IE8 but I assume it's still there.
http://developer.yahoo.com/yui/menu/#knownissues
It appears that you should set the zoom property to 1 (zoom:1) for the bd class.
I added the following code to my style sheet
div.yuimenubar .bd {
zoom: 1;
}
and it seems to help. I see no side effect in Firefox but I didn't dynamically check for the version of browser as I would need to hack the code that generates the YUI javascript and put in
if (YAHOO.env.ua.ie === 7) {
YAHOO.util.Dom.addClass(document.body, "ie7");
}
after the render() call. Then instead of the style I added you could do an IE7 (probably >=7) style.
This is what the Yahoo site had to say about it:
The following application of
"zoom:1" sets the "hasLayout"
property to "true" and prevents
first tier submenus of a MenuBar
from hiding when the mouse is moving
from an item in a MenuBar to a
submenu in IE 7.
For more on the "hasLayout" property:
http://msdn.microsoft.com/en-us/library/ms533776(VS.85).aspx