元素之后的所有

元素　                       

4.6、谓语

4.7、索引

4.8、xpath和css选择器语法比较

　　祖先关系：

　　xpath:        //input//div

　　css:　　    input div

　　父子关系：

　　xpath:　　//input/div

　　css:　　　//input>div

　　第几个儿子：

　　xpath:　　//form[@id="form"]/input[1]

　　css:　　   //form#form>input:nth-child(1)

　　大弟弟：

　　css:　　  //form#form + div

　　或者：

　　xpath:　 //input/div | //input/a

　　css:　　 //input div,input a

4.9、xpath和css选择器各有什么优势

• css写法更简洁
• css速度更快
• css不支持文本写定位，即text()
• xpath功能更强，对于复杂定位反而更简洁

    

    

扩展1：伪元素操作

扩展2：Shadow DOM

5、等待

5.1、为什么要用等待

　　页面打开因为要有个加载过程，要等页面出来才能方便定位元素。

5.2、三种等待方式

　  1、强制等待，不够灵活，time.sleep()，暂停代码运行，适用于所有类型的等待。

　  2、隐式等待（只能用来查询元素，find_element开头的方法能用），背后默默的等感觉不到他的存在，全局只需设置一次，所以一般来说启动浏览器之后不要　　

　　　忘记设置隐性等待，之后每次找元素的时候就会自动触发隐性等待。超时找不到元素会报错。

• driver.implicitly.wait(10)
• 类似于系统监控，效率高，比较隐藏的找到凶手

　  3、显示等待（明确等待的条件），每需要用到一次，就需要调用一次（非全局配置），另外不仅可以等元素查找还可以适用其他的等待（如等待获取浏览器的

           标题这种时候用隐式等待就不行，因为获取浏览器的标题不属于元素定位，所以只能用time.sleep()或显示等待）。显示等待一般可以用time.sleep()替换掉，

　　　但是time.sleep()有个硬伤，时间时死的不够智能，所以为了代码智能一点还是用显示等待。显示等待时间超出了就会报错。

• 类似于派出专项小分队设卡检查
• 隐式等待某些情况找不到，就要用显示等待

  from selenium import webdriver

  from selenium.webdriver.support.wait import WebDriverWait
  from selenium.webdriver.support import expected_conditions
  # 访问百度
  driver = webdriver.Firefox()
  driver.get("http://www.baidu.com")
  # 设置显性等待
  wait = WebDriverWait(driver, 10)
  locator = ['id', 'kw']

　# 显式等待使用方式之一：等待元素（常见有三种）
  
  # 等待某个元素加载
  elem = wait.until(expected_conditions.presence_of_element_located(locator))
  # 等待元素可见
  elem = wait.until(expected_conditions.visibility_of_element_located(locator))
  # 等待元素可以被点击
  elem = wait.until(expected_conditions.element_to_be_clickable(locator))
  #元素出现后在进行各种操作  
  elem.send_keys('NBA')
  elem.submit()

　# 显式等待使用方式之二：等待非元素（此处也可用time.sleep()进行强制等待）
  wait.until(expected_conditions.title_contains('NBA'))#等待标题栏出现文本包含NBA

　# 输出标题栏内容（如果上面不用显示等待，而用隐式等待，输出的内容有可能是不正确的（输出之前的标题），因为隐式等待只能等元素，不能等非元素。）  
  print(driver.title)

　4、三种等待使用流程

　　全局用上隐式等待，如果遇到隐式等待不起作用，再用time.sleep()调试，如果好用在把time.sleep()替换换成显示等待。

　

6、三大切换

6.1、窗口切换

　driver.current_window_handle # 获取当前窗口的句柄handle
　driver.window_handles # 获取所有窗口句柄，以列表形式返回
　driver.switch_to(driver.window_handles[-1]) # 切换到最新窗口，-1 表示获取最新的窗口，0表示第1个窗口

6.2、iframe切换

　　（一）切换 iframe

　　switch_to.frame(iframe_reference)进行切换，可以以下3种方式进行切换：

• 1、index，从0开始，这种方式一般不用，很难通过页面确定是第几个iframe，例如driver.switch_to.frame(0)切换到第1个iframe，下标是从0开始的
• 2、name 属性，例如driver.switch_to.frame(‘iframeResult’)
• 3、WebElement 对象，先把iframe元素本身找到，然后再传进来。如iframe = driver.find_element('id','iframeResult')，driver.switch_to.frame(iframe)

