lit/lit-element

'enableUpdating is not a function' when dynamically appending to element to the DOM

brewsoftware opened this issue · 1 comments

brewsoftware commented

Description

error thrown when adding a component to a dom dynamically
`this.enableUpdating is not a function' when appending a node to the dom which inherits LitElement.

It's being called in the connectedCallback function after the item is appended.

Live Demo

Unfortunately it's a mess and I've confirmed the bug by rolling the framework for https://shoelace.style back to the previous stencilJS version which doesn't have the issue. (https://github.com/shoelace-style/shoelace). I've also confirmed the issue with the material web components and it's the same (https://github.com/material-components/material-components-web-components)

This can be done by creating a custom component in GrapesJS and dragging it into the frame view module for editing. (https://github.com/artf/grapesjs)

Steps to Reproduce

TBA: This is a bit convoluted to re-produce but I can maybe do a gist if needed with the grapesjs implementation.

Expected Results

The component renders

Actual Results

The component fails to render and an error is thrown with 'this.enableUpdating is not a function' from the LitElement source

Browsers Affected

  • [ x] Chrome
  • [ x] Firefox
  • [] ???

Versions

  • lit-element: v2.4.0
  • webcomponents: v1.3.0
sorvell commented

Closing due to age. Please re-open with a live reproduction if there's still an issue here. Thanks.