《手把手教你》系列技巧篇(四十五)-java+ selenium自动化测试-web页面定位toast-上篇(详解教程)

简介: 【5月更文挑战第9天】本文介绍了在Appium中处理App自动化测试中遇到的Toast元素定位的方法。Toast在Web UI测试中也常见,通常作为轻量级反馈短暂显示。文章提供了两种定位Toast元素的技巧.

1.简介

在使用appium写app自动化的时候介绍toast的相关元素的定位,在Web UI测试过程中,也经常遇到一些toast,那么这个toast我们这边如何进行测试呢?今天宏哥就分两篇介绍一下。

2.什么是toast?

  Android中的Toast是一种简易的消息提示框。当视图显示给用户,在应用程序中显示为浮动。和Dialog不一样的是,它永远不会获得焦点,无法被点击。用户将可能是在中间键入别的东西。Toast类的思想就是尽可能不引人注意,同时还向用户显示信息,希望他们看到。而且Toast显示的时间有限,Toast会根据用户设置的显示时间后自动消失。在Web中和在Android差不多一样。toast属于一种轻量级的反馈,常常以小弹框的形式出现,一般出现1到3秒会自动消失,可以出现在屏幕上中下任意位置,首先来看下web页面上的toast是什么样子的。

3.定位toast

如何定位这种toast类的元素了,在我们一眨眼的瞬间,就消失不见了,不要着急听宏哥给你慢慢道来。

3.1第一种方法

1.怎么定位呢?宏哥给大家介绍一个小技巧。打开chrome进入F12页面进入到Sources,如下图所示:

2.点击暂停,然后在通过Elements定位。如下图所示:

3.点击“点击关注”按钮后,然后再点击“下一步”按钮,直到出现toast元素:“感谢关注:北京-宏哥”。如下图所示:

4.切换到“Elements”界面,通过正常定位来查看元素,如下图所示:

3.2第二种方法

1.怎么定位呢?宏哥给大家介绍一个小技巧。打开chrome进入F12页面进入到Sources,如下图所示:

2.在JavaScript中找到让toast元素消失的代码,点击代码行前边,打一个断点。如下图所示:

3.点击“点击关注”按钮后,代码运行到断点处停止,然后出现toast元素:“感谢关注:北京-宏哥”,不会消失。如下图所示:

4.切换到“Elements”界面,通过正常定位来查看元素,如下图所示:

4.自动化项目实战

宏哥找了好久没有找到,宏哥就参照网上的toast源码修改给一个小demo,进行自动化测试。

4.1demo页面的HTML代码

1.html代码:toast.html。如下:

<!DOCTYPE html>

<html>

<head>

   <meta charset="utf-8">

   <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

   <title>北京-宏哥</title>


</head>

<style>

   #hongge {

   background-color: #f44336; 

   border: none;

   color: white;

   padding: 15px 32px;

   text-align: center;

   text-decoration: none;

   display: inline-block;

   font-size: 28px;

   margin-bottom: 100px;

   text-decoration:none;

   color: white;

}

</style>

<center>

<body>

   <button id="hongge" onclick="clickme();">点击关注</but-ton>  

</body>

</center>

<script>  


function showToast(msg,duration){  

   duration=isNaN(duration)?3000:duration;  

   var m = document.createElement('div');  

   m.innerHTML = msg;  

   m.style.cssText="width:60%; min-width:180px; background:#000; opacity:0.6; height:auto;min-height: 30px; color:#fff; line-height:30px; text-align:center; border-radius:4px; position:fixed; top:30%; left:20%; z-index:999999;";  

   document.body.appendChild(m);  

   setTimeout(function() {  

       var d = 0.5;  

       m.style.webkitTransition = '-webkit-transform ' + d + 's ease-in, opacity ' + d + 's ease-in';  

       m.style.opacity = '0';  

       setTimeout(function() { document.body.removeChild(m) }, d * 1000);  

   }, duration);  

}  


function clickme(){

   showToast("感谢关注:北京-宏哥",3000);

}


</script>  

</html>

4.2代码设计

4.3参考代码

package lessons;


import org.openqa.selenium.By;

import org.openqa.selenium.WebDriver;

import org.openqa.selenium.WebElement;

import org.openqa.selenium.chrome.ChromeDriver;


/**

* @author 北京-宏哥

*

* 《手把手教你》系列技巧篇(四十五)-java+ selenium自动化测试-web页面定位toast-上篇(详解教程)

*

* 2021年11月15日

*/

public class TestToast {

   

public static void main(String[] args) {

       

    System.setProperty("webdriver.gecko.driver", ".\\Tools\\chromedriver.exe");

       

       WebDriver driver =null;

       try {

           driver =new ChromeDriver();

           driver.get("file:///C:/Users/DELL/Desktop/test/toast.html");

           driver.manage().window().maximize();

           driver.findElement(By.id("anjing")).click();

           WebElement elementText = driver.findElement(By.xpath("/html/body/div"));//(加粗字体根据实际定位的元素信息进行填写)

           Thread.sleep(1000);

           String info = elementText.getText();

           System.out.println(info);

           Thread.sleep(3000);

       } catch (Exception e) {

           e.printStackTrace();

       } finally{

           System.out.println("执行结束,关闭浏览器");

           driver.quit();

       }


   }


}

4.4运行代码

1.运行代码,右键Run AS->Java Appliance,控制台输出,如下图所示:

2.运行代码后电脑端的浏览器的动作,如下小视频所示:

5.小结

宏哥个人感觉那个点击暂停和Chrome的debug调试差不多,就是debug比较简单,那个点击暂停的麻烦。会调试看懂代码的就用debug,不会的就用点击暂停的方法。



