写点什么

软件测试 | 修改特定的元素属性

  • 2023-08-26
    北京
  • 本文字数:927 字

    阅读完需:约 3 分钟

更多学习资料戳!!!

问题

编码完成、正在测试的应用很少会为了测试人员的方便而进行修改。如果你可以在浏览器中实时地修改页面,那么你就无需向应用本身添加测试代码。

另外,开发人员通常信任网页的内容保持不变。违反这一假定可以揭示出安全设计缺陷。

解决方案

按照 2.3 节,安装 Firebug。Firebug 是如此复杂的一个附加组件,它居然有自己的附加组件用来增强和扩展其功能。我们只需要 Firebug 的基本安装。

浏览到你要编辑的页面,单击浏览器窗口右下角的绿色复选框。在某些情况下,网页上可能确实有 JavaScript 错误,因此这时显示的图标可能是在红色圆圈中带个白色的 X。

在 Firebug 中找出特定元素是很容易的。你的也可以在 HTML 选项卡中浏览,直到找到该元素,或者按 Inspect 按钮并在浏览器和 Firebug 的 HTML 显示中高亮显示这个元素。这个方法也适用于 CSS 和 DOM 属性,不过你必须手动选择要修改的属性。图 3-14 显示了这种高亮显示,请亲自试验一下,确实相当直观。

元素属性实时显示在 Firebug 右下区域中,分为 3 个面板:央视、布局和 DOM 信息各占一个。在每个面板中,你可以单击任意值,这样会在原地打开一个小的文本框。如果你更改了这个值,显示的页面将立即被更新。图 3-15 向我们演示了在 HTML 窗格中编辑,将 Yahoo!标识更改为 Google 的标识。注意,这并不会修改源代码,也不会对服务器做任何调整;这些更改只出现在你的浏览器上下文中,而别人完全看不到。

在这种情况下,Firebug 与 DOM Inspector 有相似的功能,但它还包含了一个 JavaScript 控制台。它使你能够从页面本身的上下文出发执行 JavaScript。3.10 节将深入利用利用这一点,但是对于初学者而言,通过使用常见的 JavaScript 方法(比如 document. getElementById)来获取基本的 JavaScript 和 CSS 信息已经是非常简单的了。

讨论

实时地编辑页面有优势也有劣势。就是说,如果你刷新或浏览到其他页面,更改将丢失。它的好处在于,你的测试不需要更改基本代码,而且不会干扰后续测试。对于再次运行同一测试而言,这一点又令人丧气,因为目前无法再 Firebug 中保存这些编辑。

本秘诀证明了这一格言:你不能信任浏览器。这些工具可以用来观察传送到客户端的每一段代码,然后更改代码的任意部分。虽然更改发送到其他用户的内容是非常困难的,但更改显示给你的内容是相当简单的。

用户头像

社区:ceshiren.com 微信:ceshiren2023 2022-08-29 加入

微信公众号:霍格沃兹测试开发 提供性能测试、自动化测试、测试开发等资料、实事更新一线互联网大厂测试岗位内推需求,共享测试行业动态及资讯,更可零距离接触众多业内大佬

评论

发布
暂无评论
软件测试 | 修改特定的元素属性_测试_测吧(北京)科技有限公司_InfoQ写作社区