jenniferabowd / jest_webpack_example Goto Github PK

Hi, this example has become a bit stale. I'm hoping someone can help modernize this example to help others during Hacktoberfest. If it doesn't happen, that is okay, but maybe this can be a good chance for someone to participate. I'm making several tickets to help break this up into chunks. I'm happy to help people, but I don't have much time to rewrite this code.

Can someone upgrade Webpack to the current version please?

Currently, there is no hot re-loading in this app. It would be awesome if someone added it in. Currently, you need to run the app by doing npm run watch and npm start in two different terminal windows.

The versions of various babel packages used are over 5 years old. It would be very helpful if someone upgraded those.

package.json jest properties could further be detailed providing code coverage (or maybe additional sonar integration)

This example is very convoluted. I think we can just remove the server to simplify it.

in teamAmerica.test.js
I added one line

import swal from 'sweetalert2';

and

npm run test

//red color messages seem there is an error
@Keyframes swal2-rotate-loading {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg); }
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg); } }

Test Suites: 1 passed, 1 total
Tests: 1 passed, 1 total
Snapshots: 1 passed, 1 total

Is this successful?

Hi, this example has become a bit stale. I'm hoping someone can help modernize this example to help others during Hacktoberfest. If it doesn't happen, that is okay, but maybe this can be a good chance for someone to participate. I'm making several tickets to help break this up into chunks. I'm happy to help people, but I don't have much time to re-write this code.

It would be really helpful for someone to upgrade this to the current version of React.

The error below is returned when running jest

PASS reactTests/tests/teamAmerica.test.js
✓ test to see if the team renders correctly (22ms)

Test Suites: 1 passed, 1 total
Tests: 1 passed, 1 total
Snapshots: 1 passed, 1 total
Time: 1.451s
Ran all test suites.
console.error node_modules/fbjs/lib/warning.js:33
Warning: Each child in an array or iterator should have a unique "key" prop.

Check the render method of `TeamAmerica`. See https://fb.me/react-warning-keys for more information.
    in div (created by TeamAmerica)
    in TeamAmerica

This example is very convoluted due to some decisions made several years ago. I think it would be great to just remove redux. I also don't think we need the server, but that can be a separate ticket.

Dynamic imports (import("foo").then(foo => foo("bar")).catch(()=>console.log("import error")) are actually not supported in Node. As I understand it, these are transpiled to CommonJS imports before running the tests. There may be a need to help people understand how to mock success and failure of these imports in their jest tests.

The version of Jest in this repo is at least 5 years old. It would be very helpful if someone were to upgrade it.

jest

FAIL reactTests/tests/teamAmerica.test.js
● Test suite failed to run

Cannot find module 'react/lib/ReactComponentTreeHook' from 'ReactDebugTool.js'
  
  at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:179:17)
  at Object.<anonymous> (node_modules/react-test-renderer/lib/ReactDebugTool.js:16:30)

Test Suites: 1 failed, 1 total
Tests: 0 total
Snapshots: 0 total
Time: 1.106s
Ran all test suites.
npm ERR! Test failed. See above for more details.

Currently, there are three separate commands for build, watch and start. It would be amazing if someone combined them into one command.