040、如何定位一闪而过的 dialog 消息 (打开 Source 项, 当 dialog 提示语出现的时候,按下暂停,页面就不会动了)

参考资料:https://www.cnblogs.com/yoyoketang/p/14206256.html

 

前言

web页面操作的时候经常会遇到一闪而过的 dialog 消息,这些提示语一般只出现了几秒,过后元素节点就会在DOM中消失了。
本篇讲解下用chrome 浏览器如何定位一闪而过的 dialog 消息。

打开 Source 项,在右侧有个暂停按钮, 当 dialog 提示语出现的时候,点下暂停按钮,此时页面就不会动了。

dialog 场景

当点保存按钮后,页面弹出保存成功的提示框,这个提示框过1-2秒会自动消失

040、如何定位一闪而过的 dialog 消息 (打开 Source 项, 当 dialog 提示语出现的时候,按下暂停,页面就不会动了)

首先我们需要定位到此元素上,查看元素的属性相关信息,按f12 后鼠标还没来得及指上去就消失了,或者刚指上去,dom里面的元素就不见了。

暂停 dialog

打开chrome 浏览器,f12 后查看,打开 Source 项,在右侧有个暂停按钮,如下图

040、如何定位一闪而过的 dialog 消息 (打开 Source 项, 当 dialog 提示语出现的时候,按下暂停,页面就不会动了)

当 dialog 提示语出现的时候,点下暂停按钮,此时页面就不会动了

040、如何定位一闪而过的 dialog 消息 (打开 Source 项, 当 dialog 提示语出现的时候,按下暂停,页面就不会动了)

于是就可以在 Elements 里面用鼠标指到 dialog 元素上了

040、如何定位一闪而过的 dialog 消息 (打开 Source 项, 当 dialog 提示语出现的时候,按下暂停,页面就不会动了)

 

元素相关信息如下:

<div class="successbox dialogbox" id="jsSuccessTips" style="display: block; margin-top: 93.5px;">
            <h1>保存成功</h1>
            <div class="close jsCloseDialog"><img src="/static/images/dig_close.png"></div>
            <div class="cont">
                <h2>个人信息修改成功!</h2>
                <p></p>
            </div>
        </div>

代码实现

获取dialog的时候,先定位该元素,通过上面抓出来的元素信息 <h2>个人信息修改成功!</h2>
定位这个元素的话,它没什么属性,但是可以定位它上面的一层div,甚至再上一层的 class="successbox dialogbox" id="jsSuccessTips" 这2个属性定位

# -*- coding:utf-8 -*-
# 作者-上海悠悠 QQ交流群:717225969
# blog地址 https://www.cnblogs.com/yoyoketang/
# Project: day01
# Module:  ch_11.py
# Environment: Python3.8.6 , Selenium3 环境 ( 3.141.0 版本)
# Environment: Chrome ( 92.0.4515.131, 正式版本) + chromedriver(92.0.4515.107版本)

from selenium import webdriver
import time

driver = webdriver.Chrome()
driver.maximize_window()
driver.get("http://49.235.92.12:8200/users/login/")
time.sleep(2)

# 先登陆
driver.find_element_by_id("username").send_keys("112233456@qq.com")
driver.find_element_by_id("password_l").send_keys("123456")
driver.find_element_by_id("jsLoginBtn").click()

# 点击个人中心
# 隐藏元素操作,方法二:js 点击隐藏元素
js = 'document.getElementsByClassName("personcenter")[0].click()'
driver.execute_script(js)

# 修改昵称
driver.find_element_by_id('nick_name').send_keys('aabbcc')

# 点保存按钮
driver.find_element_by_id("jsEditUserBtn").click()

# 点击保存按钮后,dialog 不会立马出现会有一点点的延迟,可以先sleep下
time.sleep(0.2)
# 定位dialog 用css的层级定位
dialog = driver.find_element_by_css_selector("#jsSuccessTips>.cont").text
print(dialog)

time.sleep(4)
driver.quit()

执行结果如下:

D:\SkyWorkSpace\WorkSpace\Web_AutoTest\Temp\day01\venv\Scripts\python.exe 
D:/SkyWorkSpace/WorkSpace/Web_AutoTest/Temp/day01/ch_003/ch_11.py 个人信息修改成功! Process finished with exit code 0

 

上一篇:记录el-dialog 去掉滚动条


下一篇:PopupWindow和Dialog区别,手慢无