# Wk-notes-11-06-bug-race-virtual-dom-diff

## Bug fix: Race condition

In chrome canary, When call `setState` and update the dom, the previous form got (removed and add again) updated. And the previous `form` is detached from dom, in which case, `prevForm.submit()` would not take effect.

```jsx
{this.state.isLoading || <div>Loading</div>}
<div>
  <form>
    <input/>
  </form>
</div>
```

In above code, if we do not have key for **Loading div** and **FormWrapper div**, react/preact might see the child div nodes in virtual dom changed and **replace the whole children list**. Nonetheless, if we add **key** to the divs, virtual dom diff can correctly update them without losing the previous **form** node, by which, the **form.submit()** will take effect.
