382 lines
		
	
	
	
		
			15 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			382 lines
		
	
	
	
		
			15 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
<!DOCTYPE HTML>
 | 
						|
<html>
 | 
						|
<head>	
 | 
						|
	<script src="jquery-1.4.2.min.js" type="text/javascript"></script>
 | 
						|
	
 | 
						|
	<link href="qunit/qunit/qunit.css" rel="stylesheet" type="text/css" media="screen" />
 | 
						|
	<script src="qunit/qunit/qunit.js" type="text/javascript"></script>
 | 
						|
	
 | 
						|
	<script src="../client/fileuploader.js" type="text/javascript" ></script>
 | 
						|
	<script>
 | 
						|
 | 
						|
jQuery(function(){
 | 
						|
 | 
						|
    module('qq');
 | 
						|
 | 
						|
    test("contains", function(){
 | 
						|
        var el1 = document.createElement('div');
 | 
						|
        var el2 = document.createElement('div');
 | 
						|
        var el3 = document.createElement('div');
 | 
						|
        el1.appendChild(el2);
 | 
						|
        el2.appendChild(el3);
 | 
						|
        
 | 
						|
        var el4 = document.createElement('div');
 | 
						|
        
 | 
						|
        ok(qq.contains(el1,el1));
 | 
						|
        ok(qq.contains(el1,el2));
 | 
						|
        ok(qq.contains(el1,el3));
 | 
						|
        ok(!qq.contains(el1,el4));
 | 
						|
        ok(!qq.contains(el3,el2));
 | 
						|
    }); 
 | 
						|
        
 | 
						|
    test("hasClass, addClass, removeClass", function(){
 | 
						|
        var element = document.createElement('div');
 | 
						|
        qq.addClass(element, 'some-class');
 | 
						|
        ok(!qq.hasClass(element, 'some'), 'dash in class name');
 | 
						|
    });
 | 
						|
 | 
						|
    test("children", function(){
 | 
						|
        same(qq.children(document.createElement('div')), [], 'empty');
 | 
						|
        var element = document.createElement('div');
 | 
						|
        element.innerHTML = 'asdasd<div>text</div><span>asdas</span>asdasd';
 | 
						|
        same(qq.children(element).length, 2);
 | 
						|
    });
 | 
						|
        
 | 
						|
    test("getByClass", function(){
 | 
						|
        var element = document.createElement('div');
 | 
						|
        element.style.display = 'none';
 | 
						|
        element.innerHTML = '<div class="class"><div class="someclass class"></div></div><span></span><div class="test"></div><div class="class"></div>';
 | 
						|
        document.body.appendChild(element);
 | 
						|
        
 | 
						|
        var outside = document.createElement('div');
 | 
						|
        outside.className = 'outside class';
 | 
						|
        document.body.appendChild(outside);
 | 
						|
        
 | 
						|
        same(qq.getByClass(document, 'class').length, 4, 'in document');
 | 
						|
        same(qq.getByClass(element, 'class').length, 3, 'in test div');
 | 
						|
        
 | 
						|
        qq.remove(element);
 | 
						|
        qq.remove(outside);     
 | 
						|
    }); 
 | 
						|
 | 
						|
    test("obj2url", function(){
 | 
						|
        var tests = [
 | 
						|
          {title:'empty',                   obj:{}, expect:''},
 | 
						|
          {title:'general json',            obj:{a:'b',c:'d',e:'f'}, expect:'a=b&c=d&e=f'},
 | 
						|
          {title:'general json',            obj:{a:1,b:2,c:3,d:4}, expect:'a=1&b=2&c=3&d=4'},
 | 
						|
          {title:'general json array',      obj:{a:[1,2,3,4]}, expect:'a[0]=1&a[1]=2&a[2]=3&a[3]=4'},
 | 
						|
          {title:'complex json',            obj:{a:'b',c:'d',e:['f',{g:'h',i:['j',{k:'l',m:'n'}],
 | 
						|
                                                 o:undefined,p:true,q:false}]}, 
 | 
						|
                                            expect:'a=b&c=d&'
 | 
						|
                                                  +'e[0]=f&'
 | 
						|
                                                  +'e[1][g]=h&'
 | 
						|
                                                  +'e[1][i][0]=j&'
 | 
						|
                                                  +'e[1][i][1][k]=l&'
 | 
						|
                                                  +'e[1][i][1][m]=n&'
 | 
						|
                                                  +'e[1][o]=undefined&'
 | 
						|
                                                  +'e[1][p]=true&'
 | 
						|
                                                  +'e[1][q]=false'},
 | 
						|
          {title:'function',                obj:{a:function(){return 'b';}}, expect:'a=b'},
 | 
						|
          {title:'function no return',      obj:{a:function(){},undefined:'b'}, expect:'a=undefined'},
 | 
						|
          {title:'null',                    obj:{a:null}, expect:'a=null'},
 | 
						|
          {title:'prevent double encoding', obj:{a:[1,2,3],'b[]':[4,5,6],'c[d]':[7,8,9]}, 
 | 
						|
                                            expect:'a[0]=1&a[1]=2&a[2]=3&'
 | 
						|
                                                  +'b[]=4&b[]=5&b[]=6&'
 | 
						|
                                                  +'c[d][0]=7&c[d][1]=8&c[d][2]=9'},
 | 
						|
          {title:'spaces',                  obj:{a:'All your base are belong to us'}, 
 | 
						|
                                            expect:'a=All+your+base+are+belong+to+us'},
 | 
						|
          {title:'undefined simple',        obj:{undefined:undefined}, expect:''},
 | 
						|
          {title:'undefined complex',       obj:{undefined:undefined,
 | 
						|
                                                 a:{undefined:undefined},
 | 
						|
                                                 b:[{undefined:'c'},undefined,{d:'e'}]}, 
 | 
						|
                                            expect:'b[1]=undefined&b[2][d]=e'},
 | 
						|
          {title:'prefix url no params',    obj:{a:'b'}, 
 | 
						|
                                            prefix:'http://any.url', 
 | 
						|
                                            expect:'http://any.url?a=b'},
 | 
						|
          {title:'prefix url trailing ?',   obj:{a:'b'}, 
 | 
						|
                                            prefix:'http://any.url?', 
 | 
						|
                                            expect:'http://any.url?a=b'},
 | 
						|
          {title:'prefix url param',        obj:{a:'b'}, prefix:'http://any.url?foo', 
 | 
						|
                                            expect:'http://any.url?foo&a=b'},
 | 
						|
          {title:'prefix url param=value',  obj:{a:'b'}, 
 | 
						|
                                            prefix:'http://any.url?foo=bar', 
 | 
						|
                                            expect:'http://any.url?foo=bar&a=b'},
 | 
						|
          {title:'prefix url multi param',  obj:{a:'b'}, 
 | 
						|
                                            prefix:'http://any.url?foo=bar&bla=blub', 
 | 
						|
                                            expect:'http://any.url?foo=bar&bla=blub&a=b'},
 | 
						|
          {title:'prefix url array param',  obj:{a:'b',c:'d'}, 
 | 
						|
                                            prefix:'http://any.url?foo[0]=bla&foo[1]=blub', 
 | 
						|
                                            expect:'http://any.url?foo[0]=bla&foo[1]=blub&a=b&c=d'} 
 | 
						|
        ];
 | 
						|
        
 | 
						|
        for (var i = 0, l = tests.length; i<l; i++) {
 | 
						|
          //console.log('------------------ obj2url-test'+(i+1)+': '+tests[i].title);
 | 
						|
          //console.log('object: '+tests[i].obj);
 | 
						|
          //console.log('prefix: '+tests[i].prefix); 
 | 
						|
          var result = '';
 | 
						|
          if (tests[i].prefix) {
 | 
						|
            result = qq.obj2url(tests[i].obj, tests[i].prefix);
 | 
						|
          } else {
 | 
						|
            result = qq.obj2url(tests[i].obj);
 | 
						|
          }
 | 
						|
          //console.log('result: '+result);
 | 
						|
          same(decodeURIComponent(result), tests[i].expect, tests[i].title);
 | 
						|
        }
 | 
						|
    }); 
 | 
						|
    
 | 
						|
    	
 | 
						|
	var uploadTimeout = 700,
 | 
						|
		loadTimeout = 300;
 | 
						|
	
 | 
						|
    if (qq.UploadHandlerXhr.isSupported()){
 | 
						|
        $('.handlerform').remove();    
 | 
						|
    } else {            	
 | 
						|
    	//
 | 
						|
    	module('qq.UploadHandlerForm');
 | 
						|
    	//
 | 
						|
    	
 | 
						|
    	asyncTest("_getIframeContentJSON", function() {						
 | 
						|
    		expect(3);
 | 
						|
    		setTimeout(start, loadTimeout);		
 | 
						|
    		
 | 
						|
    		var exampleObject = {
 | 
						|
    		  "example" : "&a<computer networks>, to download means to receive data to a local system from a remote system, or to initiate such a data transfer. Examples of a remote system from which a download might be performed include a webserver, FTP server, email server, or other similar systems. A download can mean either any file that is offered for downloading or that has been downloaded, or the process of receiving such a file.The inverse operation, uploading, can refer to the sending of data from a local system to a remote system such as a server or another client with the intent that the remote system should store a copy of the data being transferred, or the initiation of such a process. The words first came into popular usage among computer users with the increased popularity of Bulletin Board Systems (BBSs), facilitated by the widespread distribution and implementation of dial-up access the in the 1970s",
 | 
						|
    		  "sub" : {
 | 
						|
    		    "arr": [10,20,30],
 | 
						|
    		    "boo": false    
 | 
						|
    		  }
 | 
						|
    		};
 | 
						|
    	
 | 
						|
    		var testedFn = qq.UploadHandlerForm.prototype._getIframeContentJSON;		
 | 
						|
    		
 | 
						|
    		// IE 7,8 doesn't support application-javascript, application-json, text-javascript, text-plain
 | 
						|
    		// as a response type, it also doesn't file load event when iframe loads page with 404 header		
 | 
						|
    		createIframe('iframe-content-tests/somepage.php', function(iframe){
 | 
						|
    			same(testedFn(iframe), {}, "Server didn't return valid JSON object");
 | 
						|
    		});		
 | 
						|
    		createIframe('iframe-content-tests/text-html.php', function(iframe){
 | 
						|
    			same(testedFn(iframe), exampleObject, "text-html");
 | 
						|
    		});			
 | 
						|
    		
 | 
						|
    		// test larger response (>4k)
 | 
						|
    		//http://www.coderholic.com/firefox-4k-xml-node-limit/
 | 
						|
            createIframe('iframe-content-tests/text-html-large.php', function(iframe){
 | 
						|
                same(testedFn(iframe).length, 5000, ">4k");
 | 
						|
            });         
 | 
						|
    				
 | 
						|
    		
 | 
						|
    		function createIframe(src, onLoad){
 | 
						|
    			var iframe = document.createElement('iframe');			
 | 
						|
    			qq.attach(iframe, 'load', function(){
 | 
						|
    				onLoad(iframe);
 | 
						|
    				
 | 
						|
    				setTimeout(function(){
 | 
						|
    					qq.remove(iframe);	
 | 
						|
    				}, 1);						
 | 
						|
    			});
 | 
						|
    			iframe.src = src;
 | 
						|
    			document.body.appendChild(iframe);				
 | 
						|
    		}		
 | 
						|
    	});
 | 
						|
    
 | 
						|
        test("upload, cancel with empty input", function(){
 | 
						|
            expect(1);
 | 
						|
    
 | 
						|
            var uploadHandlerForm = new qq.UploadHandlerForm({
 | 
						|
                action: 'action-slow-response.php',
 | 
						|
                onComplete: function(id, fileName, response){
 | 
						|
                    ok(false, 'onComplete should not run, the request should be cancelled');
 | 
						|
                }
 | 
						|
            });
 | 
						|
                
 | 
						|
            var input = document.createElement('input');
 | 
						|
            var id = uploadHandlerForm.add(input);        
 | 
						|
            uploadHandlerForm.cancel(id);
 | 
						|
            
 | 
						|
            try {
 | 
						|
                // should fail
 | 
						|
                uploadHandlerForm.upload(id);
 | 
						|
            } catch (err){
 | 
						|
                ok(true, "wasn't uploaded after cancelling")            
 | 
						|
            };        
 | 
						|
            
 | 
						|
        });
 | 
						|
        
 | 
						|
    	asyncTest("upload", function() {				
 | 
						|
    		expect(4);		
 | 
						|
    				
 | 
						|
    		var data = {stringOne: 'rtdfghdfhfh',stringTwo: 'dfsgsdfgsdg',stringThree: 'dfsgfhdfhdg'};
 | 
						|
    		var savedId;
 | 
						|
    												
 | 
						|
    		var uploadHandler = new qq.UploadHandlerForm({
 | 
						|
    			action: 'action-handler-test.php',
 | 
						|
    			onComplete: function(id, fileName, response){		    			    			    			    
 | 
						|
    			    ok(savedId == id, 'proper id in callback');			    
 | 
						|
    			    same(fileName, uploadHandler.getName(id), 'getName method');
 | 
						|
    			    
 | 
						|
    			    data.fileName = fileName;			    			
 | 
						|
    				same(response, data, 'server received file and correct params, filenames match');
 | 
						|
    			}
 | 
						|
    		});
 | 
						|
    			
 | 
						|
    		var input = document.getElementById('testinput1');
 | 
						|
    		qq.attach(input, 'change', function(){
 | 
						|
    			setTimeout(start, uploadTimeout);
 | 
						|
    										
 | 
						|
    			savedId = uploadHandler.add(input);			
 | 
						|
    			ok(savedId != null, 'id returned by add');
 | 
						|
    			
 | 
						|
    			uploadHandler.upload(savedId, data);
 | 
						|
    		});
 | 
						|
    	});
 | 
						|
    	
 | 
						|
    	asyncTest("cancel", function() {				
 | 
						|
    		var uploadHandlerForm = new qq.UploadHandlerForm({
 | 
						|
    			action: 'action-slow-response.php',
 | 
						|
    			onComplete: function(id, fileName, response){
 | 
						|
    				ok(false, 'onComplete should not run, the request should be cancelled');
 | 
						|
    			}
 | 
						|
    		});
 | 
						|
    			
 | 
						|
    		var input = document.getElementById('testinput2');
 | 
						|
    		qq.attach(input, 'change', function(){
 | 
						|
    			var id = uploadHandlerForm.add(input);
 | 
						|
    			uploadHandlerForm.upload(id);
 | 
						|
    			uploadHandlerForm.cancel(id);
 | 
						|
    			start();
 | 
						|
    		});
 | 
						|
    	});	
 | 
						|
    			
 | 
						|
    	test("check that forms and iframes were removed after use", function(){
 | 
						|
    		same($('form,iframe').length, 0, 'check that forms and iframes were removed after use');
 | 
						|
    	});
 | 
						|
    	
 | 
						|
        asyncTest('going back', function(){
 | 
						|
            setTimeout(function(){
 | 
						|
                var goBack = confirm("checking that the history wasn't changed, the page will go back to previous now");
 | 
						|
                if (goBack){
 | 
						|
                   window.history.back();
 | 
						|
                   
 | 
						|
                   start();
 | 
						|
                   ok(false, "the page didn't change (fails in Opera)");
 | 
						|
                }              
 | 
						|
            }, 1000);               
 | 
						|
        });    	
 | 
						|
    	
 | 
						|
	}
 | 
						|
	
 | 
						|
    if (!qq.UploadHandlerXhr.isSupported()){
 | 
						|
        $('.handlerxhr').remove();    
 | 
						|
    } else {
 | 
						|
        //      
 | 
						|
        module('qq.UploadHandlerXhr');
 | 
						|
        //
 | 
						|
    	
 | 
						|
    	asyncTest("upload", function() {		
 | 
						|
    	    expect(9);
 | 
						|
    	    	
 | 
						|
    		var data = {stringOne: 'rtdfghdfhfh',stringTwo: 'dfsgsdfgsdg',stringThree: 'dfsgfhdfhdg'};
 | 
						|
    		var onProgressCalled = false;
 | 
						|
    		var expectedId, expectedName;
 | 
						|
    														
 | 
						|
    		var uploadHandler = new qq.UploadHandlerXhr({
 | 
						|
    			action: 'action-handler-test.php',
 | 
						|
    			onProgress: function(id, fileName, loaded, total){
 | 
						|
    				if (!onProgressCalled) {
 | 
						|
    					onProgressCalled = true;
 | 
						|
    					
 | 
						|
    					same(id, expectedId, 'progress event fired with correct id param');
 | 
						|
    					same(fileName, expectedName, 'progress event fired with correct fileName param')					
 | 
						|
    					ok(loaded <= total && total > 0, 'progress event fired with possible loaded and total');
 | 
						|
    					
 | 
						|
    					same(total, uploadHandler.getSize(id), 'getSize method');					
 | 
						|
    				}
 | 
						|
    			},
 | 
						|
    			onComplete: function(id, fileName, response){    			    
 | 
						|
                    same(id, expectedId, 'progress event fired with correct id param');
 | 
						|
                    same(fileName, expectedName, 'progress event fired with correct fileName param')
 | 
						|
                                    				
 | 
						|
    				data.fileName = fileName;
 | 
						|
                    data.qqfile = fileName;
 | 
						|
 | 
						|
    				same(response, data, 'server received passed params, filenames match');
 | 
						|
    				
 | 
						|
    				same(fileName, uploadHandler.getName(id), 'getName method');    				 
 | 
						|
    			}
 | 
						|
    		});
 | 
						|
    			
 | 
						|
    		var input = document.getElementById('handlerxhr1');
 | 
						|
    		
 | 
						|
    		qq.attach(input, 'change', function(){
 | 
						|
    			setTimeout(start, uploadTimeout);
 | 
						|
    										
 | 
						|
    			var id = uploadHandler.add(input.files[0]);
 | 
						|
    			ok(id != null, 'id returned by add');
 | 
						|
    			
 | 
						|
    			expectedId = id;
 | 
						|
    			expectedName = input.files[0].name || input.files[0].fileName;    			
 | 
						|
    			if (!expectedName){
 | 
						|
    			    ok(false, 'false value as a file name used');
 | 
						|
    			}
 | 
						|
    			
 | 
						|
    			uploadHandler.upload(id, data);
 | 
						|
    			
 | 
						|
    			qq.remove(input);			
 | 
						|
    		});
 | 
						|
    	});	    
 | 
						|
        	
 | 
						|
    	asyncTest("cancel", function() {						
 | 
						|
    		var uploadHandler = new qq.UploadHandlerXhr({
 | 
						|
    			action: 'action-slow-response.php',
 | 
						|
    			onComplete: function(id, fileName, response){
 | 
						|
    				ok(false, 'onComplete should not run, the request should be cancelled');
 | 
						|
    			}
 | 
						|
    		});
 | 
						|
    			
 | 
						|
    		var input = document.getElementById('handlerxhr2');
 | 
						|
    		if (!input){
 | 
						|
    			// input removed because uploading via XHR is not supported
 | 
						|
    			return;
 | 
						|
    		}
 | 
						|
    		
 | 
						|
    		qq.attach(input, 'change', function(){						
 | 
						|
    			var id = uploadHandler.add(input.files[0]);
 | 
						|
    			uploadHandler.upload(id);
 | 
						|
    			uploadHandler.cancel(id);
 | 
						|
    			
 | 
						|
    			start();			
 | 
						|
    			qq.remove(input);								
 | 
						|
    		});
 | 
						|
    	});		
 | 
						|
	}	
 | 
						|
});
 | 
						|
	</script>  
 | 
						|
