Transition shorthand property throws error after update on 4.0.1

[mahish]

After updating to latest version 4.0.1 Im having the following problem:

This does'nt work:

transition: opacity @duration-short @easing-in;

It throws the following error: Cannot read property 'substring' of undefined.

However, this works just fine:

transition-property: opacity;
transition-duration: @duration-short;
transition-timing-function: @easing-in;

[yocontra]

Can you test this with the less command directly? If it outputs the same thing you need to open an issue on their repository, not here since we're just wrapping that library.

If it works with that command we can look into why it doesn't work here.

[yocontra]

This could also be a plugin of yours that isn't working right - can you include the full stacktrace?

[mahish]

@contra Thanks for your feedback. No issues with direct less command. So I tried to turn off every other gulp plugin in the task and figured out it is caused by the gulp-sourcemap.

Here is my task:

gulp.task('css:styles', () => {
  return gulp.src(`${paths.src}/assets/c/styles.less`)
    .pipe(plumber())
    .pipe(sourcemaps.init())
    .pipe(less())
    .pipe(sourcemaps.write('./'))
    .pipe(gulp.dest(`${paths.tmp}/assets/c`));
});

"gulp-less": "^4.0.1",
"gulp-plumber": "^1.2.0",
"gulp-sourcemaps": "^2.6.4",

Any suggestions?:)

[yocontra]

@mahish Does the less command with sourcemaps enabled work? I still need the full stacktrace of the error to help you out.

[mahish]

@contra Yes, it does.

Error with lessc --source-map=file.map styles.less styles.css:

SyntaxError: Cannot read property 'substring' of undefined in /Users/.../components/button.less on line 62, column 3:
61   cursor: pointer;
62   transition: background-color @duration-short @easing-out;
63   border-radius: @base-border-radius;

Error with the gulp task (without plumber):

Potentially unhandled rejection [2] TypeError: Cannot read property 'substring' of undefined
    at SourceMapOutput.add (/Users/.../node_modules/less/lib/less/source-map-output.js:72:39)
    at Call.genCSS (/Users/.../node_modules/less/lib/less/tree/call.js:86:12)
    at Expression.genCSS (/Users/.../node_modules/less/lib/less/tree/expression.js:54:23)
    at Declaration.genCSS (/Users/.../node_modules/less/lib/less/tree/declaration.js:35:20)
    at Ruleset.genCSS (/Users/.../node_modules/less/lib/less/tree/ruleset.js:508:18)
    at Ruleset.genCSS (/Users/.../node_modules/less/lib/less/tree/ruleset.js:508:18)
    at SourceMapOutput.toCSS (/Users/.../node_modules/less/lib/less/source-map-output.js:123:24)
    at SourceMapBuilder.toCSS (/Users/.../node_modules/less/lib/less/source-map-builder.js:23:35)
    at ParseTree.toCSS (/Users/.../node_modules/less/lib/less/parse-tree.js:33:47)
    at /Users/.../node_modules/less/lib/less/render.js:35:40
    at /Users/.../node_modules/less/lib/less/parse.js:86:21
    at ImportVisitor.finish [as _finish] (/Users/.../node_modules/less/lib/less/parser/parser.js:240:28)
    at ImportVisitor._onSequencerEmpty (/Users/.../node_modules/less/lib/less/visitors/import-visitor.js:36:14)
    at ImportSequencer.tryRun (/Users/.../node_modules/less/lib/less/visitors/import-sequencer.js:50:14)
    at /Users/.../node_modules/less/lib/less/visitors/import-sequencer.js:19:25
    at fileParsedFunc (/Users/.../node_modules/less/lib/less/import-manager.js:63:17)
    at /Users/.../node_modules/less/lib/less/import-manager.js:137:25
    at finish (/Users/.../node_modules/less/lib/less/parser/parser.js:240:28)
    at Object.parse (/Users/.../node_modules/less/lib/less/parser/parser.js:248:24)
    at loadFileCallback (/Users/.../node_modules/less/lib/less/import-manager.js:136:68)
    at <anonymous>

[mahish]

So, it is an issue with the LESS itself, right?

[stephenlacy]

yeah, here is where the error is triggered: https://github.com/less/less.js/blob/master/lib/less/source-map-output.js#L72

[yocontra]

Yep the error is with less itself (nothing in the stack points to gulp-less) so you should open a ticket there.

[mahish]

Can we update LESS to 3.8.1 please?:)

https://github.com/less/less.js/issues/3299

[yocontra]

@mahish Just run npm upgrade to update it, this module is compatible with any 3.x release