Troubles using CrossriderAPI with rails 4 turbolinks - javascript

I'm having some troubles using CrossriderAPI with turbolinks, my scenario is this:
1. Going on my http://website.local/
2. running a check to see if Crossrider extension is ready:
CrossriderAPI.isAppReady('xxxxx', function(r) { if (r) (console.log('ready')) })
3. yes of course, is it.
4. Navigating through the website (using turbolinks)
5. well, troubles start by here. turbolinks change the DOM to each request, but when I retry to check if Crossrider extension is ready, and I'm investigating why, what i receive is false. It seems not see anymore our extension.
I'm debugging this code to see if I get out from this problem.
has anyone succeeded with this? Any help or advice would be great!
Antonio

I am not familiar with Turbolinks, but in general based on their GitHub readme that states that "you can't rely on DOMContentLoaded or jQuery.ready() to trigger your code", I would think that it severely impedes extensions that rely on these events as they run when the page loads.
Specifically in this instance, since Turbolinks replaces the body content, it disrupts the CrossriderAPI library that utilizes the DOM content for its operation. Hence, without considerable reworking of the code, I don't think that Turbolinks can co-exist with the CrossriderAPI and can disrupt with extension functionality.

Related

Perform action before Chrome closes itself

I'm working on Chrome extension which needs to perform an action just before Chrome closes. Is there any method like chrome.window.onClose.addListener(...), or chrome.runtime.onClose.addListener(...) to ensure that something will be done and then chrome will close itself?
I've been struggling with this problem for two weeks. Here are the options for potential solutions that I've found, but they didn't work.
My investigation results:
Using function: chrome.runtime.onSuspend.addListener(...) - I don't know why, but it doesn't work at all for me. For example, I've tried to write a callback for this event, which tries to add hardcoded data to the indexed DB, but it doesn't add it. Description of this method even says that the callback is not guaranteed to be completed. OnSuspend documentation
Sent to the event page just before it is unloaded. This gives the extension opportunity to do some cleanup. Note that since the page is unloading, any asynchronous operations started while handling this event are not guaranteed to complete.
Chrome working in a background - with this option my extensions seems to work, but... only on Windows older than Windows 10. I've checked few options and on my other computer, which has Windows 7 installed, processes connected to Chrome are closing more slowly, which gives time for my extension to perform necessary tasks. Unfortunately, Windows 10 kills all the processes much faster. I've check option "continue running background apps when google chrome is closed", but it doesn't change anything. I've also enabled flag "#enable-push-api-background-mode", it hasn't helped either.
Keep Chrome running in the background on Win10, Enable flag to keep Chrome processes running
chrome.app.window.current().onClosed - I've found a similar question on Stack Overflow, and one of the answers was the code mentioned above. The problem is when I try to type chrome.app.win... inside console, it doesn't show any suggestions both in background script and content script. Google's documentation doesn't mention any permission that I've to add inside my manifest.json to get access to this functionality.Stack Overflow similar question, Google's documentation about chrome.app
Methods build in web browser - I've thought that method window.onclose might be useful in my case. I've performed the same test as for chrome.runtime.onSuspend, but the result was exactly the same. Documentation
I've stuck and haven't got any idea how to solve my problem. Maybe I missed something important? Hope you will help me.

Loading issue with IOS 9 with cordova 4.2

I have a problem with cordova 4.2 while using Xcode 7.0.1,when I run my application on IOS9 ,loading JS files taking around 25 seconds which is very bad comparing to android.
I tried to detect the problem by putting flag ,the loading is stuck with getting the handlebars (Since I am using Ember js).
I tried to minify the hbs with no improving.
function onDeviceReady() {
Helpers.getScript('app/app.js');
Helpers.getScript('app/helpers.js');
Helpers.getScript('app/init.js');
Helpers.getScript('app/router.js');
}
Thanks in advance
Okay. If all you are doing is loading files, then there is no need to delay loading those files. The only time you want to delay loading a file *is* if you have some active code in those files.
To be clear, there are some libraries that load and become active as soon as they are loaded. Those libraries would set variables or access the system in some way. These types of libraries need to be loaded AFTER the deviceready event. Otherwise, you are free to load libraries as soon as you can, and even before the deviceready event.
On your App, I cannot say why it is delaying to start. You say 20+ seconds, and I can only think it might be the delayed library loading.
NOTE: not all apps are built the same. This means that on Android, there are libraries that come with the system, and there are libraries that Cordova adds. It might, (might be) that you are loading a larger APP on an iOS system, and that might be the delay.
In any case, let me know what you have tries, and what worked and what did not.

Firebug causes Firefox to be unresponsive

I'm a beginner web developer. I often use Firebug to debug my JavaScript.
Problem is that there are some script files from my page's UI that have a lot of code and this causes my web browser to be unresponsive, i.e. I get a dialog saying the script is unresponsive. Basically this happens when I am within Firebug's Script panel.
How can I deal with this?
I tried finding solution to this problem and nothing.
As for the answer I think the best was posted by #Pablo(can't assign answer to comment unfortunately) and it is simply trying out Google Chrome console. None of the problems I mentioned exists here.
Cheers guys!
I have had the same problem debugging some of our older scripts that make extensive use of the eval() function.
This causes many scripts to be displayed within the Script Location Menu. (Each dynamically generated script is represented there.)
A possible solution, given that it was caused by the number of files in my instance, might be to see if you can bypass the problem entirely by utilizing fewer source files for the same code. Using a 'built' version of whatever frameworks you use might alleviate the problem. (Particularly if they still are debug-able in a built form.)
If that does not work, you might try debugging using Firefox' built-in debugger (available via Ctrl+Shift+S. (Or switch to another browser to do the debugging, but that is obviously a far less desirable solution.)

