Typescript execute document.execCommand('copy') after an Http get

I have an issue where I cannot execute a document.execCommand('copy') directly after a get request (the get request is wrapped in a service that returns an Observable). I am assuming its because the get request is an asynchronous call so the event is no longer considered trusted.

I thought that I could perhaps await the service call ...

  async getBearerToken(username: string) {
    const token = await this._getTokenService.getToken('scopevar', username).first().toPromise();
    this._clipboard.copy(token);
  }

But this didn't work.

Note the _clipboard service just creates a textarea injects a DOM and sets the text, then calls the document.execCommand - it works when called directly from a button click with no other async calls first. I assume that I somehow need to make sure that that call and the previous call are on the same thread.

I realize a work around would be to do this in 2 steps, get the text, set it to a text area and then get the user to click again - I'd prefer to do it properly though. (this is just an internal app for grabbing test user tokens to use in testing)

So, how can I achieve this without a nasty workaround?