iframe异步加载测试篇

iframe异步加载测试篇
谈到Transformers，顾名思义“变形金刚”，卖家中心首页由各模块组成，模块可移动、删除等，大部分模块实现Iframe的异步加载。
如何进行iframe异步加载的测试，首先需要清楚，何为iframe异步加载？
iframe可在主页面的onload之前加载，也可在主页面载入之后加载。
若采用普通方法加载iframe，主页面的onload会在iframes的onload触发之后触发，所以iframe会阻塞主页面的加载。若采用异步加载iframe，主页面的onload事件触发与iframe无关，所以iframe不会阻塞加载。
普通方法加载iframe如下：
<iframe src="/path/to/file" frameborder="0" width="500" height="50" scrolling="auto"> </iframe>

[img]http://dl.iteye.com/upload/attachment/550728/ea02a364-3885-3168-ab6d-13648bd8f551.jpg[/img]

异步加载iframe如下：
createIfr: function (id, url, height) {
var ifr = document.createElement('iframe');
ifr.id = id;
ifr.src = url;
ifr.width = '100%';
if(height){
ifr.height = height + 'px';
}
ifr.scrolling = 'no';
ifr.frameBorder = 0;
return ifr;
}

[img]http://dl.iteye.com/upload/attachment/550732/6481f56c-b993-3c74-82a3-831e89847a20.jpg[/img]

掌握iframe异步加载的原理后，接下来，我们需要掌握iframe异步加载的测试并知晓iframe异步加载带来的问题。
Iframe的异步加载测试不可忽略，最重要的是会影响页面的整体加载速度，性能指标需考虑其中。
前端页面性能测试的进行不可避免。测试页面性能的工具，主要用YSlow、Dynatrace和PageSpeed。
YSlow下载及详情见http://developer.yahoo.com/yslow/
Dynatrace下载及详情见http://www.dynatrace.com/en/
Page Speed下载及详情见
http://code.google.com/intl/zh-CN/speed/page-speed/download.html
使用这几个工具进行前端页面性能测试时，性能通过指标也是因项目自身特点而定，操作详情在此不累述。
Iframe的异步加载在影响页面加载性能的同时，也给功能测试带来思考。
虽然暂时不可避免，但是发生的概率极小。
1、 异步加载在发送数据环节，有极小的可能性是会造成数据丢失，用户获得数据不完整，页面显示不正确
2、 两个用户在操作同一个页面iframe异步加载的模块，会造成用户数据在某个时刻不一致，报错“数据保存失败”
针对1，有效的手段是让客户端重新发送请求，服务端reload客户端的数据，保证数据发送的完整性。
针对2，我们无法断定这就是bug，只能说是潜在的问题。如果用户A和用户B同时操作模块，iframe异步加载发送数据，后台会对操作前和操作后的数据进行比较，判断是否一致,例如：若用户A和B操作前的数据是100，用户A操作后的数据是200，此时已经发送到后台的数据是100和200，用户B操作后的数据是300，此时发送到后台的数据是100和300，但是因为用户A操作了，造成用户B操作前的数据为200，但之前后台查询出来的是100，造成数据紊乱，后台报错，前端页面展示“数据保存失败”。
面对iframe异步加载所带来的问题，作为测试方，需综合考虑各方因素，尽量测试到位，全方位出击。