mouseEvent doesn't have offsetX/offsetY

I try get position of click relative to element, but event doesn’t have offsetX.

onClick(e) {
  console.log(e.offsetX) // returns undefined
  console.log(e.target.offsetX) // returns undefined
}

render() {
  return <img src='http://placehold.it/1000x500' onClick={this.onClick} />
}

How I can get position of click in element?

[Jarred-Sumner]

As of 2020, this doesn’t seem to need a polyfill. But SyntheticEvent’s MouseEvent doesn’t have offsetX or offsetY

I can submit a PR if you want

https://caniuse.com/#feat=mdn-api_mouseevent_offsetx

[glenjamin]

offsetX/Y appear to be on the standards track and supported in all major browsers.

Any chance of adding them into React - perhaps with a getBoundingClientRect shim for browsers which don’t support it?

https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/offsetX