How to prevent triggering shortcut with simple modifiers when pressing complex shortcut?

[winston0410]

Hi I am trying to implement custom undo and redo in my application, and I have two handlers using use:shortcut

	use:shortcut={{
		trigger: [
			{
				key: 'z',
				modifier: [
					['ctrl', 'shift'],
					['meta', 'shift']
				],
				enabled: true,
				callback: () => {
					// FIXME when hitting the modifier, ctrl+shift+z, it will trigger the ctrl+z callback as well
					logger.debug('redo');
				}
			}
		],
		type: 'keydown'
	}}
	use:shortcut={{
		trigger: [
			{
				key: 'z',
				modifier: [['ctrl'], ['meta']],
				enabled: true,
				callback: () => {
					logger.debug('undo');
				}
			}
		],
		type: 'keydown'
	}}

At the moment I notice that, when I hit ctrl + shift + z on my keyboard, the undo callback which is binded to ctrl + z will be triggered too. Is it a bug or a known limitation with handling keydown event in browser?

[vnphanquang]

Hello @winston0410, good question! In this use case, the key for your "redo" definition should actually be Z (capital) since shift is pressed down. You can try pressing ctrl/meta + shift + Z vs ctrl + z on this site and notice the difference in event.key. Changing z to Z seems to fix your issue.

---

That being said, your question actually prompted me to think about the exclusiveness of multiple overlapping definitions. For example if both ctrl+k and ctrl+alt+k are defined with today's implementation, the callbacks for both will trigger if ctrl+alt+k key combination is pressed. In other words, ctrl+alt+k includes ctrl+k. This might not be what one expects. I will probably publish a patch to fix this soon. Thanks!

[winston0410]

Hi @vnphanquang thank you for coming back to me. I have give the following a try, but the callback is not triggered at all:

	use:shortcut={{
		trigger: [
			{
				key: 'Z',
				modifier: ['ctrl', 'meta'],
				enabled: true,
				callback: () => {
					// FIXME when hitting the modifier, ctrl+shift+z, it will trigger the ctrl+z callback as well
					logger.debug('redo', stack.redo());
				}
			}
		],
		type: 'keydown'
	}}

And I have tried this as well, it does not work too.

	use:shortcut={{
		trigger: [
			{
				key: 'Z',
				modifier: [['ctrl', 'shift'], ['meta', 'shift']],
				enabled: true,
				callback: () => {
					// FIXME when hitting the modifier, ctrl+shift+z, it will trigger the ctrl+z callback as well
					logger.debug('redo', stack.redo());
				}
			}
		],
		type: 'keydown'
	}}

Anyway I think you have made a good point, it will be great if the exclusiveness is more intuitive

[vnphanquang]

Hmm, I've put together a REPL here. Z is only needed for when the shift modifier is specified. Not sure what went wrong on your end. If you are still having such issue, perhaps try to fork the REPL and create a reproducible one, that would really help me out. Thanks!