Tryhoverify changelog
Tryhoverify changelog
tryhoverify.com

Hoverify 3.0.43

Copy only changes and selector

Now you can copy changes and element selector from a docked window.

copy_options.PNG

Google Fonts Support

Just type the google font name in the style editor with the properties font, font-family and font-weight. it will be automatically added.

google_font.gif

Added setting to toggle IFrame Injection

By default, Hoverify injects itself to IFrames in the pages. This can be problem in some use cases. So you now you can toggle ON/OFF IFrame injection from settings.

IFrame support for Hide/Remove Element tool

Hide/Remove tool now supports IFrames and all the elements are properly added to toolbar.

Removal of Persist setting for Hide/Remove Element tool

Hide/Remove tool use to persist all the changes done to page. This feature was found to be really confusing and was very unstable. It has been removed for now.

Bug fixes

  • In Responsive mode, macbook is not affected by portrait or landscape view.
  • In Assets, file does not pushed download button out of the view.
  • Screenshots does not fail in case of toolbar.
  • Zoom level is changed properly in settings.
  • In Inspector, font styles are removed if font shorthand is found.
  • Inspector is properly refreshed when page is hash routed.

Hoverify 3.0.40

Size of Image/Video in Assets

Asset made it really simple to retrieve assets from the page and now it also shows you size of Images/Videos extracted from the page.

update_assets_gif.gif

Color Palette

Now you can inspect color palette listed visually. You can simply click to copy colors.

3-12-2020_irvCDNbLE3.png

Fonts

Use fonts tools to browse fonts used by site.

3-12-2020_8NeUjETM3S.png

Changes in Shortcuts

New tools new shortcuts. Here are new Tools shortcuts-

  • H - Toggle Grids.
  • F - Toggle Fonts.
  • P - Toggle Color Palette.

Capture.PNG

Bug fixes

  • Built with now properly show technology information.
  • Assets show assets of the page and does not extract assets from IFrames.
  • Naming issue fixed in Assets while saving all assets.

Hoverify 3.0.36

Hosting information

Built with showed a lot of information about page except where it was hosted. Now it does that too!

built_with.PNG

Image/Video size

When you hover over <IMG> or <VIDEO>, the inspect window tells you the size of the media.

media_size.PNG

IFrame support for inspector

Now you can use inspector in IFrames with same origin on the page. There is no duplication of toolbar as previous implementation had.

Tools supported

  • HTML/CSS Inspect
  • Grids
  • Guidelines
  • Edit
  • Search

Bug fixes

Some critical bugs in inspector where fixed in this update. Here are some of them-

  • Keyframe animation properly update when changed.
  • Media queries and animations are now editable.
  • Styles can be reset even when inspect window is closed.
  • Selectors are now properly created when extra spaces are found in class attribute.
  • Hovered element is now properly detected on heavy sites.
  • In computed view var() are converted to there proper value.

Hoverify 3.0.33

Full Page Screenshot

One of the most called-for feature is here. Seize screenshot of full page by just going to the right-click menu or Hoverify's drop-down menu.

full_page.gif

Changes in Shortcuts

Since full page screenshot is here, I decided to improve shortcuts making them more accessible. Here are new Tools shortcuts-

  • ALT + I - Toggle Inspector.
  • ALT + C - Toggle Color Eyedropper.
  • ALT + R - Open page in Responsive mode.
  • ALT + S - Take screenshot of whole page.

Capture.PNG

Fixed Device Frames

When Frames are enabled in Responsive mode, IFrames do not resize, giving you accurate dimensions.

Hoverify 3.0.31

Selector mode in Inspector

View styles according to there selector. This is also applied to media queries. Please note that styles in selector mode are not editable.

selector.gif

Device Frames in Responsive

You can toggle device frames on some devices. Some new devices were also added, To get them you have to reset devices from device manager.

3-11-2020_3PM7NrAVNA.png

Save All Images in Screenshots

Screenshot have new option to save all the screenshots at once in a zip file.

3-11-2020_XMJNCUk3aQ.png

Performance Improvement on Some Sites

I found a bug were Inspector was duplicating stylesheets incrementing number of rules that inspector have to loop through. This update addresses this bug improving performance on some sites.

Removal of Iframe Support (Temporarily)

Last update introduced a basic Iframe support for Inspector. It was found that it created some feature breaking bugs in Color Eyedropper as well as Inspector itself. It is now removed temporarily and will be introduced in next update.

Hoverify 3.0.29

Tag name of Highlighted Element

