I want users to be able to open links from a custom component. Here's a minimal example, that doesn't work, reasonably.
<script crossorigin src="https://unpkg.com/react@18/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
<div id="react"></div>
<script type="text/babel">
const ConnectedComponent = Retool.connectReactComponent(_ => <a href="https://google.com">Google</a>)
const container = document.getElementById('react')
const root = ReactDOM.createRoot(container)
root.render(<ConnectedComponent />)
</script>
This doesn't work because the custom component is in an iframe, and the link tries to open google in an iframe, and Google does not like being opened in an iframe.
But if I add target="_blank"
or target="_parent"
to that <a>
tag, the click gets swallowed as if it does not exist. I can right click the link and say "open in new tab," but I can't open the link by clicking.