jsFiddleのAjaxのテスト Native

Ajaxのテストテンプレート

by s_hiroshi

HTML

<div id="output">Add text after 3 second.</div>

JavaScript

// Christian Johansen (著), 長尾高弘 (翻訳) 『テスト駆動JavaScript』 ASCII
// 本を参考に下記サイトで配布されているスクリプトを変更。
// http://tddjs.com/


// jsFiddleでXMLHttpRequestのPOSTメソッドを使うテスト
// Echo Javascript file and XHR requests
// http://doc.jsfiddle.net/use/echo.html


// 名前空間処理
var tddjs = {};
tddjs.namespace = function() {
    var object = this;
    return function(name) {
        if (typeof object[name] == "undefined") {
            object[name] = {};
        }
        return object[name];
    };
}();


// XMLHttpRequestの設定処理
(function() {
    var xhr;
    var ajax = tddjs.namespace('ajax');

    // XMLHttpRequestの候補
    var options = [
        function() {
        return new ActiveXObject('Microsoft.XMLHTTP');},
        function() {
        return new XMLHttpRequest();}
    ];

    // 機能検出を使いクロスブラウザに対応する
    // option[i]()でXMLHttpRequestの生成に成功したらajax.createに登録
    var i, l;
    for (i = 0, l = options.length; i < l; i++) {
        try {
            xhr = options[i]();
            ajax.create = options[i];
            break;
        } catch (e) {}
    }

    // HTTPのレスポンスコードが200なら成功処理


    function requestComplete(transport, options) {
        if (transport.status == 200) {
            options.success(transport);
        }
    }


    // 公開用メソッド
    function _request(url, options) {
        if (typeof url != 'string') {
            throw new TypeError('URL should be string');
        }
        if (options.method !== 'POST') {
            throw new TypeError('method is only post');
        }
        var transport = ajax.create();
        transport.open(options.method, url, true);
        transport.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        // onreadystatechangeにイベントハンドラ登録
        transport.onreadystatechange = function() {
            if (transport.readyState == 4) {
                requestComplete(transport, options);
            }
        };
        // POSTメソッドでリクエスト送信
        // sendメソッドの第一引数はkey1=value1&key2=value2...のフォーマットをした文字列
        //...