非同期通信のテストをする方法はいろいろありますが
今回はServiceWorkerを使った方法を紹介します

ServiceWorkerとは

ブラウザのバックグラウンドで動くJavaScript環境
サーバへのリクエストをキャッチしてゴニョゴニョできる
localhost、https環境でしか動かない

クライアント側にプロキシサーバがある感じです

ChromeのBeta版で使えるようになったプッシュ通知も
ServiceWorkerを使うことで実現してます
http://updates.html5rocks.com/2015/03/push-notificatons-on-the-open-web

まだ対応してるブラウザが少ないので使う時は注意
http://caniuse.com/#search=serviceworker

テスト方法

1.ServiceWorkerの登録

navigator.serviceWorker.registerで登録

index.html

<!DOCTYPE html>
<html lang="ja">
    <head>
        <meta charset="utf-8">
    </head>
    <body>
        <button id="btn-ajax">Ajax</button>
        <script>
            document.addEventListener('DOMContentLoaded', function() {
                var btnAjax = document.getElementById('btn-ajax');
                btnAjax.addEventListener('click', function() {
                    var xhr = new XMLHttpRequest();
                    xhr.open('GET', '/test');
                    xhr.responseType = 'application/json';
                    xhr.send();

                    xhr.onload = function(e) {
                        switch (xhr.status) {
                            case 200:
                                console.log(xhr.responseText);
                                break;
                            default:
                                console.log(xhr.statusText);
                                break;
                        }
                    };
                }, false);

                navigator.serviceWorker.register(
                    'service-worker.js',
                    { scope: '/' }
                )
                .then(function(result) {
                    // 登録成功
                })
                .catch(function(result) {
                    // 登録失敗
                });
            }, false);
        </script>
    </body>
</html>

2.ServiceWorkerの処理を設定

service-worker.js

self.onfetch = function(event) {
    var requestURL = new URL(event.request.url);
    // ↓指定のリクエストが来た時だけ処理する
    if (requestURL.pathname.match('/test')) {
        var result = [
            { id: 1, name: 'aaaaa', mail: 'aaaaa@gmail.com' },
            { id: 2, name: 'bbbbb', mail: 'bbbbb@gmail.com' },
            { id: 2, name: 'ccccc', mail: 'ccccc@gmail.com' },
        ];

        var response = new Response(JSON.stringify(result), {
            status: 200,
            statusText: 'OK',
            headers: {
                'Content-Type': 'application/json'
            }
        });
        event.respondWith(response);
    }
};