Less-CSS3-Mixins icon indicating copy to clipboard operation
Less-CSS3-Mixins copied to clipboard

Recursive functions not working

Open tyron opened this issue 13 years ago • 5 comments

I'm trying to use a border-radius like:

body 
{
    .border-radius(20px, 20px, 20px, 20px);
}

But this triggers an error: Cannot call method 'slice' of undefined

I found out that removing the overloaded functions (with one and two parameters), the code works fine. I don't know wheter this should be reported here or in less.js repo, though.

tyron avatar Dec 09 '11 11:12 tyron

In fact, they are. I found out now that the piece of code that's triggering the error is:

.border-radius(@radius: 10px)
{
    .border-radius(@radius, @radius);
}

But it's not all the code that is problematic. It's just the default value! If I change this code to remove the "10px", it works! Guess this is a less.js subject indeed.

tyron avatar Dec 09 '11 11:12 tyron

In fact, I'll leave this issue opened, because while less.js don't accept this default value on recursive mixin, I guess there shouldn't be a default value on css3.less file.

tyron avatar Dec 09 '11 11:12 tyron

Thanks for opening the issue tyron, i'll commit a fix to the master branch this week

anthonyvscode avatar Dec 11 '11 22:12 anthonyvscode

Just to make sure... Is there any problem with the definition in the mixin or this is indeed a problem with less.js? I didn't open a ticket with them, but I believe that should be done....

tyron avatar Dec 11 '11 23:12 tyron

I'm not sure whether its a bug in their end or an intentional change that I'll need to incorporate... from my testing just then its not working in dotless css either, so it seems whatever has been changed has been mimicked in that library too.

To be fair though, default values are probably not needed for the overloads functions (my bad), you cant call the .border-radius(val, val) or .border-radius(val, val, val, val) functions without specifying all the parameters anyways (if you leave it null and just call .border-radius; from your stylesheet it calls the base .border-radius(val) function), and it seems to be cascading down ok for that. So I might just remove the parameters all together from the 2 and 4 value functions and it should fix the issue.

anthonyvscode avatar Dec 12 '11 00:12 anthonyvscode