[Bug]: [replayer] Node with id '....' not found.

[hosamChung]

Preflight Checklist

• [x] I have searched the issue tracker for a bug report that matches the one I want to file, without success.

What package is this bug report for?

rrweb-player

Version

"rrweb": "^1.1.3", "rrweb-player": "^0.7.14"

Expected Behavior

Close replayer on overlay click.

Actual Behavior

The warnings appear when I closed the modal before the replaying is fully completed.

Steps to Reproduce

1. Click to open a Chakra UI modal component.
2. Wait for 1 second.
3. replayer.play()
4. Click on overlay to close the modal.
5. The warnings should appear.

Testcase Gist URL

No response

Additional Information

  const replay = (events: eventWithTime[]) => {
    if (events.length < 2) {
      return toast({
        title: 'Failed to replay empty session.',
        description: '',
        status: 'error',
        duration: 3000,
        position: 'top',
      })
    }

    // opening Chakra UI modal component
    openReplayerModal()

    // wait for the modal to be completely rendered
    setTimeout(() => {
      const replayer = new rrwebPlayer({
        target: document.getElementById('replayer-spot')!,
        props: {
          height: 500,
          width: 1102,
          events,
          skipInactive: false,
        },
      })
      replayer.play()
    }, 1000)
  }

The replay looks normal.

"@chakra-ui/react": "^1.6.3", "next": "^12.3.0", "react": "17.0.2",

[eoghanmurray]

Is there a website with chakra-ui on it that I can try to experience this myself?