Link does not open in Safari browser for iOS

I have a link that, when clicked, creates an element which is a link that should direct the user to a new page.

I need this link to work for all platforms.

For some reason it doesn't open when iOS is clicked in Safari Browser.

How do I workaround for it to also work in Browser Safari.

It is worth mentioning that it works on all platforms and browsers, except for the mentioned one.

const requestDownloadToken = (event, invoicePath) => {
  event.preventDefault();
  setInvoiceDownloadToken().then(response => {
    if (response.status === 201) {
      const link = document.createElement('a');
      link.href = `${invoicePath}?key=${response.data.invoice_token}`;
      link.target = '_blank';
      link.rel = "noreferrer noopener";
      link.click();
    }
  }).catch(error => {
    // eslint-disable-next-line no-console
    console.log(error);
  });
};

const invoiceLink = (invoice, index) => {
  let invoicePath = getGeminiAbsolutePath(II_STACK);
  invoicePath = invoicePath.concat(getGeminiDashboardApiPath().concat(invoice.link));
  return (
    <CriticalScopes
      component="link"
      baseUrl={getComFEAbsolutePath(II_STACK)}
      locale={currentLocale()}
    >
      <a
        rel="noreferrer"
        href="#"
        data-testid={`billing-invoice-link-${index}`}
        target="_blank"
        className={styles['invoice-link']}
        onClick={event => requestDownloadToken(event, invoicePath)}
      >
        {invoice.date_formatted}
      </a>
    </CriticalScopes>
  );
};