First of all nice work on this. I get the usual react and prop type warnings though wh

With ts-jest: <div class="highlight highlight-source-shell notranslate position-re

<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clip

react warnings in test console about typescript-babel-jest HOT 7 CLOSED

lozinsky commented on June 18, 2024

react warnings in test console

from typescript-babel-jest.

Comments (7)

lozinsky commented on June 18, 2024

Sorry, maybe I misunderstood, but console.warn must mocked by default?
If you want run tests without warn messages try it:

jest --silent

from typescript-babel-jest.

gentgaashi commented on June 18, 2024

Sry i said it wrong. I mean when i use ts-jest or babel-jest the annoying warnings do not appear.

from typescript-babel-jest.

lozinsky commented on June 18, 2024

With ts-jest:

 PASS  __tests__\containers\MainContainer-test.tsx
  A suite
    √ should render without throwing an error (19ms)
    √ should be selectable by class "color" (6ms)
    √ should mount in a full DOM (17ms)
    √ should render to static HTML (9ms)
    √ should change text content on click (4ms)

Test Suites: 1 passed, 1 total
Tests:       5 passed, 5 total
Snapshots:   0 total
Time:        2.965s
Ran all test suites.
  console.warn node_modules\react-addons-test-utils\index.js:33
    Warning: ReactTestUtils has been moved to react-dom/test-utils. Update references to remove this warning.

  console.error node_modules\fbjs\lib\warning.js:36
    Warning: Failed prop type: The prop `test` is marked as required in `MainContainer`, but its value is `undefined`.
        in MainContainer

  console.error node_modules\fbjs\lib\warning.js:36
    Warning: Shallow renderer has been moved to react-test-renderer/shallow. Update references to remove this warning.

  console.log app\containers\Main\MainContainer.tsx:21
    click!

It seems to me that this is normal behavior, if you want run tests without messages, you can use corresponding flag. Or am I wrong?

from typescript-babel-jest.

gentgaashi commented on June 18, 2024

weird, here is the resuult of my tests with the silent flag. works ok if i dont also add the --verbose flag. The results look a bit weird too.(Those 'RUNS' in the middle). With ts-jest this is not so, i m not gonna post it here but trust me :p. My jest config is in the next comment.

$ jest --no-cache --silent --config=jest.config.json --verbose

 RUNS  components/TopNotification/TopNotification.spec.tsx
 RUNS  components/Charts/Bar/Bar.spec.tsx
 RUNS  components/Select/Select.spec.tsx
 RUNS  components/Charts/Doughnut/Doughnut.spec.tsx
 RUNS  components/Charts/Pie/Pie.spec.tsx
 RUNS  components/Input/Input.spec.tsx
 RUNS  components/SmallIconButton/SmallIconButton.spec.tsx

