react icon indicating copy to clipboard operation
react copied to clipboard

useSref: "target="_blank" ignored when link contains child elements

Open mishra-ankit-learn opened this issue 1 year ago • 1 comments

  • Issue Example:
    • https://codesandbox.io/p/sandbox/uirouter-react-ussref-blank-target-not-working-with-div-inside-a-992y2s
  • Issue:
    • useSref handles click when anchor element contains a child element. This is an issue when the user wants the browser to handle the onClick event, by providing a target attribute.
  • Use Case:
    • The user wants the link to open in a new tab
  • Cause:
    • In Fix #799 the targetAttr (line#87) is captured from e.target assuming that the mouse event got triggered from the anchor. But when there is a child element present inside the anchor element, the mouse event triggers the child element. The child element does not have a target attribute, which makes useSref handle the onClick.
  • Fix:
    • Although the target attribute is not present in e.target, it is in e.currentTarget. So we should check for e.currentTarget when getting targetAttr

mishra-ankit-learn avatar Mar 20 '24 14:03 mishra-ankit-learn

Created PR: #1226 to fix the issue.

Added unit test too

mishra-ankit-learn avatar Mar 22 '24 16:03 mishra-ankit-learn