Fixing Bootstrap toast error (TypeError: cannot read properties of null (reading 'defaultPrevented) at is.show)

Question

I'm building an app (node and express) and trying to use Bootstrap toasts for flash messages.

I have them functioning, but the dev tools are showing:

Uncaught TypeError: Cannot read properties of null (reading 'defaultPrevented')
    at is.show (toast.js:27:21)
    at toast.js:3:16

I'm using ejs and ejs mate layouts, so I've made a public/toast.js that is part of my boilerplate layout initializes and shows the toast per the Bootstrap docs:

const myToast = document.querySelector('.toast')
const toastBootstrap = bootstrap.Toast.getOrCreateInstance(myToast)
toastBootstrap.show()

What is causing this error?

I tried initializing the toast in the same manner the docs say to, adding:

const toastElList = document.querySelectorAll('.toast')
const toastList = [...toastElList].map(toastEl => new bootstrap.Toast(toastEl))

but I didn't know what to do from here.