tetra
tetra copied to clipboard
Component update fails if <tr> is root tag
First of all, thank you for this promising project.
Is it required to use <div>
as a component root in the template? I'm trying to use <tr>
and get an exception:
alpinejs.morph.cdn.min.js:2 Uncaught (in promise) TypeError: Cannot read properties of null (reading 'nodeType')
Minimal component to reproduce:
@default.register
class TableRow(Component):
flag = True
template: django_html = """
<tr {% ... attrs %}>
<th>Flag</th>
<td @click="toggle">{{ flag }}</td>
</tr>
"""
@public
def toggle(self, e):
self.flag = not self.flag
Hi Alex, I have spotted you have submitted an issue to Alpine. I suspect you are right about it being an Alpine issue. Will add my thoughts there...
https://github.com/alpinejs/alpine/discussions/3019
I have submitted a pull request to Alpine.js to change the DOM fragment creation method to enable table support: https://github.com/alpinejs/alpine/pull/3020
@samwillis thank you!
No worries, 'tr' as a component root element is clearly going to be a very common pattern so it's quite critical that it works!
I think you can close this issue as https://github.com/alpinejs/alpine/pull/3020 is already merged.
It's merged, but with the version included in Tetra it does not work. And the newest version (3.10.5) seems to break Tetra completely.
Any workarounds?