As a standard of the very lazy, I want to do a test tool, can be all the browser test results are displayed in a browser window, and listed as a clear table, easy to compare.
This will be a lovely tool, save time without saying it, and can record and compare data clearly. Let me give you some ideas. (later I will use this tool to test a JS compatibility problem, please pay attention to)
This tool has been completed, but not versatile, need to work with the background, need to interact with the database, and the performance of the background interaction is not very good, ordinary computers can not bear (my 3GHZ cpu,2g memory can not directly open multiple browser windows, may be the operation of my database is too frequent). Although the speed is acceptable on the public server, but can not be taken out for everyone to test, because more than one person to run, no good server can not stand.
The tools are js+php+mysql made, not some people imagine the integration of multiple browser engine into a software, I do not have that level.
When used, just write in JS test data and test methods, to a test instance, and then in all browsers open this window, JS will be statistical data, and then store data to the background, then JS through Ajax to get all the data, Parse it into a table and display it in a Web page. The final result is that if your computer is strong enough, all the Web pages in the browser will display a list of all the browser's test data, as follows:
Then we can compare the results. Isn't it convenient?
Principle:
First, the function is abstracted into a component, the component accepts three parameters, one is the input object group, the other is the test method, and the third is the component configuration parameter.
In the later component initialization phase, the component iterates through all the objects in the input object group, passes the object to the test method, and the test method returns a test data, which records the test results in an object.
Copy Code code as follows:
/**
* This is a test object in different browser properties of the object, can be tested in any browser, need to interact with the background script
* Please set the input data and output data, in the browser to test to open the page, the results will be attached to the list.
*
* @param {array} testobject the list of objects to be tested, each object must have a unique indicator key, and there is a description,
* Testobject format is as follows {"in1": {obj:**,des: "dd"}, "in2": {obj:**,des: "DD"}}
* @param {Function} TestMethod test method, the program will pass two parameters to this method, one object index and one object. This method can also use this to refer to the test instance, which must return a string representing the execution result
* @param {json} config parameters
*/
(function () {
var crossbrowsertest=function (testobjects,testmethod,config) {
This component has strict rules for the format of the object parameter format and data memory within the component, as well as the format of sending strings to the background, and the formatting of the back-end data in the background:
Where: Testobject format is as follows {"in1": {obj:**,des: "dd"}, "in2": {obj:**,des: "DD"}}
The data storage within the component is formatted as follows (This.data): {"in1": {des: Description, data{"IE6": {outdes: "Output in IE6"}, "IE7": {outdes: "Output in IE7"}}, "In2": ...}
When sending the data, use a function to convert JSON to a string format, which is the following function:
Copy Code code as follows:
function Obj2str (o) {
var r = [];
if (typeof o = = "string") return "\" "+o+" \ "";
if (typeof o = = "Object") {
if (!o.sort) {
R[0]= "{"
for (var i in O) {
R[r.length]= "\" "+i+" "";
R[r.length]= ":";
R[r.length]=obj2str (O[i]);
R[r.length]= ",";
}
R[r.length-1]= "}"
}else{
R[0]= "["
for (var i =0;i<o.length;i++) {
R[r.length]=obj2str (O[i]);
R[r.length]= ",";
}
R[r.length-1]= "]"
}
Return R.join ("");
}
return o.tostring ();
}
In the background, PHP converts the JSON string into an array of PHP via the Json_decode function, which is then stored in the database.
And from the database when the data, PHP from the database to take the data, transform the number of formats, and then use the Json_encode function to convert to a JSON string, to the foreground, the foreground with eval execution to get data.
In the background, the JSON data is decomposed into a strip of data, and then stored in the database, where the database read frequently, resulting in degraded performance.
The database has 6 fields: primary key, Object primary key (distinguishing different objects), browser type (the same object has different browser test results), object Description, test results, time.
The browser's type test uses the following methods:
Copy Code code as follows:
M.getbrowser=function () {
return {
This function determines the browser type and, for simplicity, returns a numeric representation,
1.ie6;2.ie7; 3.ie8;4,firefox;5.chrome;6.opera;7.safari;0. Browsers that cannot be detected
Other browsers can add themselves
Whichos:function () {
var useragent=navigator.useragent.tolowercase ();
Return (/msie 6/i.test (useragent) ==true&&1) | |
(/msie 7/i.test (useragent) ==true&&2) | | (/msie 8/i.test (useragent) ==true&&3) | |
(/firefox/i.test (useragent) ==true&&4) | |
(/chrome/i.test (useragent) ==true&&5) | |
(/opera/i.test (useragent) ==true&&6) | |
(/safari/i.test (useragent) ==true&&7) | | 0
},
Nowosstring:function () {
var useragent=navigator.useragent.tolowercase ();
Return (/msie 6/i.test (useragent) ==true&& "IE6") | |
(/msie 7/i.test (useragent) ==true&& "IE7") | | (/msie 8/i.test (useragent) ==true&& "IE8") | |
(/firefox/i.test (useragent) ==true&& "Firefox") | |
(/chrome/i.test (useragent) ==true&& "Chrome") | |
(/opera/i.test (useragent) ==true&& "Opera") | |
(/safari/i.test (useragent) ==true&& "Safari") | | Sorry, I don't know your browser! "
}
}
}()
Data is distinguished by object primary key and browser type (you can get unique data)
After the object initialization is completed, the data is processed, first in the browser, the test data is placed in a temporary object, and then the temporary object is sent through Ajax to the background, and the data is saved to the database (if it already exists).
Then set a timer, timed to the background to fetch data, this access to the data is stored in the background database, may include multiple browser data, take the data, start the DOM build function, and render function, update the content of the Web page.
The basic principle is this, that is really abstract, but I'm sorry, this thing can not be brought out to share with you, not I do not want to share, is really difficult. But if you're interested in downloading the source code, import the SQL from the source code into a MySQL table, and then configure it in the PHP file to modify the , I'm not very good with this package because it doesn't have to be too good to be reusable. There's no time for anything else.
Test Code package download
