Hover states

[Designer023]

Hi,

Would it be possible to add the option to capture hover states on elements? Not sure how to flag this as an enhancement but it's not a bug :-)

Cheers,

Carl

[kdzwinel]

This is a good idea, thanks! The main issue here is that :hover is not a pseudo element but pseudo class and, therefore, I can't reuse the same solution that I used for ::before and ::after. More info here.

[Romainpetit]

If you ever find a way to have it working, that would be a good step to make Snappy Snippet even more awesome.

[cprcrack]

The lack of :hover styles is the most important issue in my opinion. I encourage you to implement it to make SnappySnipper almost perfect :)

[SebastianZ]

If you have access to browser internal functionality, you may want to use the same logic as the Force element state option within the context menu within the Elements panel uses.

Sebastian

[kdzwinel]

Only possible solution that I found so far is to use chrome.debugger API to dispatch fake mouse events. That's way too complicated though.

Maybe there is something in the remote debugging protocol that I missed? I'll have to check in the DevTools code how they do that.

[SebastianZ]

I could tell you how Firebug and the Firefox DevTools toggle the element states, though that probably doesn't help you much...

Sebastian

[rooltak]

Have you found any solution for this enhancement?

[kdzwinel]

Note to self - forcePseudoState ( https://chromium.googlesource.com/chromium/blink/+/master/Source/devtools/protocol.json )

[reggi]

This feature would be really awesome :) :+1:

[Sgouws]

Any news on this ? This would be amazing!

[KartikSoneji]

This library may be a good starting point: https://github.com/TSedlar/pseudo-styler/blob/master/pseudostyler.js

[Frank-D]

+1 on this great feature request!

I originally installed this chrome extension especially for capturing cool buttons' styling as a starting point, so obviously, without the hover effect being captured by this extension, I unfortunately had to uninstall it (...even though it's the best extension in general - apart from that - that I've found so far for capturing html/css).

For instance, extension SnipCSS does extract the hover effect, however the extension UX is not as great as SnappySnippet, and the extracted code seems to be missing a few css items since the extracted visual is not always an exact copy of what was seen on the source website, something that is obviously critical to an extension like this, and something that SnappySnippet seems to be much much better at this in terms of exact copy. Just missing the :hover effect, at least for me to download again.

Nice work though. Thanks