We Keep Coding

import or require any library in browser console

While debugging application most of the time I feel like it would hve easier if I could include any library into browser console and try some of the function from that libraty.
Now in modern javascript/es6/es6/typescript world is there any thing short and quick available to to import a script instantly to the brower so that it can be used to directly
Example
While debugging, if I want Observable I should be able to do something like this
import {Observable} from 'rxjs/Observable'; //typescript way
const Observable= require('rxjs/Observable'); // require way
But these are not working.
already explored dynamic <script> tag
I already explore old way to dynamically using the <script> tag like below but its dificult for large number of libs and also not elegant
var jq = document.createElement('script');
jq.src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js";
document.getElementsByTagName('head')[0].appendChild(jq);
// ... give time for script to load, then type (or see below for non wait option)
jQuery.noConflict();

Some browsers (including Chrome) can use snippets in console, either as built-in features or extensions.
One-liner script to do this is
document.head.appendChild(Object.assign(
document.createElement('script'),
{ src: '...' }
));
Considering that most websites already have jQuery loaded (even if they don't, this can be handled by browser extensions, such as Chrome jQuery Injector) it can be shortened to:
$.getScript('...');
Any piece of code that should be always available in console can also be exposed as global function with user scripts (Tampermonkey in Chrome, etc), with some limitations imposed by user script security.
This will probably will be possible with dynamic import(), which is currently stage 3 proposal and isn't implemented in browsers.
A suitable solution that works for most major libraries the one may be curious to quickly experiment with is to navigate to official library website and open the console. Due to the fact that the websites often provide live examples, relevant variables are exposed to global scope. Known examples are $ for jQuery, angular for AngularJS, ng for Angular, Rx for RxJS, moment for Moment.js...

Automatically eval a local script on a specific URI in Firefox

I want to improve an existing website (I have no access to) by using my own javascript.
This means I have to add an < script > to the < head >. I am currently doing this by clicking on a bookmark which has something like this as its target:
javascript: if(document.createElement){
void(head=document.getElementsByTagName('head').item(0));
void(script=document.createElement('script'));
void(script.src='http://local/script.js');
void(script.type='text/javascript');
void(head.appendChild(script));
} // i added some spacer to make it readable
This works fine, but since i've got a lot of different scripts it gets complicated to organize them.
I am now looking for a way to automatically insert a defined script-uri if the top.location.href matches a given string.
Is there a way firefox can do something like this - maybe with the help of an add-on?

Userscripts are what you're looking for. Use Greasemonkey for Firefox to run your own script on specific sites.

https://addons.mozilla.org/en-US/developers/docs/sdk/1.12/modules/sdk/page-mod.html uses the add-on sdk, and provides precisely what you're looking for (i.e. an easy way to attach a script to a webpage if it matches a given domain). That gives you the option of making your addon a standalone one easily; moreover, if you were to extend its functionality significantly, the addon sdk would certainly be the way to go!

How to force update of design changes to clients using xPages?

I am bulding a webpage using xPages and I am making constant changes to script and design, this include both server and client javascript , stylesheet and image changes.
Each time I change a javascript or stylesheet I want to see my changes in the webbrowser and I also want my users to get the latest changes when they access the webpage.
I know I can use Shift-Reload, or CTRL-reload and clear my webbrowser cache. and I also know that I can change the objects expiration date, but I want a smoother and better controlled way to do this.
Looking for any kind of best practice for doing this.
Thanks
Thomas

In the xsp.properties file for the application or on the server for server wide use you can set xsp.application.forcefullrefresh=true. The xsp.properties file documentation says:
# Application refresh
# When this property is set to true, then a full application refresh is requested when
# the design of a class changes (means that all the data are discarded in scopes).
# xsp.application.forcefullrefresh=false
The new XSP Portable Command Guide says "This property was introduced in Notes/Domino 8.5.3. It is set to false by default and is particularly useful during the development phase of an XPages application."
I have not fully tested this behavior but it sounds promising. You could/should of course only set it to true WHILE you make the changes. once stable, set it back.
/Newbs

Adding to Ferry's answer and your comment;
Instead of "?dummy=randomvalue", you can use "?version=2.1". So it will be cached but when you change design, you can just increase the version.
There's a problem with this approach as some proxy servers won't cache anything with query params. Better to rename the file directly, adding date or version number to it. It will always work.
To disable caching temporarily use Fiddler2. It's easy to enable and disable in one place across any web client. As well as added benefits for the http request tracking features.

To fully disable any caching add url + '"?dummy=" + #Unique();' to every url to javascript or image files...

The way I am reading this question is that you want every change you make to appear immediately on the client's browser or client. Are you really sure you want to do this? It sounds like you are not doing any testing so any typos, bugs, crashes, etc will be passed on to your users. Sounds like a bad plan to me. I hope I am wrong and that you are using a template and pushing only your fully tested changes up to an production version instead of making the changes in the production version.
I would just put out a schedule of when changes are going to be pushed up to production and let the users reload their browser or client at that time. Either that or do it during off hours and when they next log on, they get the newest changes.

Adding to Ferry's answer and your comment;
Instead of "?dummy=randomvalue", you can use "?version=2.1". So it will be cached but when you change design, you can just increase the version.

maybe you could look at how domino can control caching of url's.
http://www.ibm.com/developerworks/lotus/library/ls-resp_head_rules/

NEwbs answer is a good one but it is useful to note that in Firefox there is a very useful plug in called "web developer" from Chris Pederick that allows you to disable the cache.
http://chrispederick.com/work/web-developer/
The other really useful one is Firebug which is just amazing - It makes any HTML work much easier
https://addons.mozilla.org/en-US/firefox/addon/firebug/

I did found another solution by putting my css and js in a theme it is easy to just rename the files.
as described here
http://goo.gl/vFTii

Why do not we use the window.location.reload()...
Which does the same like ctrl+F5
It reloads the page, which is similar to context.reloadpage

jsdom not loading or not running external scripts in page

Cross-posted from https://github.com/tmpvar/jsdom/issues#issue/127
I will post a minimal test case in the next day or so - but I wanted to see if anyone else had the same problem - or if (more likely) if I am doing something stupid.
I'm using NodeJS v2.6 on Ubuntu 10.04 AMD64 and jsdom#0.1.23.
var file = readFileSync("./www/index.html", "utf8");
var window = jsdom.jsdom(file).createWindow();
All inline scripts run, but complain about missing variables which should be supplied by the external scripts.
I have tried setting a url in the options and I have tried using full (http://...) urls in the src attributes,
I have tried jQuerify (using default jQuery path) and that works fine, though it only brings in jQuery and I'm still missing all of the other scripts.
Any pointers before I post failing code/urls?
Thanks,
Chris.

As of jsdom 0.2.0 this has become much easier. Please see the "Easy mode" section in the readme. jsdom.env() will not execute scripts found in the page by default making what you are trying to do, much easier.

I removed all in-line Javascript from the page - luckily the page is under my control.

How to open QTP from JavaScript without using ActiveXObject?

i need to invoke QTP from a javascript without using ActiveXObject. can anybody guide me how to proceed with this?
Thanks,
Ramya.

Java Script programming cannot be done in QTP but it will
support Java script. We can make a DLL by using Java script
and add that to QTP and there after you can use that.
Regards,
Mannusanghi

QTP supplies a COM interface for automation, in order to create the automation object you need to use ActiveXObject (see this article on using OLE Automation in Javascript).
Why do you want to avoid using ActiveXObject?

Any particular reason why you don't want to use the ActiveXObject?
Anyhow, if you're running JavaScript through the Windows Script Host, instead of the way mentioned in the manual:
var qtApp = new ActiveXObject("QuickTest.Application");
...you can do this:
var qtApp = WScript.CreateObject("QuickTest.Application");
qtApp.Launch();
qtApp.Visible = true;
But you be might using ActiveX behind the scenes there anyway, I'm not entirely sure.