</head>
 | 
						|
<body> 
 | 
						|
	<h1 id="qunit-header">File uploader tests</h1> 
 | 
						|
	<h2 id="qunit-banner"></h2> 
 | 
						|
	<h2 id="qunit-userAgent"></h2> 
 | 
						|
	<ol id="qunit-tests"></ol>
 | 
						|
	
 | 
						|
	<p>
 | 
						|
	    Open this page via https connection, and make sure that loading bar is not acting strange after all tests are run.
 | 
						|
	    Back button test fails in Opera. 
 | 
						|
	</p>
 | 
						|
	
 | 
						|
	<p>Please select a file for each input below (in order)</p>
 | 
						|
 | 
						|
    <p>qq.FileUploader</p>
 | 
						|
    <div id="fileuploader1"></div>
 | 
						|
    	
 | 
						|
	<p>qq.UploadHandlerForm</p>
 | 
						|
	<input class="handlerform" id="testinput1" type="file">
 | 
						|
	<input class="handlerform" id="testinput2" type="file">
 | 
						|
 | 
						|
	<p>qq.UploadHandlerXhr</p>	
 | 
						|
	<input class="handlerxhr" id="handlerxhr1" type="file">
 | 
						|
	<input class="handlerxhr" id="handlerxhr2" type="file">	 
 | 
						|
		
 | 
						|
</body> 
 | 
						|
</html>
 | 
						|
 | 
						|
 |