Short, concise, Vanilla JS TodoMVC one pager #2119
Open
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
The idea here is to explore what a vanilla JS solution would look like if we followed a React style component model.
But...
The code comes in at around ~215 lines of JS and is surprisingly performant while also including HTML sanitization.
This was originally written back in 2016 (https://github.com/tantaman/fk-your-frameworks-todomvc) but for some reason I never got around to submitting it.
Video of the app in action
https://youtu.be/zAZ82DFEY0A
Screenshot of tests (23 pass, 2 fail):
There seem to be a few issues where Cypress tests for the presence of a thing before the render cycle was kicked off. Not sure if that is the use of my request animation frame or not, but manually testing of these test cases works.
Any advice from cypress experts would be welcomed.