Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/bahmutov/todomvc-redux-kuker
Example TodoMVC with Redux and Kuker
https://github.com/bahmutov/todomvc-redux-kuker
cypress cypress-example cypress-io kuker-js redux
Last synced: 13 days ago
JSON representation
Example TodoMVC with Redux and Kuker
- Host: GitHub
- URL: https://github.com/bahmutov/todomvc-redux-kuker
- Owner: bahmutov
- Created: 2019-03-13T18:26:41.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2024-04-28T14:21:49.000Z (9 months ago)
- Last Synced: 2024-05-01T23:53:27.166Z (8 months ago)
- Topics: cypress, cypress-example, cypress-io, kuker-js, redux
- Language: JavaScript
- Size: 990 KB
- Stars: 2
- Watchers: 1
- Forks: 1
- Open Issues: 7
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# todomvc-redux-kuker [![renovate-app badge][renovate-badge]][renovate-app] [![CircleCI](https://circleci.com/gh/bahmutov/todomvc-redux-kuker.svg?style=svg)](https://circleci.com/gh/bahmutov/todomvc-redux-kuker)
Example application has been forked from [reduxjs/redux](https://github.com/reduxjs/redux/tree/master/examples/todomvc) and stored in `src` folder.
## Run
```shell
npm install
npm run dev
```Start the application and opens Cypress test runner with several specs. You can also open the Chrome browser at [localhost:1234](http://localhost:1234), and if you have [Kuker Extension][kuker-extension] installed, you should see Redux events reported as you use the application.
![Kuker extension](images/kuker-extension-in-action.png)
## Specs
Different specs in [cypress/integration](cypress/integration) folder show different levels of processing Kuker events in the Cypress tests
- [spec.js](cypress/integration/spec.js) is purely UI test without any Kuker events
- [spy-spec.js](cypress/integration/spy-spec.js) shows how to spy from the test on `window.postMessage` calls used by Kuker emitter to send data to the Kuker DevTools extension
- [kuker-spec.js](cypress/integration/kuker-spec.js) makes a separate spy that only sees clean event data and nicely logs event details
- [fixture-spec.js](cypress/integration/fixture-spec.js) asserts data sent by Kuker against expected values loaded from [cypress/fixtures](cypress/fixtures) JSON files![Typical Cypress test](images/cy-test.png)
## Tools
- [Cypress.io](https://www.cypress.io)
- [kuker](https://github.com/krasimir/kuker)
- [Kuker DevTools extension][kuker-extension][kuker-extension]: https://chrome.google.com/webstore/detail/kuker/glgnienmpgmfpkigngkmieconbnkmlcn
[renovate-badge]: https://img.shields.io/badge/renovate-app-blue.svg
[renovate-app]: https://renovateapp.com/