Highcharts buttons with different menuitems not working - highcharts

Question

I am trying to create 2 export buttons (share & download) with two different menuItems in HighCharts
Button 1 (Share)
MenuItem 1: Share on Facebook
MenuItem 2: Share on Twitter
Button 2) Download
MenuItem 1: Print
MenuItem 2: Download as PNG
As you can see on http://jsfiddle.net/kmPh8/18/
exporting: {
buttons: [
{
text: 'Download',
x: -82,
symbolFill: '#B5C9DF',
hoverSymbolFill: 'red',
menuItems: [
{
text: 'Print',
onclick: function() {
alert('blue menu 1');
}
},
{
text: 'Download as PNG',
onclick: function() {
alert('blue menu10000');
}
}
]
},
{
text: 'Share',
x: -10,
symbolFill: '#B5C9DF',
hoverSymbolFill: 'blue',
menuItems: [{
text: 'Share on facebook',
onclick: function() {
alert('Facebook Share');
}},
{
text: 'Share on twitter',
onclick: function() {
alert('Twitter share');
}}
]}]
}
But... the problem is whatever button you click first you will see the menuItems on the second button, if you 'run' it again click the other button you will see the problem again. Each button basically doesn't show the individual menuitems.
Any help would be appreciated.

Answer 1

Indeed it looks like a problem, because I've tried to reproduce it here
http://jsfiddle.net/MzB9b/2/ and indeed issue is displayed.
exporting: {
buttons: {
contextButton: {
menuItems: [{
text: 'Export to PNG (small)',
onclick: function() {
alert('EXPORT PNG small');
}
}, {
text: 'Export to PNG (large)',
onclick: function() {
alert('EXPORT PNG large');
},
separator: false
}]
},
testButton: {
symbol: 'diamond',
x: -62,
symbolFill: '#B5C9DF',
hoverSymbolFill: '#779ABF',
_titleKey: 'printButtonTitle',
menuItems: [{
text: 'Facebook',
onclick: function() {
alert('Facebook');
},
}, {
text: 'Twitter',
onclick: function() {
alert('Twitter');
},
separator: false
}]
}
}
}
So I reported this problem to the developers https://github.com/highslide-software/highcharts.com/issues/1908