Warning about ignored promise in Bootstrap Vue @ok handler

Question

My VueJS app uses Bootstrap Vue. The following shows a modal which is basically working fine.

b-modal(
    :id="`delete-modal-${data.index}`"
    centered hide-header
    :ok-title="$t('deletion_confirm')" :cancel-title="$t('deletion_abort')"
    @ok="deleteDocument(data.item)"
) {{ $t('deletion_question', {filename: data.item.name}) }}

However, my IDE (WebStorm) shows a warning on the deleteDocument method:

Promise returned from deleteDocument is ignored

deleteDocument() is an async/await method which sends a DELETE request to the backend like this:

async deleteDocument(item) {
  await ApiService.deleteDocument(item);
  // ...
}

How could I fix that warning?

Answer 1

Every async function return a promise. So in your case @ok="deleteDocument(data.item)" invokes deleteDocument, which returns a promise that no-one handles.
This is just a warning, not an error and can be ignored if you know what you're doing.

If the warning really bothers you, you can change deleteDocument to a normal function and handle this promise the classic way with a .then() callback method:

deleteDocument(item) {
  ApiService.deleteDocument(item).then(() => {/* handle stuff */});
  // returns undefined by default like every other normal function
}

This way it doesn't return a promise that noone handles.