sass-eyeglass / eyeglass-spriting

Automatically generate and consume image sprites from your Sass files.
Other
19 stars 9 forks source link

Error: error in C function sprite-position: Cannot read property 'coerce' of undefined #10

Closed alanhogan closed 9 years ago

alanhogan commented 9 years ago

This is is happening for me when I try to use sprite-dimensions or sprite-position, although core spriting functionality (glomming together images) works fine.

// Sprites for the foo_bar activity.

@import "spriting"; // eyeglass module
@import "assets";   // eyeglass module

// icon sprites
$foo-bar-sprites: sprite-map(
  'foo-bar-sprites',
  sprite-layout(horizontal, (spacing: 5px, alignment: bottom)),
  'sprites/foo_bar/*'
);

%icon-bg {
  // calling sprite-background generates the sprite map image
  @include sprite-background($foo-bar-sprites);
}

@mixin foo-bar-sprite($which-sprite) {
    @extend %icon-bg;
    @include sprite-position($foo-bar-sprites, $which-sprite);
    // // If all of your sprites are the same size, include sprite-dimensions() in %icon-bg
    @include sprite-dimensions($foo-bar-sprites, $which-sprite);
}
alanhogan commented 9 years ago

Note this is very similar to the suggested example usage, with the exception of using a mixin instead of generating class names. Also of note is that the mixin is being used from a fairly deeply nested context (I’m a big fan of SMACSS or any other methodology over nesting the crap out of things, but didn’t write the original code).

alanhogan commented 9 years ago

I’ve successfully worked around this by generating placeholder selectors for @each sprite and then @extend-ing that placeholder selector from where I wanted to use the above-defined mixin. No complications from deep nesting (or whatever the root cause was) that way, ostensibly because I call sprite-position from the safe and "shallow" context of a placeholder selector

joannajw commented 9 years ago

Thanks for pointing this out!

What value are you passing into the foo-bar-sprite mixin? Using sprite-position and sprite-dimensions in a mixin the way you have seems to work fine for me, but I am able to replicate your error when I pass the wrong sprite name into the mixin. If you have an image called foo.png in your sprites/foo_bar directory for example, foo-bar-sprite("sprites/foo_bar/foo.png") would be the right way to use the mixin (not "foo.png" or "foo_bar/foo.png"). Is it possible this is the problem?

In any case, I will look into adding some clearer error messages.

alanhogan commented 9 years ago

I’m passing in the extension-free file name, so, foo-bar-sprite('foo') in your example. I don’t think you need the full file path; I only over used e.g. "foo" in any of the cases where spriting worked for me.

What do you think about my hunch that the mixin was being called from an overly nested context?

alanhogan commented 9 years ago

I just ran into this error message again – this time with (I’m 99% sure) no mixin-based usage, just placeholder selectors (which was my “workaround” last time)

alanhogan commented 9 years ago

ha good thing I left that 1% of uncertainty – it was the same case as what failed earlier. I’d experimentally switched back to mixins 6 days ago (uncommitted) and forgotten. so.

alanhogan commented 9 years ago

Just got a similar error — 

error in C function sprite-width: Cannot read property 'coerce' of undefined

I’ll get back to you on this…

alanhogan commented 9 years ago

It's so weird, though, this only ever happens when there is a mixin in play; when I do nothing but use a placeholder selector, this error does not occur

alanhogan commented 9 years ago

Even when my mixin then @extends the placeholder selector — it blows up

alanhogan commented 9 years ago

That may have been somewhat of a red herring — I see what you’re saying about with the file name.

For example, changing sprite-width($test-sprite-map, 'images/img02.png') to sprite-width($test-sprite-map, 'img02') in the test suite results in a failure.

To me, this is somewhat unexpected as the 'sprite name' or 'sprite identifier' in most of sass-land will be just img02.

(And in Compass, sprite-width functions would accept img02 as an argument. I’m porting code over to eyeglass.)

So my follow-up question is: is there a function that is the reverse of sprite-identifier(), in that it can take a sprite-map and a sprite identifer as inputs and output the sprite path?

alanhogan commented 9 years ago

Sorry I can’t read. I’m not sure how I got so darn confused, but I’ve made a PR that should help save anyone else as illiterate as I am, the trouble. #13