每天学习一点,今后必成大神-

往期推荐(由于跳转参数丢失了,所有建议选中要访问的右键,在新标签页中打开链接即可访问):


Appium自动化系列,耗时80天打造的从搭建环境到实际应用精品教程测试

Python接口自动化测试教程,熬夜87天整理出这一份上万字的超全学习指南

Python+Selenium自动化系列,通宵700天从无到有搭建一个自动化测试框架

Java+Selenium自动化系列,仿照Python趁热打铁呕心沥血317天搭建价值好几K的自动化测试框架

Jmeter工具从基础->进阶->高级,费时2年多整理出这一份全网超详细的入门到精通教程

Fiddler工具从基础->进阶->高级,费时100多天吐血整理出这一份全网超详细的入门到精通教程

Pycharm工具基础使用教程

相关文章
|
1天前
|
XML 测试技术 数据格式
《手把手教你》系列基础篇(七十五)-java+ selenium自动化测试-框架设计基础-TestNG实现DDT - 中篇(详解教程)
【6月更文挑战第16天】本文介绍了TestNG中`@DataProvider`的两种使用方法。本文通过实例展示了TestNG如何利用`@DataProvider`结合方法名和`ITestContext`来灵活地为测试方法传递参数。
6 1
|
2天前
|
XML 存储 测试技术
《手把手教你》系列基础篇(七十四)-java+ selenium自动化测试-框架设计基础-TestNG实现DDT - 上篇(详解教程)
【6月更文挑战第15天】本文介绍了TestNG的数据驱动测试(Data Driven Testing, DDT)概念和好处,并提供了两个实战示例。数据驱动测试允许使用不同的测试数据执行相同的测试用例,这些数据可以从外部文件或数据库获取。这种方法提高了测试效率,减少了冗余代码,并便于应对应用程序变更。
10 0
|
3天前
|
存储 关系型数据库 MySQL
Baidu Comate Web在线出题能力测试——MySQL出题能力
Baidu Comate Web在线出题能力测试——MySQL出题能力
5 0
|
3天前
|
Web App开发 XML 安全
《手把手教你》系列基础篇(七十三)-java+ selenium自动化测试-框架设计基础-TestNG实现启动不同浏览器(详解教程)
【6月更文挑战第14天】本文介绍了如何使用TestNg进行自动化测试,特别是通过变量参数启动不同浏览器的步骤。
15 5
|
4天前
|
XML 数据格式 Python
Python基础教程(第3版)中文版 第15章 python和web(笔记)
Python基础教程(第3版)中文版 第15章 python和web(笔记)
|
4天前
|
前端开发 JavaScript 开发工具
Web网页前端教程免费:引领您踏入编程的奇幻世界
Web网页前端教程免费:引领您踏入编程的奇幻世界
8 3
|
4天前
|
监控 Java 测试技术
《手把手教你》系列基础篇(七十二)-java+ selenium自动化测试-框架设计基础-TestNG简单介绍(详解教程)
【6月更文挑战第13天】本文介绍了TestNG单元测试框架,它是一个灵感来源于JUnit和NUnit的测试框架,支持多种级别的测试,如单元测试、集成测试等。TestNG的特点包括丰富的注解、数据驱动测试、变量支持、自动生成HTML测试报告等。与JUnit和NUnit相比,TestNG在某些功能上更为强大。文章还详细讲解了如何在Eclipse中安装TestNG插件,提供了在线安装、更新站点安装和离线安装三种方法,并展示了安装成功的验证步骤。最后,通过一个项目实战案例展示了如何使用TestNG编写和运行测试代码。
14 2
|
5天前
|
JavaScript Java 测试技术
《手把手教你》系列技巧篇(七十一)-java+ selenium自动化测试-自定义类解决元素同步问题(详解教程)
【6月更文挑战第12天】本文介绍了如何创建一个自定义类库来解决自动化测试中的元素同步问题。作者指出,大部分错误源于元素因时间不同步而引发,为此提供了一种解决方案。在项目实践中,首先在`library`包下创建名为`MyWait`的类,包含一个方法`isElementPresent`,该方法通过循环尝试并等待指定元素出现,避免了直接使用时间等待可能导致的不准确性。之后,在测试类中调用此自定义方法,成功实现了元素同步。代码示例展示了如何在Java+Selenium自动化测试中应用这个自定义类。
27 2
|
6天前
|
XML Web App开发 Java
《手把手教你》系列技巧篇(七十)-java+ selenium自动化测试-Java中如何读取properties配置文件内容(详解教程)
【6月更文挑战第11天】本文介绍了Java自动化测试中读取properties配置文件的方法。文章首先说明了为何要将配置参数放在properties文件中,然后简述了properties文件的作用和常用的读取方式,包括通过`java.util.Properties`类和`java.util.ResourceBundle`类。接着详细列举了`Properties`类的主要方法,如`getProperty()`、`load()`、`setProperty()`和`store()`等。
14 1
|
10天前
|
机器学习/深度学习 人工智能 自然语言处理
深入探索软件测试:策略、工具与未来趋势
【5月更文挑战第38天】 在软件开发的生命周期中,测试环节扮演着至关重要的角色。随着技术的不断进步和市场需求的多样化,传统的测试方法已逐渐不能满足现代软件项目的需求。本文旨在提供一个全面的软件测试概述,包括最新的测试策略、常用工具以及预测未来的发展趋势。通过分析自动化测试的效益、持续集成的重要性以及人工智能在测试中的应用,文章将帮助读者构建一个更高效、更智能的软件测试环境。