I have this function I want to call followed by the opening of a page in a new tab after a user clicks an element in my VueJS application similar to this:
const someFunction = async () => {
const value = await api.someCallToApi();
window.open('https://example.com', '_blank').focus();
}
I am not allowed to do this, probably due to the await resulting in the window.open not being a direct result of a user action(?)! Due to the way my application is setup the order of the api call and opening of the window in the new tab is relevant.
What would be a solid and modern way of tackling such an issue?
In an ideal world, all asynchronous functions would already return promises.
But there may be still old libraries that use await.
You can create a Promise that wraps the await function as below:
const delay = (ms) => new Promise(resolve => setTimeout(resolve.bind(null, ms/1000), ms));
delay(3*1000).then((sec) => alert(sec + " seconds passed"));