Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

"DELETION" exception #30

Open
WangYuLue opened this issue Oct 28, 2020 · 1 comment
Open

"DELETION" exception #30

WangYuLue opened this issue Oct 28, 2020 · 1 comment

Comments

@WangYuLue
Copy link

WangYuLue commented Oct 28, 2020

In commitWork function, when entering DELETION condition judgment,it should ruturn

    )
  } else if (fiber.effectTag === "DELETION") {
    domParent.removeChild(fiber.dom)
+   return
  }

  commitWork(fiber.child)
  commitWork(fiber.sibling)
}

Otherwise didact will repeatedly delete child elements, and will throw a exception:

屏幕快照 2020-10-28 下午8 18 40

Here is my test code

/** @jsx Didact.createElement */
const container = document.getElementById("root")

const updateValue = e => {
  rerender(e.target.value)
}

const rerender = value => {
  const element = (
    <div>
      <input onInput={updateValue} value={value} />
      <h2>Hello {value}</h2>
      {
        value === '1' ? <div><span>a</span><span>b</span></div> : <div><div>c</div><div>d</div></div>
      }
    </div>
  )
  Didact.render(element, container)
}

rerender("World")

The operation effect is as follows:

ezgif com-gif-maker (1)

Test it on codesandbox

I open a PR to fix the question

@kusamochi
Copy link

kusamochi commented Sep 1, 2021

hi there,
I came across the same problem, I found out the node may have been already removed before commitDeletion (I guess it is because of the way non-blocking works), therefore parentNode is null. I just changed domParent.removeChild(fiber.dom); to fiber.dom.remove();

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants