What is happening after dismissing alert and how to simulate it? - javascript

I have this strange issue with web app I am working on. Basically there is a UI error, that after pulling menu from the side and closing it again, the whole DOM is moved half off the screen.
The interesting part is that if I call alert(); after the menu slides out again, something happens with the view and page is displayed correctly again.
I have tried to re-render dom by hiding it and showing again, but it doesnt have the same effect.
Does anyone know what happens when alert window is displayed/closed and if there is any way to simulate it in JS?
Thanks
UPDATE: Just so you can see I didn't make that up: https://github.com/jakiestfu/Snap.js/issues/238

Related

The DOM is loading but is not displayed without clicking on screen mobile Vue.js

I have a very strange problem that I really don't know how to solve.
When I'm on my mobile, my page loads as follows homepage
But when you click on the screen all the components appear.
Can I generate a fake click on my mobile or something?
I really have no idea what's going on
I would also check how the scripts load, I have nothing to do with async defer
Do you think that a fake click would solve me?
For example, when it loads its page to click / touch on the mobile?
You have to selected an element and then you can call click()
document.getElementById('yourelement').click()
This should go on your mounted() default layout.

Modal disappearing in wrong place after animation is finished

I’m having a problem with a modal in react native. Whenever I close the modal, it animates down to this point, then just disappears. How can I fix this and make it happen under the tab control like it’s supposed to?

pebble.js blank page when back is pressed

i wrote a pebble.js app, basically it shows a splash screen and a menu showing bus stops. when the user press select button on a menu item a "card" is showed with the arrival info.
however, sometimes menu items are not showed correctly (some menu items disappearing) and when i press back in the menu screen instead of closing the app a blank "page" is showed.
i dont know what i'm doing wrong. i was thinking of memory leaks but honestly i dont know...
heres the source in case someone kind wants to help me : http://pastebin.com/92xbVs2F
This is now fixed in Pebble.js. Your app is magically fixed as well since it was pushed to CloudPebble.
If you'd like to know the technical details, it's because Menu Layer in the C API is normally not allowed to override the back button. As a work around, Pebble.js is currently using a blank window to catch the back button, but this hack only works if the menu is not the root window of your application. The fixed version no longer uses a blank window to catch the back button and overrides the back button in an obtuse way.

waitForKeyElements(); - Stop a script firing on a popup in Chrome Extension?

This question is a follow-on to another question which needed asking and warranted a new post, so excuse me if I refer to things which may not be clear without reading the other question.
When using the utility waitForKeyElements() I'm facing an issue in which a div is included inside a small popup contained within the same URL. My extension is currently running on the Twitter site, and my intention is that a div contained on the profile pages (e.g. http://twitter.com/todayshow) gets moved above another div on the page. I'm doing this via waitForKeyElements() because of some loading issues which are resolved by using this utility.
However, on a profile page you can click a link to another users name which pops up a small window (inside the same window/tab, on the same URL) showing some info about them and a few previous tweets. The issue here is that the same div appears on this popup and is then moved to the main page behind the popup window, where it shouldn't be. On a profile page, this can be stopped by plugging in the false parameter to waitForKeyElements(), however on a non-profile page it is still possible to activate this popup which is then moving onto the main page, as the div I wish to move it above on a profile page still exists here, causing clear issues.
I'm wondering if there's a way around this, as bugs in Chrome have stopped me from excluding these pages. So far (just brainstorming) I'm thinking:
on a page where the div doesn't exist to begin with, create an empty one meaning false will handle the issue.
somehow stop the script from firing on a given URL, although due to the way Twitter works this would have to monitor OnClick() and the page URL (I think) which I'm unsure how to do.
stop running when the popup appears, but I have almost no idea where to start with that.
Any help is appreciated. Any necessary code related to this question can be found in the first two links, and the issue I'm facing can be seen by a quick visit to Twitter.
EDIT: When plugging in the false param it works when going directly to profiles via the URL bar, if you're on a profile and use a link to get to a profile, the script isn't inserted and my extension fails. So this would need resolving too, or an alternative method altogether.
I had a brainwave that I could use insertAfter() to insert the <div> I was originally moving in front of, after the <div> I was originally moving. This <div> is not present on the popup, which means that nothing is moved onto the back page when it shouldn't be.
In regards to the previous question, my code is now simply:
waitForKeyElements (
"jQuery selector for div(s) you want to move", // Opposite to what it was.
moveSelectDivs
);
function moveSelectDivs (jNode) {
jNode.insertAfter ("APPROPRIATE JQUERY SELECTOR"); // Again, the opposite.
}
This solves the issue I was having and my extension is now working just fine, however I will leave this question posted in case anybody comes back to it in future.

Jquery - Customizing the colorbox plugin

I'm using the colorbox plugin for modal popups. It's working nicely, but there's a main thing about it that seems wrong.
I have a form that pops up, and on submitting (or clicking a link) in the form, this might open another "colorbox" modal. It works smoothly, but there's one thing that bothers me.
As it is, colorbox seems to wait until it receives the response (via ajax) and then shows a "loading.gif" and starts to change size.
To me it makes more sense to have the "loading.gif" show as soon as they are opening a new colorbox modal. (and not just the image, I just mean that whatever happens when you open a new colorbox) It doesn't have to resize (obviously) but it's just annoying because some of my colorbox modals use webservices that are slow, so you might submit a form and nothing happens for literally 1 or 2 seconds. It'd be nice if it just would look like it was loading the next one for that time.
Ideas on how to do this?
It looks like the loading graphic is being shown onLoad, and the script tries to figure out the content type before this point. So if you have a slow web service, it may take time to realize the content type, thus not showing the loading.gif.
I did a quick test, and displaying the gif onOpen seems to work:
$(".myClass").colorbox({
onOpen:function(){
// taken from colorbox.css
$('#cboxLoadingGraphic').show();
},
onComplete:function(){
$('#cboxLoadingGraphic').hide();
}
});

Categories

Resources