Since you don't see inspector window in Edit mode, Search mode and Hide/Remove mode, It is harder know what element is selected. Therefore I added small tag name badge to the element highlighter.

marker_gif.gif

Automatically open active website in Responsive

No more get annoyed by typing URL in Responsive mode when you open it from a website.

responsive_gif.gif

Inject CSS to IFrames (BETA)

Hoverify injects itself to all the frames in the website. Although you will see multiple toolbars (one for each Frame). This will be fixed in future updates and you will only have one toolbar to control all the frames.

inspector_gif.gif

@import Rule Support

Now Hoverify supports CSS files imported through @import.

Hoverify 3.0.28

Re-wrote Inspector

Inspector mode got big update in this release. Re-writing was mainly focused on providing better support for Visual Editor which will be added later this month. This update also brought better support for pseudo classes, pseudo element, animations and media queries. And did I mentioned that you can also edit them!

edit_gif.gif

Export to Codepen

When you export to Codepen, Now html of children as well of there styling is also exported.

codepen_gif.gif

Device Name

As Hoverify is getting many users lately it can be difficult to manage your activations across all you licenses. So now you can provide a Device name which can used later for identification in the license manager. You can provide device manager either from the settings or the license manager. Hoverify will also ask for Device name at the time activation.

Hoverify 3.0.24

Re-wrote Responsive

Responsive mode had lot of issues. The biggest one being include of external file. So I re-wrote the whole mode and fixed a ton of issues. Now you don't need to include any external files to your project. it will now automatically sync scrolling and click events.

responsive.gif

Save all assets

Easily download all the assets from the page with only one click.

Capture.PNG

Hide Features from Menu

Since Hoverify is getting so many features added. The menu is getting bloated and It can get hard to find features that you use. So now you can go to settings and hide features that you don't want in the menu. You can easily enable them back.

settings.gif

Bug smashing

Bunch of bugs in inspector were fixed.

Hoverify 3.0.20

New Feature - Responsive

This update brings your new feature "Responsive" (BETA). Responsive helps you to open site in multiple device sizes. Gone days when you would drag browser window to test responsiveness of your site.

The advantage of Responsive over your browser responsive mode is that it can open multiple devices at once rather than one at a time.

Capture.PNG

Because of CORS you need to include a javascript file in your project to make it work properly.

Add this script tag in your <head>-

<script src="https://cdn.jsdelivr.net/gh/zicsus/hoverify-responsive/dist/hoverify.js" type="text/javascript"></script>

This file only takes effect when your page is opened in iframe and does not effect performance of your page. Although it is recommended to avoid this include in production if you dont want to use "Responsive" on deployed site.

If you have any question or want to report a bug, please email at tryhoverify@gmail.com or shoot me DM at @hov3rify.

Hoveirfy 3.0.1

Hoverify 3 is here 😍

You have to re-activate for this update

Re-wrote the whole extension

After the initial release of Hoverify I released that it had some serious issues in its core working. So I buckled up and re-wrote the whole extension making it more stable and flexible to changes.

New UI

UI got some major changes to make it more easy to navigate.

Inspector

Export to Codepen

Press Codepen icon in the docked inspector window to open html and css in Codepen.

DOM Traversing

Use arrow keys to traverse through DOM.

  • Arrow Up - Move to parent element.
  • Arrow Down - Move to child element.
  • Arrow Left - Move to previous sibiling element.
  • Arrow Right - Move to next sibiling element.

Hot reload

Hoverify now support hot reload and automatically starts itself when page is reloaded or redirected. This is by default on and can be easily switched off in settings.

New color eyedropper window

Color eyedropper got a whole new popup window where you can you see recent and saved colors.

Built with

Ever wondered what technologies a particular site uses, with "Built with" you know that by just going into menu and open "Built with".

Assets

Easily fetch images, svg and videos for the page by going into assets tool. You can easily download assets and can even copy svg.

New shortcuts

Tools

  • CTRL/CMD+SHIFT+1 - Toggle inspector.
  • CTRL/CMD+SHIFT+2 - Toggle color eyedropper.
  • CTRL/CMD+SHIFT+3 - Take screenshot.
  • CTRL/CMD+SHIFT+4 - Take screenshot every tab.

Inspector

  • I - Toggle inspector playback.
  • V - Change style mode.
  • SPACE - Dock inspector window
  • G - Toggle guidelines.
  • F - Toggle grids.
  • E - Toggle edit tool.
  • T - Toggle trash tool.
  • S - Toggle search tool.