1 . Add dependencies:
package.json
:
"devDependencies": {
"webpack": "^4.0.0",
"echo-members-names-loader": "1.0.1",
2 . Configure loader:
webpack.config.test.js
:
{
use: {
test: /\.css$/,
use: {
loader: 'echo-members-names-loader'
}
},
Requires
"node": ">= 6.0.0"
. ______
echo-members-names-loader
is a Webpack loader that transform any module to an object that echoes the name of any member that is accessed.
E.g.:
“Mocking” CSS Modules for test:
Having:
import styles from './Some.css'
..
<div className={styles.container}/>
In production/development environment, using css-loader
loader, it will be transform to some random string:
styles.container
=> 'AD5dsSwwe_433SA452aswg'
but for tests, using echo-members-names-loader
loader, it will be transform into accessed member’s name:
styles.container
=> 'container'
In other words:
module.memberName
=> 'memberName'
An example of use can be looked at basecode-cordova-react-ts.
echo-members-names-loader
use Proxy
and is inspired in identity-obj-proxy
[1], but implemented as a loader for webpack eliminating some checking done by the latter, that “prevent it” to run it in Non-Node environments (it accesses process.versions.node
which is not available in Non-Node environments).
[1] Which can be use in Jest, but if you prefer Jasmine, Mocha, etc. is not a solution. (Being jest a “clone” of Jasmine, there is nothing that jest does that can not done by Good “Old Fashioned” Jasmine, in fact Jasmine can do ever more - in matters of testing, not configuration).
CHANGELOG
: contains the information about changes in each version, chronologically ordered (Keep a Changelog).
MIT License ______
Don’t forget:
At life:
At work: