{"id":16293232,"url":"https://github.com/noriste/redux-saga-login-react-example","last_synced_at":"2025-03-20T03:31:04.679Z","repository":{"id":35075983,"uuid":"150964455","full_name":"NoriSte/redux-saga-login-react-example","owner":"NoriSte","description":"The redux-saga login example with a super-essential UI","archived":false,"fork":false,"pushed_at":"2023-03-24T20:16:07.000Z","size":396,"stargazers_count":32,"open_issues_count":37,"forks_count":20,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-03-14T20:39:57.478Z","etag":null,"topics":["generators","javascript","jest-puppeteer","puppeteer","react","redux-saga"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/NoriSte.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2018-09-30T12:14:35.000Z","updated_at":"2024-10-01T17:42:32.000Z","dependencies_parsed_at":"2024-10-10T20:10:40.674Z","dependency_job_id":"0f1b8813-8791-442e-9ead-a15fbf6b9c6a","html_url":"https://github.com/NoriSte/redux-saga-login-react-example","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NoriSte%2Fredux-saga-login-react-example","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NoriSte%2Fredux-saga-login-react-example/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NoriSte%2Fredux-saga-login-react-example/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NoriSte%2Fredux-saga-login-react-example/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/NoriSte","download_url":"https://codeload.github.com/NoriSte/redux-saga-login-react-example/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244047647,"owners_count":20389206,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["generators","javascript","jest-puppeteer","puppeteer","react","redux-saga"],"created_at":"2024-10-10T20:10:36.364Z","updated_at":"2025-03-20T03:31:04.363Z","avatar_url":"https://github.com/NoriSte.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# redux-saga-login-react-example\nThe redux-saga login example with a super-essential UI, unit tests and E2E tests.\n\nThe Redux Saga library reports an interesting example on the docs, a complete login process.\nYou can find it [here](https://redux-saga.js.org/docs/advanced/NonBlockingCalls.html).\n\nSince it's my first touch with the generators I wrote the tests for every flow expected by the example itself.\n\nHow to tun the unit tests\n```\n$ npm install\n$ npm test\n```\nand if you want to see the E2E tests running\n```\n$ npm install\n$ npm run dev\n# in another window\n$ npm run start\n# in another window too\n$ npm run test:e2e\n```\n\nIf you haven't the [Redux DevTools](https://chrome.google.com/webstore/detail/redux-devtools/lmhkpmbekcpmknklioeibfkpmmfibljd?hl=it) installed don't worry, every action dispatched is logged into the console.\n\n# Test outputs\n## Unit tests\n```\n PASS  src/sagas/index.test.js\n  login saga effects\n    standard login flow\n      ✓ it waits for a LOGIN_REQUEST action (4ms)\n      ✓ then it forks the authorize method (1ms)\n      ✓ then it waits for a LOGOUT or LOGIN_ERROR action\n      ✓ then it cancels the authorize call on a LOGOUT action\n      ✓ then it triggers a DELETE_TOKEN action\n      ✓ and finally it waits again for a LOGIN_REQUEST action (1ms)\n    login error flow\n      ✓ if a LOGIN_ERROR action happens it doesn't cancel the authorize task (because it's the authorize task itself that triggers the LOGIN_ERROR action)\n      ✓ neither it triggers a DELETE_TOKEN action (1ms)\n  authorize saga effects\n    standard login flow\n      ✓ it calls the authorization method (1ms)\n      ✓ then it triggers a LOGIN_SUCCESS action\n      ✓ then it triggers a SAVE_TOKEN action\n      ✓ finally it checks if it's been cancelled by another generator\n    external cancellation\n      ✓ It triggers a LOGIN_CANCELLED action if cancelled externally\n    login error flow\n      ✓ it triggers a LOGIN_ERROR action in case of login error\n\nTest Suites: 1 passed, 1 total\nTests:       14 passed, 14 total\nSnapshots:   0 total\nTime:        1.613s\n\n```\n## E2E tests\n```\n PASS  test/login-saga.e2e.test.js\n  login saga effects, e2e tests\n    ✓ standard login flow (1081ms)\n    ✓ login error flow (463ms)\n    ✓ external cancellation (360ms)\n\nTest Suites: 1 passed, 1 total\nTests:       3 passed, 3 total\nSnapshots:   0 total\nTime:        2.783s, estimated 4s\n```\n\nIf you want to see the E2E tests running with your eyes open the `login-saga.e2e.test.js` file and set `headless` to false (and `slowMo` to 250)\n```javascript\nbrowser = await puppeteer.launch({\n    headless: true,\n    slowMo: 0,\n    devtools: true,\n});\n```\n\n\n### Differences between my code and the example's one\n- I added a simple `fakeAuthorize` method to simulate a real AJAX call\n- I added two actions: SAVE_TOKEN and DELETE_TOKEN\n- I move the token clearing into the `if (action.type === 'LOGOUT')` condition\n\n\nThis project has been bootstrapped with [Create React App](https://github.com/facebookincubator/create-react-app).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnoriste%2Fredux-saga-login-react-example","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fnoriste%2Fredux-saga-login-react-example","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fnoriste%2Fredux-saga-login-react-example/lists"}