　　（二）切换默认的HTML

　　switch_to.default_content()

　　（三）切换到上一级iframe

　　switch_to.parent_frame()

　　例子：https://www.w3school.com.cn/tiy/t.asp?f=eg_html_iframe

6.3、alter弹框切换

       

 　　alter弹框，当页面上出现alter弹框后，此时按F12是看到不到页面上的元素的一片空白，导致没法定位元素，因为此时此刻页面停留在弹框上面，里面所有的

　　元素都会消失，此时怎么定位页面页面上的元素，必须把现alter弹框关掉，关掉后其他元素才会出来。像这咱原始的alter现在已经很少出现了，现在的弹框不是通过alter实现的，而是通过标签实现的直接点接就可以了。

• my_alter =driver.switch_to.alter # 切到alter弹框上。注意alter没有括号，也不需要传参，因为alter全局只会出现一次。
• myalter.accept() # 点击弹框上确认按钮的意思，现次回到主页面。
• myalter.dismiss() # 点击弹框上取消按钮的意思，现次回到主页面。

　　上面这种弹框用的比较少了，都用新技术了，现在很多弹框都是通过js去加载一个新的元素，然后把它悬浮在老的元素上面更多是用到css和js组合。

6.4、切换的等待

　　（1）窗口切换要不要等待，万一没切换过来怎么办？

　　　基本不需要，因为窗口切换很快，除非遇到个别情况下电脑卡顿造成的，正常情况下不需要等待，如果设置等待可用强制等待或显示等待。

　　　

   from selenium import webdriver
   import time
   from selenium.webdriver.support.wait import WebDriverWait
   from selenium.webdriver.support import expected_conditions
   driver = webdriver.Chrome()
   driver.get('www.baidu.com')
   elem = driver.find_element('id','kw')
   elem.send_keys('NBA')
   elem.submit()

   # 注意此处是方法二的一个参数，获取所有的窗口句柄，一定要在点击新页面前获取
   all_handles = driver.window_handles
   driver.find_element_by_link_text('雅虎').click() # 打开一个新的窗口

   # 方法一设置强制等待
   time.sleep(2) # 设置2秒等待新窗口打开

   # 方法二设置显式等待
   wait = WebDriverWait(driver,2)
   wait.until(expected_conditions.new_window_is_opened(all_handles)) #注意这个参数，all_handles

   handle = driver.switch_to(driver.window_handles[-1])# 然后在手工切换
   driver.switch_to.window(handle)
   time.sleep()
   print(driver.title)

　（2）iframe切换要不要等？一般也不需要等。但等了也无所谓可以让代码更健壮，只是代码变复杂

　　......
　　iframe =driver.find_element('id','iframeResult')
　　# 执行下面这个等待后，会自动完成切换，不用在手工切换iframe
   WebDriverW(driver,2).until(expected_conditions.frame_to_be_available_and_switch_to_it(iframe))
　　
　　......
　　也可用强制等待,但需要手工切换ifame　　　

  （3）alter,道理同iframe切换。现在页面很少用原生弹窗，所以此方法了解即可，用的时候在查。

   wait = WebDriverWait(driver,2)
   wait.until(expected_conditions.alert_is_present))

7、ui交互操作

　　web测试过程中的都有哪些浏览器操作？

　　1、点点点（鼠标操作：单击、双击、拖拽、悬停）

　　2、用户输入（文本框、单选、多选、下拉框选择）

　　3、控件操作（如日期）、文件上传

　　4、验证码（让开发关闭验证，设置固定验证码）

　　5、窗口滚动。

　　各式各样的浏览器操作工具如，selenium，cypress，playwright，pupeter，其封装浏览器的操作都是类似的。

7.1、鼠标操作

　　ActinoChains类来实现。流程举例：（1）ac = ActinoChains(driver) （2）定位元素elem =driver.find_element('xpath','//h2')（3）操作 ac.click(elem).perform()

　　1、单击，有两种方式来实现。

　　　简单版：（1）定位元素，elem =driver.find_element('xpath','//h2')（3）elem.click()

　　　复杂版：（1）ac = ActinoChains(driver) （2）定位元素，elem =driver.find_element('xpath','//h2')（3）操作 ac.click(elem).perform()

