[Bug]: Modal disappers when adding child item

[brianakidd]

What happened?

While adding child items to a primary node, the modal closes unexpectedly but the modal backdrop remains.

How to reproduce the bug

Install the plugin. Add first item with at least one child item. Then, create another top node item and attempt to add a child item to the new node.

https://github.com/saade/filament-adjacency-list/assets/6431835/c09905c0-5723-4466-a8d7-7cba4431f4e8

Package Version

3.x

PHP Version

8.1

Laravel Version

10

Which operating systems does with happen with?

macOS

Notes

No response

[saade]

Hi, thanks for reporting that.

Did you get any console errors? Seems like a dom diffing issue or something like that in the JS side, since it did not throw a Livewire exception

[brianakidd]

@saade Sorry, yes, there was a console error but I didn't capture it at the time and have uninstalled the plugin. I do remember it referencing a null value, like "null doesn't have ...". If you need me to reinstall it and get it for you, let me know.

[saade]

yeah, it's hard to reproduce an isolated case like that, if you could add more info it would help a lot

[brianakidd]

Okay, give me a few minutes.

[brianakidd]

I reinstalled it and it seems the error happens at different times. If I create a top level item and then create a second top level item, it seems to be fine but if I create a top level item, add a child to it, then attempt to create a second top level item, it throws console error: Uncaught TypeError: Cannot read properties of null (reading 'nextSibling')

Clicking the code link in dev tools shows this:

get children() {
      let children = [];
      let currentNode = this.startComment.nextSibling;
      while (currentNode !== void 0 && currentNode !== this.endComment) {
        children.push(currentNode);
        currentNode = currentNode.nextSibling;
      }
      return children;
}

However, sometimes the modal closes leaving the backdrop but no errors are thrown. I've also seen when clicking "Create", the modal backdrop appears but the modal never does.

I've seen this in both Firefox and Chrome. I've seen this in both a create modal and a full-page create page.

I'm copying and pasting the code in the Usage section. My model property is a MySQL JSON column casts to an array but I haven't even gotten to the point of trying to save the new record.

Hope this helps.

[saade]

Thanks, I'll have a look at this over the weekend.

[saade]

related https://github.com/livewire/livewire/pull/6521

[saade]

Hey, could you update your Livewire and Filament to the latest version and see if the problem persists? Seems like a LW Dom Diffing issue and should be fixed in newer versions