Test Suites: 0 of 16 total
Tests:       0 total
Snapshots:   0 total
  console.error node_modules\fbjs\lib\warning.js:36
    Warning: Accessing PropTypes via the main React package is deprecated. Use the prop-types package from npm instead.

 node_modules\fbjs\lib\warning.js:36b\warning.js:36
    Warning: Accessing PropTypes via the main React package is deprecated. Use the prop-types package from npm instead.


 RUNS  components/TopNotification/TopNotification.spec.tsx
 RUNS  components/Charts/Bar/Bar.spec.tsx
 PASS  components\SmallIconButton\SmallIconButton.spec.tsx
  SmallIconButton
    √ renders properly into dom with custom style & callback is called when clicked (21ms)
    √ renders a disabled button with custom style, inverse prop and class (3ms)
    √ class is added when icon attribute is given (1ms)

 PASS  components\Input\Input.spec.tsx
  Input
    √ renders properly into dom and has Placeholder prop (17ms)
    √ renders an input with a "required" prop and minlength (17ms)
    √ renders an input with a passed value and maxlength (1ms)
    √ renders an input with id and type (1ms)
    √ renders an input with custom css class and style (2ms)
    √ onChange prop callback is called when a key is pressed (2ms)

 PASS  components\Charts\Doughnut\Doughnut.spec.tsx
  Chart
    √ renders properly into dom with data and props (16ms)
    √ renders properly into dom with data and different props (3ms)
    √ renders properly into dom with data and other set of props (1ms)

 PASS  components\Select\Select.spec.tsx
  Select
    √ renders properly with 1 child (21ms)
    √ renders properly with multiple children (4ms)
    √ appends onClick callback to each Option (4ms)
    √ Option renders without onClick by default (1ms)
    √ opens the list when clicked with right mouse btn (11ms)

 PASS  components\Charts\Pie\Pie.spec.tsx
  Chart
    √ renders properly into dom with data and props (21ms)
    √ renders into dom with data and different props (3ms)
    √ renders into dom with data and other set of props (2ms)

 PASS  components\TopNotification\TopNotification.spec.tsx
  TopNotification







  console.error  RUNS node_modules\fbjs\lib\warning.js:36
    Warning: Accessing PropTypes via the main React package is deprecated. Use the prop-types package from npm instead.
    √ renders properly into dom with text and no buttons by default (23ms)

 RUNS  components/TopNotification/TopNotification.spec.tsx
 RUNS  components/Charts/Bar/Bar.spec.tsx
    √ renders properly with buttons and button labels (3ms)
    √ renders properly with 1 button and button label (3ms)
    √ the proper callback is called when the Ok button is clicked (50ms)
    √ renders with proper background and no buttons when type is suces (1ms)
    √ renders with proper background and no buttons when type is error (1ms)

 RUNS  components/TopNotification/TopNotification.spec.tsx
 RUNS  components/Charts/Bar/Bar.spec.tsx
    √ renders with proper background and no buttons when type is custom (2ms)

 PASS  components\Charts\Bar\Bar.spec.tsx
  Bar Chart

    √ renders properly into dom with data and props (31ms)

    √ renders properly into dom with data and different props (6ms)
    √ renders properly into dom with data and a high barPercentage (4ms)
    √ renders properly into dom with data and a low barPercentage (1ms)



 RUNS    console.errorcomponents/Charts/Bar/ Bar.spec.tsxnode_modules\fbjs\lib\warning.js:36

  Switching: Accessing PropTypes via the main React package is deprecated. Use the prop-types package from npm instead.
    √ renders a disabled Switch with custom css class and id (5ms)
    √ renders an active Switch when a related task is already running (4ms)
    √ onClick is not called when a disabled Switch is clicked (2ms)
    √ onClick prop callback is called when the Switch is clicked (1ms)

 PASS  components\HorizontalRangeBar\HorizontalRangeBar.spec.tsx
  HorizontalRangeBar
    √ renders properly into dom progress number (6ms)
    √ renders properly with percentage even when the range is not 0-100 (2ms)
    √ just the number should exceed the range of the bar (4ms)

 PASS  components\Button\Button.spec.tsx
  Button
    √ renders properly into dom with color and label (5ms)
    √ renders a disabled button if disabled prop is passed (2ms)
    √ onClick prop callback is called when clicked (1ms)

 PASS  components\Headings\H4\H4.spec.tsx
  H4
    √ renders properly into dom with text, id and class (4ms)

 PASS  components\Headings\H6\H6.spec.tsx
  H6
    √ renders properly into dom with text, id and class (5ms)


 RUNS  components/Headings/H2/H2.spec.tsx
 RUNS  components/Headings/H1/H1.spec.tsx
 PASS  components\Headings\H5\H5.spec.tsx
  H5
    √ renders properly into dom with text, id and class (4ms)


 RUNS  components/Headings/H2/H2.spec.tsx
 RUNS  components/Headings/H1/H1.spec.tsx
 PASS  components\Headings\H2\H2.spec.tsx
  H2
    √ renders properly into dom with text, id and class (2ms)

 PASS  components\Headings\H1\H1.spec.tsx
  H1
    √ renders properly into dom with text, id and class (3ms)

 PASS  components\Headings\H3\H3.spec.tsx
  H3
    √ renders properly into dom with text, id and class (3ms)

Test Suites: 16 passed, 16 total
Tests:       47 passed, 47 total
Snapshots:   0 total
Time:        5.211s
Ran all test suites.
Done in 6.11s.

from typescript-babel-jest.

gentgaashi commented on June 18, 2024

{
  "bail": true,
  "verbose": true,
  "collectCoverageFrom": [
    "**/components/**/*.{ts,tsx}",
    "!**/node_modules/**",
    "!./lib/**",
    "!./dist/**",
    "!**/vendor/**",
    "!**/components/_utils/**",
    "!**/components/custom.d.ts"
  ],
  "snapshotSerializers": ["<rootDir>/node_modules/jest-serializer-enzyme"],
  "mapCoverage": true,
  "moduleDirectories": [
    "node_modules",
    "src"
  ],
  "moduleNameMapper": {
    "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js",
    "\\.(css|less)$": "identity-obj-proxy"
  },
  "transform": {
    "^.+\\.(ts|tsx)$": "typescript-babel-jest"
  },
  "testRegex": "(/__tests__/.*|\\.(test|spec))\\.(ts|tsx|js)$",
  "moduleFileExtensions": [
    "ts",
    "tsx",
    "js",
    "json"
  ],
  "transformIgnorePatterns":[
    "<rootDir>/node_modules"
  ]
}

from typescript-babel-jest.

gentgaashi commented on June 18, 2024

i'm new to jest, so it could be i m doing something wrong. I'm using webpack, typescript and babel in my project.

from typescript-babel-jest.

lozinsky commented on June 18, 2024

I'm sorry that I answer for a long time. As it seems to me the preprocessor should not hide errors, because the errors are made in order to correct them. You can create jest-setup.js file:

const realError = console.error;

global.console.error = errorMessage => {
  if (!errorMessage
    || errorMessage.indexOf('Accessing PropTypes via the main React package is deprecated') === -1) {
    realError(errorMessage);
  }
};

And include it to jest.config.js

{
 "setupTestFrameworkScriptFile": "jest-setup.js"
}

from typescript-babel-jest.

react warnings in test console about typescript-babel-jest HOT 7 CLOSED

Comments (7)

Related Issues (7)

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent