Crank: Copy not working with async component

[waynebaylor]

I'm seeing weird behavior when I have a component like:

function* CopyComponent(this: Context, props: any) {
  let rendered = false;
  for ({ } of this) {
    if (rendered) {
      yield <Copy />;
    } else {
      rendered = true;
      yield <AsyncDate />;
    }
  }
}

There are no errors, but subsequent rendering of parent components seems to be cut short. I've created an example that reproduces the issue here: https://codesandbox.io/s/copy-async-weirdness-dlwnh.

In the example, if you click the "Add" button you should see another entry added to the list, but nothing happens. In the console you can see the click event firing and being handled, but the view isn't updated.

Using crank v0.3.9

[brainkim]

@waynebaylor Sorry about this! I felt the pain you must have been going through as you added console.log() calls to every component in the tree in your reproduction. Thank you so much for reporting this bug and providing such a clear example; it was very helpful for tracking down the problem. I also like the coding style you’ve developed in your components. Very clean!

Good news, I have a fix! Bad news, I wish I could say this won’t happen again, but I can’t. Async generator components have been a bit hairy in terms of implementation from the start, and I’m not sure there won’t be more difficult head-scratcher bugs like this. I’ve added a unit test which makes sure this specific situation won’t happen again, but I think that at some point I’ll need to do a deep dive on all the possible states for async generator components to make sure everything is working correctly.

Again, I’m very sorry about the bug, and grateful that you reported it. I’ll try to have a release with the fix by end of day.

[brainkim]

Shipped in 0.3.10. Let me know if you’re still having problems!