[Browser Bug] BFCache application can cause UI and DOM state can become out of sync.
- Dominant language
- TypeScript
- Stars
- 22.6k
- Forks
- 4.2k
- Avg merge
- 3d 12h
- Merged PRs (30d)
- 15
Description
_This isn't an ember bug specifically, but I figured I would open this here as a curtesy since when it manifests it may at-first appear to be an ember issue._
### BFCache application can cause UI and DOM state can become out of sync.
For example, if we have form with dependent selects (the value of the primary select, changes the secondary select).
If a user updates `select#primary` to "Two", the `select#seconary` will be rendered. If at that point the user presses the "back button", followed by the "forwards button" they will end with `select#primary` having selected with "Two" but the `select#secondary` will not have been rendered.
### Illustrating the example with some templates.
```html
One
Two
{{#if selected}}
{{#each selected.options |option|}}
{{option.text}}
{{/each}}
{{/if}}
```
Which can result in the UI becoming out-of-sync with the backing data.
### Links
* [Corresponding Chrome issue](https://bugs.chromium.org/p/chromium/issues/detail?id=1143298)
* [Reproduction/tests/POC Workaround](https://github.com/stefanpenner/bfcache-form-element-fix)
Contributor guide
Assessment
This issue has not been assessed yet.