How can I assert for asynchronous `throw`?

Question

I would like to assert that my code does not throw any eventual errors.

The problem is: my code performs DOM operations, which triggers asynchronous reactions:

const slot = document.createElement('slot');
myElement.attachShadow({mode:'open'}).appendChild(slot);
// ...
  slot.addEventListener('slotchange', function badFunction(){
    throw "MyError";
    // const observer = new MutationObserver(()=>{});
    // observer.observe(null);
  });
// ...
it('when input child element is removed, should not throw an error', function() {
    function disconnect(){
        // this will throw once slotchange is emmited
        myElement.removeChild(myElement.firstElementChild);
    }
    expect(disconnect).not.to.throw();
});

• working snippet: https://glitch.com/edit/#!/how-to-assert-async-throw?
• live sample: path=index.html:28:9

https://how-to-assert-async-throw.glitch.me/

The code aboe passes the test, even though the error will be eventually thrown.

Answer 1

Try this out and let me know if that does the trick.

    const slot = document.createElement('slot');
    myElement.attachShadow({mode:'open'}).appendChild(slot);
    // ...
      slot.addEventListener('slotchange', function badFunction(){
        throw "MyError";
        // const observer = new MutationObserver(()=>{});
        // observer.observe(null);
      });
    // ...
   it('when input child element is removed, should not throw an error', async function() {
       async function disconnect(){
           // this will throw once slotchange is emmited
           await myElement.removeChild(myElement.firstElementChild);
       }
       expect(await disconnect()).not.to.throw();
   });