{"id":20555090,"url":"https://github.com/shahramshakiba/testing-reactjs-apps-basic","last_synced_at":"2025-03-06T06:28:52.886Z","repository":{"id":234448001,"uuid":"788915971","full_name":"ShahramShakiba/Testing-ReactJS-Apps-Basic","owner":"ShahramShakiba","description":"Unit Tests ⚙️ | I aim to thoroughly test \"fundamental concepts\" in React applications to guarantee their functionality, performance, and dependability as the main goal of this project (🔵React.js).","archived":false,"fork":false,"pushed_at":"2024-04-20T08:38:12.000Z","size":210,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-16T18:00:15.734Z","etag":null,"topics":["testing-library-react","testing-react-apps"],"latest_commit_sha":null,"homepage":"","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/ShahramShakiba.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}},"created_at":"2024-04-19T10:41:59.000Z","updated_at":"2024-09-09T15:32:22.000Z","dependencies_parsed_at":"2024-04-20T13:12:20.625Z","dependency_job_id":null,"html_url":"https://github.com/ShahramShakiba/Testing-ReactJS-Apps-Basic","commit_stats":null,"previous_names":["shahramshakiba/testing-basic","shahramshakiba/testing-reactjs-apps"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ShahramShakiba%2FTesting-ReactJS-Apps-Basic","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ShahramShakiba%2FTesting-ReactJS-Apps-Basic/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ShahramShakiba%2FTesting-ReactJS-Apps-Basic/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ShahramShakiba%2FTesting-ReactJS-Apps-Basic/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ShahramShakiba","download_url":"https://codeload.github.com/ShahramShakiba/Testing-ReactJS-Apps-Basic/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":242160299,"owners_count":20081646,"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":["testing-library-react","testing-react-apps"],"created_at":"2024-11-16T03:16:17.422Z","updated_at":"2025-03-06T06:28:52.861Z","avatar_url":"https://github.com/ShahramShakiba.png","language":"JavaScript","readme":"#  \u003cimg src=\"https://raw.githubusercontent.com/Tarikul-Islam-Anik/Telegram-Animated-Emojis/main/Objects/Laptop.webp\" alt=\"Laptop\" width=\"35\" /\u003e \u0026nbsp; _Testing ReactJS Apps_ \u003cimg src=\"https://skillicons.dev/icons?i=react\" height=\"40\" alt=\"react logo\" height=\"40\" width=\"36\"  /\u003e\n\n\u003c!----------------------------------------- Description ----------------------------------------\u003e\n### \u003cimg src=\"https://raw.githubusercontent.com/Tarikul-Islam-Anik/Animated-Fluent-Emojis/master/Emojis/Symbols/Bubbles.png\" alt=\"Bubbles\" width=\"40\" height=\"40\" /\u003e\u0026nbsp; _Description_\n\n\u003e ### _Testing ReactJS Apps_ ensures that the app functions correctly, performs well, and delivers a seamless user experience.  \n\n#### _Manual Testing \u0026 Automated Testing_:\n- The key difference between _Manual Testing_ and _Automated Testing_ lies in the level of human intervention and the use of automation tools.\n- While ` Manual-Testing ` relies on human testers to execute test cases manually, ` Automated-Testing ` leverages tools to automate test execution and verification. \u003cbr/\u003e\u003cbr/\u003e\n\n#### _Different Kinds Of Automated Tests_:\n#### \u003cimg src=\"https://raw.githubusercontent.com/Tarikul-Islam-Anik/Animated-Fluent-Emojis/master/Emojis/Symbols/White%20Flag.png\" alt=\"White Flag\" width=\"20\" /\u003e \u0026nbsp; _` Unit Tests `_\nUnit tests are focused on testing individual Function, Components or units of code in isolation to ensure they function correctly.\n- Projects typically contain dozens or hundreds of unit tests\n#### \u003cimg src=\"https://raw.githubusercontent.com/Tarikul-Islam-Anik/Animated-Fluent-Emojis/master/Emojis/Symbols/White%20Flag.png\" alt=\"White Flag\" width=\"20\" /\u003e \u0026nbsp; _` Integration Tests `_\nInvolve testing how different units or modules interact with each other.\nThese tests validate the integration of various components and ensure that they work together smoothly as a system.\n- Projects typically contain a couple of integration tests\n#### \u003cimg src=\"https://raw.githubusercontent.com/Tarikul-Islam-Anik/Animated-Fluent-Emojis/master/Emojis/Symbols/White%20Flag.png\" alt=\"White Flag\" width=\"20\" /\u003e \u0026nbsp; _` End-to-End (E2E) Tests `_\nEnd-to-end tests are more comprehensive and simulate real-world scenarios by testing the Entire Application from start to finish.\n- Projects typically contain only a few E2E tests \u003cbr/\u003e\u003cbr/\u003e\n\n\u003cimg src=\"https://user-images.githubusercontent.com/73097560/115834477-dbab4500-a447-11eb-908a-139a6edaec5c.gif\"\u003e\n\n\u003c!--===================== Testing ReactJS Apps =============================--\u003e\n### \u003cimg src=\"https://raw.githubusercontent.com/Tarikul-Islam-Anik/Telegram-Animated-Emojis/main/Objects/Laptop.webp\" alt=\"Laptop\" width=\"35\" height=\"30\"  /\u003e \u0026nbsp; _Testing ReactJS Apps_  \u003cimg src=\"https://skillicons.dev/icons?i=react\" height=\"40\" alt=\"react logo\" width=\"20\"  /\u003e\n- #### I aim to thoroughly test _fundamental concepts_ in React applications to guarantee their functionality, performance, and dependability as the main goal of this project. \u003cbr/\u003e\u003cbr/\u003e\n \n\u003cimg src=\"https://raw.githubusercontent.com/Tarikul-Islam-Anik/Animated-Fluent-Emojis/master/Emojis/Symbols/White%20Flag.png\" alt=\"White Flag\" width=\"20\" /\u003e \u0026nbsp; _Required Tools \u0026 Setup_ :\n- _We need a tool for running our tests and asserting the results_: \u0026nbsp; • Jest\n- _We need a tool for \"simulating\" (rendering) our React app_: \u0026nbsp;  • React Testing Library\n\n  \n\u003e _Which Concepts in Have I Covered_:  \n\n#### \u003cimg src=\"https://raw.githubusercontent.com/Tarikul-Islam-Anik/Animated-Fluent-Emojis/master/Emojis/Symbols/White%20Flag.png\" alt=\"White Flag\" width=\"20\" /\u003e \u0026nbsp; _Understanding Unit Tests_\n#### \u003cimg src=\"https://raw.githubusercontent.com/Tarikul-Islam-Anik/Animated-Fluent-Emojis/master/Emojis/Symbols/White%20Flag.png\" alt=\"White Flag\" width=\"20\" /\u003e \u0026nbsp; _Testing React Components \u0026 Building Blocks_\n\n\n \n\u003cbr/\u003e\n\n\u003e _To access further details, please refer the following two documents_: \u003cbr/\u003e\n- \u003ca href=\"https://jestjs.io/\" target=\"_blank\"\u003e_Jest_\u003c/a\u003e \u003cbr/\u003e\n- \u003ca href=\"https://testing-library.com/docs/react-testing-library/intro/\" target=\"_blank\"\u003e_React Testing Library_\u003c/a\u003e \u003cbr/\u003e\n- \u003ca href=\"https://github.com/testing-library/react-hooks-testing-library\" target=\"_blank\"\u003e_React Hook Testing Library_\u003c/a\u003e \n\n\n\n  \u003cbr/\u003e \n  \n\u003c!--======================= Social Media ===========================--\u003e\n## \u003cimg src=\"https://raw.githubusercontent.com/Tarikul-Islam-Anik/Animated-Fluent-Emojis/master/Emojis/People%20with%20professions/Man%20Detective%20Light%20Skin%20Tone.png\" alt=\"Man Detective Light Skin Tone\" width=\"65\" /\u003e Find me around the Web  \n\u003ca href=\"https://www.linkedin.com/in/shahramshakiba/\" target=\"_blank\"\u003e\n    \u003cimg src=\"https://raw.githubusercontent.com/maurodesouza/profile-readme-generator/master/src/assets/icons/social/linkedin/default.svg\" width=\"52\" height=\"40\" alt=\"linkedin logo\"  /\u003e\n  \u003c/a\u003e \u0026nbsp;\u0026nbsp;\u0026nbsp;\n  \u003ca href=\"https://t.me/ShahramShakibaa\" target=\"_blank\"\u003e\n    \u003cimg src=\"https://raw.githubusercontent.com/maurodesouza/profile-readme-generator/master/src/assets/icons/social/telegram/default.svg\" width=\"52\" height=\"40\" alt=\"telegram logo\"  /\u003e\n  \u003c/a\u003e \u0026nbsp;\u0026nbsp;\u0026nbsp;\n  \u003ca href=\"https://wa.me/message/LM2IMM3ABZ7ZM1\" target=\"_blank\"\u003e\n    \u003cimg src=\"https://raw.githubusercontent.com/maurodesouza/profile-readme-generator/master/src/assets/icons/social/whatsapp/default.svg\" width=\"52\" height=\"40\" alt=\"whatsapp logo\"  /\u003e\n  \u003c/a\u003e \u0026nbsp;\u0026nbsp;\u0026nbsp;\n  \u003ca href=\"https://instagram.com/shahram.shakibaa?igshid=MzNlNGNkZWQ4Mg==\" target=\"_blank\"\u003e\n    \u003cimg src=\"https://raw.githubusercontent.com/maurodesouza/profile-readme-generator/master/src/assets/icons/social/instagram/default.svg\" width=\"52\" height=\"40\" alt=\"instagram logo\"  /\u003e\n  \u003c/a\u003e \u0026nbsp;\u0026nbsp;\u0026nbsp;\n  \u003ca href=\"https://twitter.com/ShahramShakibaa\" target=\"_blank\"\u003e\n    \u003cimg src=\"https://raw.githubusercontent.com/maurodesouza/profile-readme-generator/master/src/assets/icons/social/twitter/default.svg\" width=\"52\" height=\"40\" alt=\"twitter logo\"  /\u003e\n  \u003c/a\u003e\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshahramshakiba%2Ftesting-reactjs-apps-basic","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fshahramshakiba%2Ftesting-reactjs-apps-basic","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshahramshakiba%2Ftesting-reactjs-apps-basic/lists"}