Start http web server for static page on mac

Certain web static content (like open ui5 sdk) on local disk must be served from a web server, instead of directly opening from the local file system.

On Mac, once the static web content is available on a local folder, it can be simply started from a terminal.

1. First open terminal app, and navigate to the folder contains the static web content.

2. Run the below comment with the port number as the last parameter
python -m SimpleHTTPServer 8000

3.start the browser, and visit the below url
http://localhost:8000/yourHtmlPage.html

Delay javascript starting code for debug when loading html page

1. Include the below js file in the same folder of html file and also include the js file in html file's script element.
The file is also available at  https://github.com/jonathanli2/delaystart

//delaystart.js

var originalFunc;
var waitPeriod = 30;
function setDelayAt(obj, prop, waitSeconds){
originalFunc = obj[prop];
obj[prop] = delayedStartForDebug;
if (waitSeconds){
   waitPeriod = waitSeconds;
}
}

function delayedStartForDebug() {
        var originThis = this;
        var bWait = true;
        var bDone =false;
        var i = 0
        var timer = setInterval(
                function(){
                    if (bWait && i < waitPeriod ){
                        i++;
                        console.log("set bWait to false from console window to continue");
                    }
                    else{
                        if (!bDone){
                            bDone = true;
                            clearInterval(timer);
                            originalFunc.apply(originThis, arguments);
                        }
                    }
             }, 1000);
   }

2. find a method that is used to start the application logic,  just before calling this starting method, add the below code
    setDelayAt(obj, "startingMethodName", 30);
The first parameter is the object that contains the start method, the second parameter is the start method name. The third parameter is optional for seconds to be delayed. 

Problem with javascript xhook, and an alternative for it - xhrhook

xhook is a javascript library that is used to intercept xmlhttprequests, and manipulate the request and response.

However, it needs cautions to use xhook in your javascript project, as it may cause errors if your project customizes xmlhttprequest object. For example, after including xhook.js in your html file,  calling the below code returns undefined instead of a function object as expected.

XMLHttpRequest.prototype.open 

The problem is, xhook uses an proxy approach to override the xmlhttprequest's behavior. Internally xhook overrides the xmlhttprequest construct function, and when caller calls

var xhr = new xmlhttprequest(),;

it just create and return a regular javascript object instead of a real xmlhttprequest object, and this regular javascript object has a private member which points to a real xmlhttprequest object. So when caller calls any xmlhttprequest method, the regular javascript object just forwards the call to the internal real xmlhttprequest to do the job.

Using the proxy approach gives xhook the full control of the request and response. However, the issue is although caller thinks he is dealing with a real xmlhttprequest object,  but actually it is not, so when caller talks to this fake xmlhttprequest object, it may fail to return the expected result as a real xmlhttprequest does.

So, as an alternative, if your project only needs to monitor the request and response data, but does not need to modify the response data, (you can still modify the request data), then xhook may not be the best choice. As it is more reliable and safe to return a real xmlhttprequest object to caller when it is requested,  and then just override each individual methods or event listener. Actually many projects already did the similar thing for the open or send method.

To test with this approach, a new xhrhook project has been started in github at

https://github.com/jonathanli2/xhrhook


Currently xhrhook.js only supports monitor open, send method, and onreadystatechanged and onload event listener. But it should be easy to support all methods and event listeners.

Note all event listener may not be set by application until send method is called, so a default send handler is added automatically when loading xhrhook to hook the event listener handler.