　　　说明：简单版虽简单但是功能单一，只能做单击。复杂版功能强大如将ac.click(elem).perform()中的click(elem)可替换成别的操作如双击　　　　

　　　ac.double_click(elem).perform()，换成什么就是什么操作。

　　2、双击 ac.double_click(elem).perform()

　　3、右击 ac.context_click(elem).perform()

　　4、移动（悬停） ac.move_to_element(elem).perform()     例子：百度首页：设置--》高级设置

　　5、拖拽 ac.drag_to_drop(elem1,elem2).perform()

　　6、连续操作：ac.move_to_element(setting).click(adv_setting).drag_and_drop().context_click().perform()　# 可以任意加，只要最后有.perform()即可。

7.2、选择select下拉框

       

　　这种下拉框用的比较少了，但是有的在用，现在更多用的是新的一些框架用这个div元素去加载的。

　　有两种方式可能操作select下拉框:

　　方式一：也是最简单的方式，直接去定位option，点击即可(此种方式所有类型下拉框通用)：

　　driver.find_element('xpath','//option[text()="吃"]')

　　注：因为现在很多很多框架虽然不在用select元素去代表下拉框，比如vue.js(中国人写的风靡全球一个框架)写的前端，例如下面这个下拉框，就是普通的文本　　

　　框+选项列表组成，但是它的展示实现起来会通过一些css样式让它看起来像是select元素，实际上根本不是。像这种与定位。一样的先找你你要点击的元素(点

　　开下拉，鼠标放置选项上右击检查元素)点击即可。所以下拉弹不管是不是select元素都是可以通过点击取操作。

      

     

 　　方式二：仅适用select下拉框，了解即可，即先找到select元素，再把元素对象传入Select

　　from selenium.webdriver.support.select import Select

　　s = driver.find_element('id','myselect'.)

　　s_obj = Select(s)

　　s_obj.选一种定位方式即可。

　　

7.3、键盘输入

• Keys 类
• send_keys()
• enter 回车
• 右移光标
• ctrl +a ,全选
• ctrl +c 复制
• ctrl +v 粘帖

　　以百度搜索为例子，提交的三种方式：

　　......

　　driver.get('http://www.baidu.com')

　　input = driver.find_element('id','kw')

　　input.send.send_keys('NBA')

　　方式一、找到"百度一下"这个按钮，点击元素。此种为万能方式。

　　方式二、如果该元素在form表单下，可以以submit()实现提交，如果不在form表单下则不能用这种方式。

       input.submit()

　　方式三、触发键盘上的回车健。如果前端没有做回车提交，这种方式也不了。

　　from selenium.webdirver.common.keys import Keys

　　input.send_keys(Keys.ENTER)

　　# 也可传多个参数

　　input.send_keys(Keys.CONTROL,Keys.SPACE)

　　以上是在元素上的操作，下面是全局操作：

　　from selenium.webdriver  import ActionChains

　　from selenium.webdirver.common.keys import Keys

　　ac = ActionChains()

       ac.send_keys(Keys.CONTROL).perform()

7.4、js脚本

　　所有python代码、所有selenium指令比如找元素，发送按键最终都是会传给webdirver驱动（转换成js代码），通过webdriver控制浏览器，webdriver为什么可　　       以控制浏览器，是因为浏览器中内置js解释器（也就是说浏览器可随便宜运行js代码），所以不管学的是什么语言python、java、php也好总之你想控制浏览器         到目前为止是绕不开js（javascript）的。学js目的以防成万一，什么意思呢，因为现在所写的python指令最终都会转化成js代码，所以可以理解成selenium是　　　　       对js指令的封装（转了一些转换转换成了python语言），但selenium只封装了部分浏览器操作，当你发现有一些操作用seleniuim玩不成的话，此时就可以直接　　       发送js代码执行，你就可以调用这样的代码driver.execute_script()表示执行js指令。例如：js_code ="return document"    ，driver.execute_script(js_code)

　　1、有哪些指令在selenium在不存在？

　　（1）如修改元素的属性（比如修改readonly、disable属性等）

　　（2）窗口的滚动

　　　......

　　2、写js代码，有两种方式：

　　（1）可以直接在浏览器console（控制台）中写，如下图

         