Capturing the finished installing event for ActiveX

At the moment I have a custom ActiveX plugin that drops down the usual yellow bar with the install button if the user doesn't have it. When they finish installing, however, I need the page to automatically refresh. Is there a way to detect that the plugin has been successfully installed that isn't constantly polling for the plugin's presence. That is to say, not doing this:
function checkForPlugin() {
try {
control = new ActiveXObject('Object.One');
//refresh
} catch (e) {
setTimeout("checkForPlugin()" ,2000);
}
}
This doesn't seem terribly professional and I'm curious if there is a better approach I could be taking. Come to think of it...I'm not exactly sure how I'd refresh there anyway, does anyone have insight on that as well? Thanks.
Update -- I have it working using the above method and even solved the refresh issue. I'm really not thrilled with this as an implementation though. It just feels wrong to leave the browser sitting there constantly polling in the background until it gets what it wants. It's not terrible I guess but I wish there was a more clean approach. Does anyone have any ideas?
You could have your control fire an event and listen for it.
I think, capturing ActiveX install finish event is a kind of misconception.
Basically web pages run in single thread. There are no asynchronous processing such as a background installing.
In a life time of a web page, you will have the already installed ActiveX control or nothing. If control = new ActiveXObject throws, never you can instantiate the ActiveX control in this life time of the page.
That is, if the ActiveX control is not installed already you need to refresh the page to use the newly installed ActiveX control. This refresh is done automatically by the IE.
While the two answers given are perfectly valid, neither solution will really work within my time constraint or implementation. I thank you both for answering but ultimately I went with as described in my question.

browser extension to replace JavaScript file on a live site for testing

I'm looking for a browser extension (Firefox, Chrome) allowing to replace a Javascript file on a live Web site to do some testing/hacking.
Basically, it should take a URL and load another one instead (locally or on a HTTP development server).
Any idea?
Try http://www.fiddler2.com/fiddler2/version.asp
It does that and much more. But it's not a browser extension.
I think this is a task for a personal proxy. You can sniff traffic on the proxy and apply rules to modify requests/content
The Opera browser has similar functionality:
View source code of the page (Ctrl+U).
Make some changes. Or paste and replace the entire file.
Press Apply Changes in the toolbar (Ctrl+R).
For editing linked resources (such as javascript or CSS files), use the following approach:
Open the linked resource in a new tab.
View "source code" of the resource (Ctrl+U).
Make some changes.
Press Apply Changes in the toolbar (Ctrl+R).
Return to the tab with the webpage and realod (Ctrl+R).
Alternatives:
Using chrome you can change code on the fly (Developer tools -> Sources tab) and just save it (command + s)
Use the LiveReload app that actually attaches an extension (that kind of does what you want) http://livereload.com/
This may not be the "exact" answer to your question, yet I almost sure one of those will do what you want to do.
Not sure if this helps or not, but I just encountered a chrome plugin called Resource Override, which sounds like it does something similar. Im trying out the Fiddler which someone else mentioned, but I think i'm also going to try this one at some point. https://chrome.google.com/webstore/detail/resource-override/pkoacgokdfckfpndoffpifphamojphii?hl=en
You can intercept and block requests in browsers. For example in Chrome you can use the beforeload event check if it's a JS (event.target is script tag or event.url ends in .js) call event.preventDefault() and then load your own script instead.
I'm pretty sure there's a similar way to do this in FF.
There is https everywhere which lets you define rules for url rewrites. This should work on all request, including script requests.
Tamper data might do the job, but I don't know how automated/permanent you can set it up.
And there is also an extension called redirector. I didn't test that one. Potentially it only works on the address bar.
Update:
That is unfortunate. In that case probably a proxy is you only way. What about a firefox extension that is a proxy, like Foxyproxy
ColBeseder correctly brings up Fiddler (http://www.fiddler2.com/fiddler2/version.asp) as a solution to your issue.
Fiddler is perfectly capable of handling and decrypting HTTPS traffic as well - see the documentation on the page for how to configure it.
To directly answer the OP question, you can use the autoresponder feature in Fiddler to hack your production JS for testing.
Enable the autoresponder tab in Fiddler, making sure to leave pass through for unmatched requests checked, entering the URL of the JS files you want to substitute as the pattern. Select the response file from your local filesystem, and go to town!
See http://yuiblog.com/blog/2008/06/27/fiddler/ (bottom of article is most relevant) for an example.
You should probably consider robohydra, since it is specifically developed for your case. They do not support https yet, but they are open to including it in the future.
Disclaimer: I'm the author of the software :-)
A different approach that might suit your usecase better is to use a RoboHydra-based development proxy. The idea here would be that you want to keep ALL Javascript files in your machine, and use another server simply as a backend. It's great for eg. front-end developers that don't want to have the whole backend installed in their machines.
You can see the documentation, tutorials and such at http://robohydra.org/, and have an article describing exactly that usecase at http://dev.opera.com/articles/view/robohydra-a-new-testing-tool-for-client-server-interactions/.
However, as of now it can't proxy to HTTPS URLs, but that should be a trivial change that I intend to do soon anyway.
How about Greasemonkey?
That should be the thing you're searching for!

Categories