ΠΡ Ρ ΠΎΡΠΈΡΠ΅ Π·Π°ΠΏΡΠΎΡΠΈΡΡ ΡΡΠ½ΠΊΡΠΈΡ ΠΈΠ»ΠΈ ΡΠΎΠΎΠ±ΡΠΈΡΡ ΠΎΠ± ΠΎΡΠΈΠ±ΠΊΠ΅ ?
ΠΡΠΈΠ±ΠΊΠ°
ΠΠ°ΠΊΠΎΠ²ΠΎ ΡΠ΅ΠΊΡΡΠ΅Π΅ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΠ΅?
ΠΡΠΈ Π²ΡΠΏΠΎΠ»Π½Π΅Π½ΠΈΠΈ npm test
Π²ΡΠ΅ ΡΠ΅ΡΡΡ ΠΏΡΠΎΠΉΠ΄Π΅Π½Ρ; ΠΎΠ΄Π½Π°ΠΊΠΎ Π²ΡΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ npm test -- --coverage
ΠΏΡΠΈΠ²ΠΎΠ΄ΠΈΡ ΠΊ ΡΠ±ΠΎΡ Π½Π΅ΠΊΠΎΡΠΎΡΡΡ
ΡΠ΅ΡΡΠΎΠ².
ΠΡΠ»ΠΈ ΡΠ΅ΠΊΡΡΠ΅Π΅ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΠ΅ ΡΠ²Π»ΡΠ΅ΡΡΡ ΠΎΡΠΈΠ±ΠΊΠΎΠΉ, ΠΏΠΎΠΆΠ°Π»ΡΠΉΡΡΠ°, ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²ΡΡΠ΅ ΡΠ°Π³ΠΈ Π΄Π»Ρ Π²ΠΎΡΠΏΡΠΎΠΈΠ·Π²Π΅Π΄Π΅Π½ΠΈΡ ΠΈ, Π΅ΡΠ»ΠΈ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ, ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡΠ½ΡΠΉ ΡΠ΅ΠΏΠΎΠ·ΠΈΡΠΎΡΠΈΠΉ Π½Π° GitHub, ΠΊΠΎΡΠΎΡΡΠΉ ΠΌΡ ΠΌΠΎΠΆΠ΅ΠΌ npm install
ΠΈ npm test
.
Π£ ΠΌΠ΅Π½Ρ Π΅ΡΡΡ ΠΏΡΠΎΠ΅ΠΊΡ, ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΠΈΠΉ ΡΡΠ΄ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠΎΠ² ΡΠ΅Π°ΠΊΡΠΈΠΈ, ΠΊΠΎΡΠΎΡΡΠ΅ Ρ ΡΠ΅ΡΡΠΈΡΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΡΡΠΊΠΈ ΠΈ ΡΠ½Π·ΠΈΠΌΠ°. ΠΠ΅Π΄Π°Π²Π½ΠΎ Ρ ΠΏΠ΅ΡΠ΅ΠΌΠ΅ΡΡΠΈΠ» Π½Π°Ρ Ρ [email protected]
Π½Π° [email protected]
ΠΈ Ρ [email protected]
Π½Π° [email protected]
. Π― ΠΎΡΠΈΡΡΠΈΠ» ΠΊΠ°ΡΠ°Π»ΠΎΠ³ node_modules
ΠΏΠ΅ΡΠ΅Π΄ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΎΠΉ Π½ΠΎΠ²ΡΡ
Π²Π΅ΡΡΠΈΠΉ.
Π― Π·Π°ΠΏΡΡΠΊΠ°Ρ npm test
ΠΈ Π²ΡΠ΅ ΡΠ΅ΡΡΡ ΠΏΡΠΎΡ
ΠΎΠ΄ΡΡ. ΠΠΎΠ³Π΄Π° Ρ Π·Π°ΠΏΡΡΠΊΠ°Ρ npm test -- --coverage
, Π½Π΅ΠΊΠΎΡΠΎΡΡΠ΅ ΡΠ΅ΡΡΡ Π½Π΅ ΠΏΡΠΎΡ
ΠΎΠ΄ΡΡ, ΠΈ ΡΠΎΠ·Π΄Π°Π΅ΡΡΡ ΠΎΡΡΠ΅Ρ ΠΎ ΠΏΠΎΠΊΡΡΡΠΈΠΈ.
ΠΠΎΡ
ΠΎΠΆΠ΅, ΡΡΠΎ Π²ΡΠ΅ ΡΠ±ΠΎΠΈ ΡΠ²ΡΠ·Π°Π½Ρ Ρ Π½Π΅Π³Π»ΡΠ±ΠΎΠΊΠΈΠΌ ΡΠ΅Π½Π΄Π΅ΡΠΈΠ½Π³ΠΎΠΌ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ° Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΡΠ΅ΡΠΌΠ΅Π½ΡΠ°, Π° Π·Π°ΡΠ΅ΠΌ Ρ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΠ΅ΠΌ find(selector)
Π΄Π»Ρ ΠΏΠΎΠΈΡΠΊΠ° ΡΠ·Π»ΠΎΠ² Π² Π΄Π΅ΡΠ΅Π²Π΅ ΡΠ΅Π½Π΄Π΅ΡΠΈΠ½Π³Π°. Π£Π·Π»Ρ ΡΡΠΏΠ΅ΡΠ½ΠΎ Π½Π°ΠΉΠ΄Π΅Π½Ρ Π² ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ jest
, Π½ΠΎ Π½Π΅ Π²ΡΠΏΠΎΠ»Π½ΡΡΡΡΡ Π² ΡΠ΅ΡΠ΅Π½ΠΈΠ΅ jest --coverage
.
ΠΠ΅ΡΠ΅Π΄ ΠΎΠ±Π½ΠΎΠ²Π»Π΅Π½ΠΈΠ΅ΠΌ Π²ΡΠ΅ ΡΠ΅ΡΡΡ ΠΏΡΠΎΡΠ»ΠΈ Π΄Π»Ρ jest
ΠΈ jest --coverage
.
Π Π΅ΠΏΠΎ: https://github.com/nsand/jest-coverage
ΠΠ°ΠΊΠΎΠ΅ ΠΎΠΆΠΈΠ΄Π°Π΅ΠΌΠΎΠ΅ ΠΏΠΎΠ²Π΅Π΄Π΅Π½ΠΈΠ΅?
Π― ΠΎΠΆΠΈΠ΄Π°Π», ΡΡΠΎ Π²ΡΠ΅ ΡΠ΅ΡΡΡ ΠΏΡΠΎΠΉΠ΄ΡΡ Π΄Π»Ρ ΠΎΠ±ΠΎΠΈΡ ΠΈΡΠΏΠΎΠ»Π½Π΅Π½ΠΈΠΉ.
Π‘Π½ΠΎΠ²Π° Π·Π°ΠΏΡΡΡΠΈΡΠ΅ Jest Ρ --debug
ΠΈ ΠΏΡΠ΅Π΄ΠΎΡΡΠ°Π²ΡΡΠ΅ ΠΏΠΎΠ»Π½ΡΡ ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΡ, ΠΊΠΎΡΠΎΡΡΡ ΠΎΠ½ ΡΠ°ΡΠΏΠ΅ΡΠ°ΡΠ°Π΅Ρ.
node @ v6.9.1
npm @3.10.8
OS macOS Sierra
jest version = 17.0.3
test framework = jasmine2
config = {
"coverageDirectory": "/Users/dev/workspaces/component-project/.gh-pages/coverage",
"moduleNameMapper": [
[
"^.+\\.(scss)$",
"/Users/dev/workspaces/component-project/lib/styleMock.js"
]
],
"rootDir": "/Users/dev/workspaces/component-project",
"name": "-Users-dev-workspaces-component-project",
"setupFiles": [
"/Users/dev/workspaces/component-project/node_modules/babel-polyfill/lib/index.js"
],
"testRunner": "/Users/dev/workspaces/component-project/node_modules/jest-jasmine2/build/index.js",
"transform": [
[
"^.+\\.jsx?$",
"/Users/dev/workspaces/component-project/node_modules/babel-jest/build/index.js"
]
],
"usesBabelJest": true,
"automock": false,
"bail": false,
"browser": false,
"cacheDirectory": "/var/folders/46/446113_55dgdfk3jsptqtd2c0000gn/T/jest",
"coveragePathIgnorePatterns": [
"/node_modules/"
],
"coverageReporters": [
"json",
"text",
"lcov",
"clover"
],
"expand": false,
"globals": {},
"haste": {
"providesModuleNodeModules": []
},
"mocksPattern": "__mocks__",
"moduleDirectories": [
"node_modules"
],
"moduleFileExtensions": [
"js",
"json",
"jsx",
"node"
],
"modulePathIgnorePatterns": [],
"noStackTrace": false,
"notify": false,
"preset": null,
"resetMocks": false,
"resetModules": false,
"snapshotSerializers": [],
"testEnvironment": "jest-environment-jsdom",
"testPathDirs": [
"/Users/dev/workspaces/component-project"
],
"testPathIgnorePatterns": [
"/node_modules/"
],
"testRegex": "(/__tests__/.*|\\.(test|spec))\\.jsx?$",
"testURL": "about:blank",
"timers": "real",
"transformIgnorePatterns": [
"/node_modules/"
],
"useStderr": false,
"verbose": null,
"watch": false,
"collectCoverage": true,
"cache": false,
"watchman": true
}
@dmitriiabramov Π΅ΡΡΡ ΠΈΠ΄Π΅ΠΈ, ΠΏΠΎΡΠ΅ΠΌΡ ΡΡΠΎ ΠΏΡΠΎΠΈΡΡ ΠΎΠ΄ΠΈΡ?
ΠΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅ displayName
ΠΊ Π²Π°ΡΠΈΠΌ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ°ΠΌ Π΄ΠΎΠ»ΠΆΠ½ΠΎ ΠΈΡΠΏΡΠ°Π²ΠΈΡΡ ΡΡΠΎ π
Istanbul ΠΎΠ±ΡΠ΅Π΄ΠΈΠ½ΡΠ΅Ρ ΡΡΠ½ΠΊΡΠΈΠΈ Ρ Π΄ΡΡΠ³ΠΈΠΌΠΈ Π°Π½ΠΎΠ½ΠΈΠΌΠ½ΡΠΌΠΈ ΡΡΠ½ΠΊΡΠΈΡΠΌΠΈ, ΠΈ ΠΌΡ Π±Π΅ΡΠ΅ΠΌ ΠΈΠΌΡ ΡΡΠ½ΠΊΡΠΈΠΈ, ΠΊΠΎΡΠΎΡΠΎΠ΅ node Π΄Π°Π΅Ρ Π²ΠΈΠ·ΡΠ°Π»ΠΈΠ·ΠΈΡΠΎΠ²Π°Π½Π½ΠΎΠΌΡ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΡ :( - @cpojer https://github.com/facebook/jest/issues/1824#issuecomment -250376673
@nsand : ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π²Π°Ρ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ Icon
ΡΠ΅ΠΏΠ΅ΡΡ Π±ΡΠ΄Π΅Ρ Π²ΡΠ³Π»ΡΠ΄Π΅ΡΡ ΡΠ°ΠΊ:
import React from 'react';
const Icon = ({ name }) => (
<i className={`fa-icon fa-icon--${name}`}></i>
);
Icon.displayName = 'Icon';
export default Icon;
@rogeliog ΠΠΎΡΡΡΡΠ°ΡΡΠ΅! Π‘ΠΏΠ°ΡΠΈΠ±ΠΎ. Π― Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ Π½Π°Π·Π°Π΄ Π·Π°Π½ΠΈΠΌΠ°Π»ΡΡ ΠΎΡΠ»Π°Π΄ΠΊΠΎΠΉ ΠΈ Π·Π°ΠΌΠ΅ΡΠΈΠ», ΡΡΠΎ Π΅ΡΠ»ΠΈ Π±Ρ Ρ Π²ΡΠ·Π²Π°Π» children()
Π½Π° ΠΎΠ±Π΅ΡΡΠΊΠ΅, ΡΠΎ Π±ΡΠ»Π° Π±Ρ Π²ΠΈΠ΄ΠΈΠΌΠ°Ρ ΡΠ°Π·Π½ΠΈΡΠ°.
ΡΠ΅ΡΡ npm
[ { '$$typeof': Symbol(react.element),
type: [Function: Icon],
key: null,
ref: null,
props: [Object],
_owner: null,
_store: {} } ]
ΠΏΡΠΎΡΠΈΠ²
npm test - - ΠΏΠΎΠΊΡΡΡΠΈΠ΅
[ { '$$typeof': Symbol(react.element),
type: [Function],
key: null,
ref: null,
props: [Object],
_owner: null,
_store: {} } ]
Π Π°Π·Π½ΠΈΡΠ° Π² ΡΠΎΠΌ, ΡΡΠΎ ΡΡΠ½ΠΊΡΠΈΡ Π½Π°Π·Π²Π°Π½Π° ΠΏΠΎ ΠΈΠΌΠ΅Π½ΠΈ npm test
. ΠΠ°ΠΆΠ΅ΡΡΡ, ΡΡΠΎ ΠΈΠ΄Π΅Ρ ΡΡΠΊΠ° ΠΎΠ± ΡΡΠΊΡ Ρ ΡΠ΅ΠΌ, ΡΡΠΎ Π²Ρ ΠΎΠΏΡΠ±Π»ΠΈΠΊΠΎΠ²Π°Π»ΠΈ, ΠΈ Π²Π°ΡΠ΅ ΠΏΡΠ΅Π΄Π»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Π΄Π΅ΠΉΡΡΠ²ΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠ΅ΡΠ°Π΅Ρ ΠΏΡΠΎΠ±Π»Π΅ΠΌΡ. Π‘ΠΏΠ°ΡΠΈΠ±ΠΎ, @thymikee ΠΈ @rogeliog!
Π‘Π°ΠΌΡΠΉ ΠΏΠΎΠ»Π΅Π·Π½ΡΠΉ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΉ
ΠΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠ΅
displayName
ΠΊ Π²Π°ΡΠΈΠΌ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½ΡΠ°ΠΌ Π΄ΠΎΠ»ΠΆΠ½ΠΎ ΠΈΡΠΏΡΠ°Π²ΠΈΡΡ ΡΡΠΎ π@nsand : ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π²Π°Ρ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ
Icon
ΡΠ΅ΠΏΠ΅ΡΡ Π±ΡΠ΄Π΅Ρ Π²ΡΠ³Π»ΡΠ΄Π΅ΡΡ ΡΠ°ΠΊ: