salesforcecli/plugin-lightning-dev

Dev server fails unrecoverable, if LWC is rendered that recursively references itself

Opened this issue · 0 comments

Summary

The dev server fails to render, if it tries to display an LWC that recursively references itself.

Sorry if the bug report is incomplete and misses relevant information. It's my first bug report. I am very happy to help investigation & debugging.

Steps To Reproduce:

A simple tree implementation

<!-- c-drag-drop-tree-branch -->
<template>
    <div class="draggable-card slds-var-m-vertical_small">
        <lightning-formatted-text value={nodeName}></lightning-formatted-text>
        <template if:true={hasChildren}>
            <template for:each={children} for:item="item">
                <div
                    key={item.id}
                    class="slds-var-m-left_medium slds-var-m-vertical_small"
                >
                    <c-drag-drop-tree-branch
                        data-id={item.id}
                        role="treebranch"
                        branch-data={item}
                        is-root="false"
                        draggable
                    ></c-drag-drop-tree-branch>
                </div>
            </template>
        </template>
    </div>
</template>

Expected Result

The dev-server renders the LWC correctly and shows the same result as the "normal" (?) renderer.

When the source is pushed LWC dev server is off, it renders the tree recursively

image

Actual Result

When dev server is launched (sf lightning dev app -t desktop), it throws this error

function tmpl($api, $cmp, $slotset, $ctx) {
      const {c: api_custom_element, k: api_key, h: api_element, i: api_iterator, f: api_flatten} = $api;
      return [api_element("div", stc0, api_flatten([api_custom_element("lightning-formatted-text", _lightningFormattedText__default.default, {
        props: {
          "value": $cmp.nodeName
        },
        key: 1
      }), $cmp.hasChildren ? api_iterator($cmp.children, function (item) {
        return api_element("div", {
          classMap: stc1,
          key: api_key(2, item.id)
        }, [api_custom_element("c-drag-drop-tree-branch", _cDragDropTreeBranch, {
          attrs: {
            "data-id": item.id
          },
          props: {
            "role": "treebranch",
            "branchData": item,
            "isRoot": "false",
            "draggable": true
          },
          key: 3
        })]);
      }) : stc2]))];
      /*LWC compiler v7.1.3*/
    } is not a valid component, or does not extends LightningElement from "lwc". You probably forgot to add the extend clause on the class declaration.

Additional Information

Screenshots:

Logs:

System Information

SF CLI:

@j-schreiber/sf-plugin 0.1.2
@tmh-bis-salesforce/tmh-bis-salesforce-cli-plugin 0.8.3
community 3.3.2 (3.3.2)
dev 2.5.0 (2.5.0)
lightning-dev 1.9.3
packaging 2.9.0
sfdmu 4.36.7
texei-sfdx-plugin 2.8.1

Uninstalled JIT Plugins:
custom-metadata 3.3.36
devops-center 1.2.25
env 3.0.33
functions 1.23.0
signups 2.5.23
@salesforce/sfdx-plugin-lwc-test 1.2.1
@salesforce/sfdx-scanner 4.7.0