jedfoster / SassMeister

The Sass playground
http://sassmeister.com
199 stars 25 forks source link

Allow configuration to output @warn @debug #123

Closed KatieK2 closed 8 years ago

KatieK2 commented 9 years ago

Sassmeister doesn't output @warn and @debug directives. Ex:

http://sassmeister.com/gist/c7c72e2c5f53ab4d4059

It would be nice if there were a configuration option to show this debug information.

blackfalcon commented 9 years ago

How would you propose SassMeister output that? The @warn directive outputs in the terminal. SassMeister does not have a terminal view.

jedfoster commented 9 years ago

I thought I had documented my thoughts on this, but I can't find anything on #11 or #73.

This feature is on the roadmap, but I do not have an ETA yet. Ace has a feature that would let me add annotations to lines: screen shot 2014-10-03 at 2 17 50 pm

This is how those would be displayed. Same with @debug. The idea came from #52.

The problem is less UI and more plumbing. Can I even get @warn from Sass::Engine? What about node-sass? I don't know.

I've been thinking about this for a while. This is the third or fourth request for this feature in just the last two weeks, so I should bump it up in priority.

KatieK2 commented 9 years ago

Cool - thanks for thinking about it. Sorry that I didn't find any previous Issues when I searched.

Undistraction commented 9 years ago

If getting hold of the @debug and @warn message is painful, another way to handle this would be to bake-in some mixins for people to use:

@include debug('Some message here');

I'm assuming most people doing debug: $example to get debug info to display, so perhaps this would give you a standardised way to parse / style debug data or warnings?

Might be a nice stopgap?

lunelson commented 9 years ago

Maybe you could ping the codepen people, as that's what they've done, although they obviously only implement ruby-sass

mangelozzi commented 3 years ago

To anyone trying to see the values of maps etc in Sass meister, I eventually figured out meta.inspect:

@use "sass:meta"

$palette : ("fg": (#202124, #ffffff))

.foo
    showme: meta.inspect($palette)

generates

.foo {
  showme: ("fg": (#202124, #ffffff))
}