search

rrweb-io / rrweb

record and replay the web
https://www.rrweb.io/
MIT License
16.8k stars 1.43k forks source link

Uncaught DOMException: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node. #88

Open xavierh81 opened 5 years ago

xavierh81 commented 5 years ago

Hi !

I got the following exception while replaying a session recorded on one of my website.

issue

During the session, it crashed when the user was interacting with some dynamic selects / dropdowns.

Have you already seen this kind of errors?

PS: I can't post the events log due to privacy rules

Yuyz0112 commented 5 years ago

If this happens with version 0.7.16, then it may be a new bug.

Could you tell me which select component is this project using? Maybe I can try to reproduce it.

xavierh81 commented 5 years ago

There is no custom component for the selects.

They are just dynamic dropdowns with live changes handled by AngularJS (1.6.10)

s-jakob commented 5 years ago

@Yuyz0112 i have the same problem. It is only happening on one specific page and only with the safari browser (mobile and desktop). I think there is maybe an DOM change which the recorder didn't detect. I send you a recording via e-mail with the bug.

Juice10 commented 4 years ago

Copied from #306.

In some cases when applyMutation removes a node, the parent of that node is not attached to the document. This triggers the following error Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.

Expected behaviour

No error should happen

To reproduce

  1. git clone git@github.com:juice10/rrweb-player-1.git
  2. npm install
  3. npm start
  4. Open http://localhost:1234
  5. Seek to around the 23 second or 26 second mark and let it play for a couple seconds, error will trigger: image

Additional information

image image

The error isn't triggered when seeking (isSync == true) past the event. The error also isn't triggered if playing from the very start.

Based off of https://github.com/rrweb-io/rrweb/issues/285#issuecomment-678808349 & https://github.com/rrweb-io/rrweb/issues/285#issue-679841740

Example event triggering failure

{"source":0,"texts":[{"id":3033,"value":"\n/* sc-component-id: sc-global-2139370859 */\n.intercom-messenger-frame{left:0.5rem !important;bottom:4.25rem !important;}"}],"attributes":[],"removes":[{"parentId":99,"id":2635}],"adds":[{"parentId":99,"nextId":107,"node":{"type":3,"textContent":"\n/* sc-component-id: sc-global-2139370859 */\n.intercom-messenger-frame{left:0.5rem !important;bottom:4.25rem !important;}","isStyle":true,"id":3033}}]}

View all events.

codetiantian commented 4 years ago

@Yuyz0112 Hi, I've been having the same problem recently.Can you help me out？

Juice10 commented 4 years ago

More related issues: https://github.com/rrweb-io/rrweb/issues/376 https://github.com/rrweb-io/rrweb/issues/337

Kimmax commented 4 years ago

We're also hitting this in #365

NulSEO commented 4 years ago

... And still no response. I don't get that. People have opened issues regarding these problems before. @Yuyz0112 requested event data - they never replied. Now there's a bunch of event data and the issues are just being ignored. ¯_(ツ)_/¯ (#337 #365 #376)

Yuyz0112 commented 4 years ago

Hi @NulSEO

Actually, this error message is very general and most of the events are causing by different reasons. @Juice10 pointed out a way to reproduce it which is technically right, but I believe are not related to the problems you are facing.

I've done some debug on #337, #365, and #376, most of them are causing by some un-confirmed usage of rrweb, like merging different sessions into one.

So please upload your events or reproducible link for debugging. The other one's report may not help fix your problem.

goldy-13 commented 3 years ago

I am having error while replaying events DOMException: Failed to execute 'insertBefore' on 'Node': This node type does not support this method. at appendNode (http://localhost:3000/static/js/0.chunk.js:150183:76) at http://localhost:3000/static/js/0.chunk.js:150194:7 at Array.forEach () at Replayer.applyMutation (http://localhost:3000/static/js/0.chunk.js:150193:12) at Replayer.applyIncremental (http://localhost:3000/static/js/0.chunk.js:149790:16) at castFn (http://localhost:3000/static/js/0.chunk.js:149494:17) at wrappedCastFn (http://localhost:3000/static/js/0.chunk.js:149556:9) at _loop_1 (http://localhost:3000/static/js/0.chunk.js:150796:13) at play (http://localhost:3000/static/js/0.chunk.js:150812:13) at http://localhost:3000/static/js/0.chunk.js:144542:17

goldy-13 commented 3 years ago

@Juice10 I am getting DOMException: Failed to execute 'appendChild' on 'Node': This node type does not support this method. while seeking video in some recordings. Could you please help me out

Juice10 commented 3 years ago

@goldy-13 I was not able to fix my own issue but I’m happy to help if I can. What version of rrweb or rrweb-player are you using? Could you create a gist of your events?

goldy-13 commented 3 years ago

@goldy-13 I was not able to fix my own issue but I’m happy to help if I can. What version of rrweb or rrweb-player are you using? Could you create a gist of your events?

I am using rrweb 0.9.14, here is link to my events: https://gist.github.com/goldy-13/56bfe6d533eb7917a96fb6f4a5c7b483

Tang-jianchao commented 3 years ago

mark

heyitsnovi commented 3 years ago

Same issues goes to me. any updates regarding this one?

YunFeng0817 commented 3 years ago

@heyitsnovi Like Yuyz0112 said, this error message is very general and most of the events are causing by different reasons. If you are facing the same errors, please upload your events to help us figure out the root cause.

heyitsnovi commented 3 years ago

@Mark-Fenng here's the sample event json link: https://gist.github.com/heyitsnovi/c31fc044fb7c85945fc4bae79433ec4b