Chalk: Cannot read property 'hex' of undefined (only with v2.3.0)

Created on 15 Jan 2018 · 8Comments · Source: chalk/chalk

Hi,

I use chalk to add colors to console logs in a personal project (create-cozy-app) and thanks a lot for your great job on this module 👍

But something seems broken since the version 2.3.0. I use almost only the chalk.hex() method and I got this issue:

myapptest/node_modules/cozy-scripts/node_modules/chalk/index.js:82
                const open = ansiStyles.color[levelMapping[level]][model].apply(null, arguments);
                                                                  ^

TypeError: Cannot read property 'hex' of undefined
    at Function.<anonymous> (myapptest/node_modules/cozy-scripts/node_modules/chalk/index.js:82:55)
    at Object.<anonymous> (myapptest/node_modules/cozy-scripts/utils/_colorize.js:7:15)
    at Module._compile (module.js:643:30)
    at Object.Module._extensions..js (module.js:654:10)
    at Module.load (module.js:556:32)
    at tryModuleLoad (module.js:499:12)
    at Function.Module._load (module.js:491:3)
    at Module.require (module.js:587:17)
    at require (internal/module.js:11:18)

All work well with the version 2.2.2 but also if I only use default colors (chalk.blue(), chalk.bgWhite()). And it seems to concern only my webpack usage like here or here.
I suppose that came from this commit so: https://github.com/chalk/chalk/commit/7be154c074026f77b99e7d854b3a4cdd5e4ae502

Hope that will help.

bug help wanted

Source

CPatchane

Most helpful comment

Thanks to @partheseas's work mentioned in #224, I was able to distill out an even better demonstration. It's not constructor-vs-not (that was a red herring) but rather what level is enabled:

const chalk = require("chalk")

const c1 = new chalk.constructor({ level: 1 });
const c2 = new chalk.constructor({ level: 2 });
const c3 = new chalk.constructor({ level: 3 });
const c4 = new chalk.constructor({ level: 4 });
console.log(c1.hex('123')('foo'));
console.log(c2.hex('123')('foo'));
console.log(c3.hex('123')('foo'));
console.log(c4.hex('123')('foo'));

This example works, _except_ for the last line, which fails per the original description of this bug.

danfuzz on 6 Feb 2018

🎉1 👍1

All 8 comments

I just ran into this too. I narrowed it down to using hex() with a non-default instance of the object. E.g., this works:

const chalk = require("chalk");
console.log(chalk.hex('123')('foo'));

But this fails per the error in the original description:

const chalk = require("chalk");
const ck = new chalk.constructor({ level: 4 });
console.log(ck.hex('123')('foo'));

danfuzz on 6 Feb 2018

Thanks to @partheseas's work mentioned in #224, I was able to distill out an even better demonstration. It's not constructor-vs-not (that was a red herring) but rather what level is enabled:

const chalk = require("chalk")

const c1 = new chalk.constructor({ level: 1 });
const c2 = new chalk.constructor({ level: 2 });
const c3 = new chalk.constructor({ level: 3 });
const c4 = new chalk.constructor({ level: 4 });
console.log(c1.hex('123')('foo'));
console.log(c2.hex('123')('foo'));
console.log(c3.hex('123')('foo'));
console.log(c4.hex('123')('foo'));

This example works, _except_ for the last line, which fails per the original description of this bug.

danfuzz on 6 Feb 2018

🎉1 👍1

danfuzz on 6 Feb 2018

The last version of chalk 2.3.1 seems to fix my issue. What about on your side @danfuzz ?
__Edit:__ Testing your previous code, the issue seems to be still here with the level 4 usage.

CPatchane on 11 Feb 2018

@CPatchane: Yeah, I just confirmed that the problem is still present as well. Thanks for checking, too.

For convenient testing: https://runkit.com/embed/381v97r9x8mx

danfuzz on 12 Feb 2018

👍1

There is no such thing as level 4. Why are you testing for it?