Link: Clicking leading or trailing icon does not trigger link

[bdfranck]

The leading and trailing icons for the link component appear interactive. They have the interactive colour and a hover state. But nothing happens when you click on them.

leading-and-trailing-icon.mp4

Example code

<GoabLink leadingIcon="arrow-back" trailingIcon="arrow-forward">
  <a href="/all">View all components</a>
</GoabLink>

How to replicate the issue

1. Wrap a link in a GoabLink component with a leadingIcon and a trailingIcon.
2. Try clicking on the leading icon or trailing icon.
3. Nothing will happen.

Acceptance Criteria:

• When a user clicks a leading or trailing icon, they navigate to the URL of the child link.
• Make focus state encompass leading, trailing, and the link all at once