Filtering doesn't work as expected for mouse events on macOS

[pavloko]

Hi folks,

I'm trying to allow wheel zoom only when a user holds shiftKey. Everything works as expected when testing with a macOS trackpad, but not for an external mouse.

The behavior is reproducible in all browsers. I've also checked different d3 versions: 7 and 5. Zoom behavior works as expected with a trackpad, but not with an external mouse.

Here's the filter function code:

function filter(event) {
  if (event.type === "wheel") {
    return event.shiftKey;
  }
  return true;
}

Here's a minimal example on codesandbox: https://codesandbox.io/s/d3-zoom-macos-filter-issue-hpgux9?file=/src/index.js

[mbostock]

D3 is just passing you the native browser event, so if event.shiftKey isn’t what you expect, that’s either the intended behavior of the browser/specification, or a browser/specification bug. I’m not sure what the issue is here, but this isn’t a bug with D3 so I’m going to close the issue. You could try listening for key events instead to detect if the shift key is down, and then reference that state from your filter function instead of trying to get it from the wheel event. Good luck.

[pavloko]

Thank you for the prompt reply!