search

GoogleChromeLabs / ProjectVisBug

FireBug for designers › Edit any webpage, in any state https://a.nerdy.dev/gimme-visbug
https://visbug.web.app
Apache License 2.0
5.47k stars 287 forks source link

Undo Changes Made With VisBug #559

Closed geenius-cloud-admin closed 2 years ago

geenius-cloud-admin commented 2 years ago

I urgently need help as I need to undo the changes that I accidentally made with VisBug. Linked below is a video that shows the problem.

I installed VisBug in Chrome and played around with it in my BubbleIO project. As you can see in the video, now my page automatically is resizing my top nav bar and my side nav bar to the right and to the bottom, past the viewport height and width. I can see that the Flexbox is being adjusted and manipulated in the Console but I don't know how to undo this behavior.

In order to see the behavior on the page itself, here is the link: https://launchhaus.co/version-test/token-stream

Reproduction video: https://share.cleanshot.com/qOoVvM

argyleink commented 2 years ago

a couple thoughts!

  1. visbug doesnt do anything permanent to a page, you've reloaded and the problem persists?
  2. did you by chance try the resize plugin that tests your site's fluidity?
geenius-cloud-admin commented 2 years ago

Hello Adam!

Thank you for the quick response, I appreciate it.

Yes, I have reloaded the page many times, both inside my dev environment in the Bubble project and on the front end preview in Chrome, but the behavior continues to persist: when I shrink down the page to 960 and below, the flexbox begins to adjust back and forth as seen in the video.

And I’m not sure about the resize plugin to be honest, do you mean the flex control that is in the controls strip of VidBug chrome extension?

Best,

Vadim Vozmitsel 415.412.9611 @.***

On Tuesday, Jun 07, 2022 at 2:05 PM, Adam Argyle @. @.)> wrote:

a couple thoughts!

visbug doesnt do anything permanent to a page, you've reloaded and the problem persists? did you by chance try the resize plugin that tests your site's fluidity?

— Reply to this email directly, view it on GitHub (https://github.com/GoogleChromeLabs/ProjectVisBug/issues/559#issuecomment-1149166454), or unsubscribe (https://github.com/notifications/unsubscribe-auth/ADKEHPDTHP62FCETHWJHCOTVN62RTANCNFSM5YEERATA). You are receiving this because you authored the thread.Message ID: @.***>

argyleink commented 2 years ago

gotcha. a few more thoughts:

  1. visbug doesnt do anything to a page until it's launched. so if you reload the page and don't load visbug, nothing about visbug is running. if you're doubtful, it's easy to "disable" an extension without removing it, and this may help you rule out visbug
  2. the resize plugin isn't the flexbox tool in the controls strip nope, so we can cross that out as a culprit.

oh, i see, there's an animation happening that's causing the page to scroll. i spent 5 minutes trying to find it but wasnt able to. i suggest reviewing your animations/transitions that involve left or translateX, as they can move and cause overflow (or scrollbars). happy hunting!

geenius-cloud-admin commented 2 years ago

Ah, thank you so much! That was it, I went through a bunch of the elements and indeed, I’m using a CSS plugin that slowly rotates elements and that was extending past the boundaries.

Appreciate your help. I will be spending more time with VisBug to figure out how to best incorporate it into my workflow, seems like a very powerful tool, I just wasn’t sure how to really go about using it since I am already in a visual editor inside Bubble.

Best,

Vadim Vozmitsel 415.412.9611 @.***

On Tuesday, Jun 07, 2022 at 2:17 PM, Adam Argyle @. @.)> wrote:

gotcha. a few more thoughts:

visbug doesnt do anything to a page until it's launched. so if you reload the page and don't load visbug, nothing about visbug is running. if you're doubtful, it's easy to "disable" an extension without removing it, and this may help you rule out visbug the resize plugin isn't the flexbox tool in the controls strip nope, so we can cross that out as a culprit.

oh, i see, there's an animation happening that's causing the page to scroll. i spent 5 minutes trying to find it but wasnt able to. i suggest reviewing your animations/transitions that involve left or translateX, as they can move and cause overflow (or scrollbars). happy hunting!

— Reply to this email directly, view it on GitHub (https://github.com/GoogleChromeLabs/ProjectVisBug/issues/559#issuecomment-1149177016), or unsubscribe (https://github.com/notifications/unsubscribe-auth/ADKEHPHXZOLSOA4QICQWEXLVN637ZANCNFSM5YEERATA). You are receiving this because you authored the thread.Message ID: @.***>

argyleink commented 2 years ago

have fun hackin! glad i was helpful