cleanup settimeout throws error if dom element isn't on page.

[sdb1228]

Expected behavior

When the rbd-announcement-1 div doesn't exist it doesn't try to remove it.

Actual behavior

rbd tries to remove a dom element that doesn't exist.

react-beautiful-dnd.esm.js:5466 Uncaught DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
    at remove (http://localhost:3000/packs/js/application-12c072486af5cffa7be8.js:119874:26)

Steps to reproduce

I haven't gotten an isolated setup (sorry!) but if you use something like turbo links https://github.com/turbolinks/turbolinks with react-beautiful-dnd when you navigate to another page via a link the dom changes before reactdnds settimeout has time to run causing a dom error.

Suggested solution?

in the root component of your app you can do something like

    window.addEventListener('turbolinks:before-render', () => {
      const highestTimeoutId = setTimeout(';');
      for (let i = 0; i < highestTimeoutId; i++) {
        clearTimeout(i);
      }
    });

which will remove the settimeout for reactbeautifuldnd essentially squashing the error.

yes! in src/view/use-announcer/use-announcer.js:46 add a check before to see if the dom element exists before removing.

What version of React are you using?

16.12.0

What version of react-beautiful-dnd are you running?

12.2.0

What browser are you using?

chrome Version 79.0.3945.130 (Official Build) (64-bit)

[sdb1228]

🎉 Just updated my package.json with the beta version and it silenced this error! Thanks @alexreardon