　　（2）写在html代码文件中，下面这些代码在自动化测试中用不到，只需要知道有这种机制就可以了，自动化测试要学的是哪些js呢？即，dom对象。　　

　　
　　
　　
    　　
   　　 
　　
　　

   　　 
    　　
    　　

   　　 
    　　
hello world


   　　 <script>
      　　  
       　　 
       　　 
           　　 
       　　 
           　　 
        　　

       　　 
        　　function myAlert(){
            　　let name ='david';
            　　if (name=='chenglong'){
               　　 alert('成龙')
            　　}else{
               　　 alert('david')
           　　 }
       　　 }
        　　
        　　
    　　</script>

　　
　　

         

 　　3、js常用指令

　　（1）打印，有两种方式实现打印 console.long()、alter()后者也是打印，只是把要打印的内容以弹框的形式弹出来。不管什么语言先要学的就是打印，因为可

　　　　以帮助调试代码。

　　（2）定义变量 var name = 'helloworld' ,现在已不太用这种方式定义js里的变量了。let name ='helloworld' 这是js新的定义变量的标准。

　　（3）数据类型，let  name = "helloworld" ，name = 123 ,name = true(注意是小写的)，name = [1,2,3] ,name = {"name":"david"}

　　（4）条件语句

　　　　if(age>18){
　　　　alert("已经成年");
　　　　}else if(age==18){
　　　　alert("要成年了")
　　　　}else{
　　　　alert("未成年")
　　　　}

           

  　  （5）for、while循环自动化测试用的不多。可以去菜鸟教程学习，https://www.runoob.com/js/js-tutorial.html

　　（6）函数，function

           

　　4、dom 对象，重点

　　之前做过js 跟python的对比，用法是差不多的。python里什么东西都可以用类和对象来表示，比如selenium访问浏览器对象Chrome()、FireFox(),同时在jsi当中

　　它也可以用类和对象的方式去表示所有的情况，但是js里的类和对象有一个非常特殊存在，特殊在哪里，即js的解释器集成在浏览器当中。那么这个特殊之处就

　　会引发一系列连锁的反应，当我们打开任意界面的时候，js就会自动的把你打开的界面窗口封装成一个对象。打开一个html页面，它的源代码是由html文档构

　　成，hmtl文档其实就是一些文字本质跟python里的字符串一回事，js就做了一些事情，即你打开这个文档以后会把它转化成js里对象，整个窗口包含标题存放到　　

　　叫window的对象里面，window下有各种属性和方法是可以调用的。还有一个文档，这个文档是窗口里的一部分，叫做document，整体页面上的内容保存在

　　document对象里，document对象里也有各种属性比如url可调用，document.body,document.url就能获取对应的属性，所以打开任意界面都帮助我们封装成js对

　　象了，既然封装成对象了，那么想去操作页面、窗口，我们通过代码的方式怎么操作呢？　　

　　（1）通过代码方式如何去操作对象（document、window对象），即通过方法和属性两种方式。

　　　　-属性：获取属性、修改属性。

　　　　-方法：获取方法、修改属性。

　　    

          

         

　　  

　　所以任何的网页面上任何的东西都可以通过js去控制，不管什么样的操作你想在selenium中如果你不知道怎么玩的在python中它实现不了的，就可以发送对应的js指令直接让前端的js代码去修改或操作浏览器，之后如果想深入研究ui自动化内容就要深入研究js，学的越深做UI自动化越得心应手。以上可知通过方法和属性都可以修改页面，那么这个页面和dom关键字有什么关联没有？ 

 　　（2）什么是dom 对象

　　DOM（DOM—Document Object Model）是W3C国际组织的一套Web标准。它定义了访问HTML文档对象的一套属性、方法和事件。DOM是以层次结构组织的节点或信息片断的集合。文档对象模型（Document Object Model）是给HTML与XML文件使用的一组API。DOM的本质是建立网页与脚本语言或程序语言沟通的桥梁。

　　dom就是可它可以把一个html（docoment）变成一个对象，也就是整体html就是一个对象，html标签它也是个对象但是可以通过属性的方式去获取，即docment.getRootNode()、document.body、document.head......所以在整个页面所以的都是对象（标签是对象，属性也是对象、文本也是对象......这跟python是类似的一切皆对象）。

　　总之，在自动化测试里边对dom的理解就基本上等同于对docement这个对象的操作，

　　

　　（3）js具体应用场景

  

 　　

7.5、窗口滚动

7.6、文件上传