[selenium] action link ActionChains

A low-level interface for providing virtualized input operations to web browsers.

• keyboard input
• mouse input
• Pointer input for pen or touch devices
• Wheel input (v4.2+)

The implementation of action interaction depends on ActionChainsthe library, which is the encapsulation of lower-level action classes ActionBuilder.

When an action method is called ActionChains, the action event is stored in ActionChainsthe object's queue. When called perform(), the execution will be triggered one by one in the order of operation events.

Pause

Set the waiting time in the mouse operation chain.

clickable = driver.find_element(By.ID, "clickable")
ActionChains(driver)
    .move_to_element(clickable)
    .pause(1)
    .click_and_hold()
    .pause(1)
    .send_keys("abc")
    .perform()

Release (Clear)

When the action chain has been generated but not operated perform, even if a new action class instance is created later, the mouse is still in the previous state, so it is necessary to release the action chain that has been generated but not executed.

from selenium.webdriver.common.actions.action_builder import ActionBuilder
# 释放所有 actions
ActionBuilder(driver).clear_actions()

1. Mouse

1.1 click

# 鼠标左键并按住不放
ActionChains(driver)\
 .click_and_hold(clickable)\
 .perform()

# 鼠标左键
clickable = driver.find_element(By.ID, "click")
ActionChains(driver)\
 .click(clickable)\
 .perform()

# 鼠标右键
clickable = driver.find_element(By.ID, "clickable")
ActionChains(driver)\
 .context_click(clickable)\
 .perform()

# 鼠标左键双击
clickable = driver.find_element(By.ID, "clickable")
ActionChains(driver)\
 .double_click(clickable)\
 .perform()

"""
鼠标键
部分鼠标无按键不支持，经测试 Mac 与罗技无线鼠标均可
"""
# 鼠标后退键（v4.2+）
action = ActionBuilder(driver)
action.pointer_action.pointer_down(MouseButton.BACK)
action.pointer_action.pointer_up(MouseButton.BACK)
action.perform()

# 鼠标前进键（v4.2+）
action = ActionBuilder(driver)
action.pointer_action.pointer_down(MouseButton.FORWARD)
action.pointer_action.pointer_up(MouseButton.FORWARD)
action.perform()

1.2 Mobile

# 将鼠标移动到元素的中心点
hoverable = driver.find_element(By.ID, "hover")
ActionChains(driver)\
 .move_to_element(hoverable)\
 .perform()

""" 
按偏移量移动
offset(13, 15)    向右移动 13，向下移动 15
offset（-15, -20） 向左移动 15，向上移动 20
"""
# 从元素偏移（左上原点）
mouse_tracker = driver.find_element(By.ID, "mouse-tracker")
ActionChains(driver)\
 .move_to_element_with_offset(mouse_tracker, 8, 0)\
 .perform()

# 从元素偏移（中心原点）
action = ActionBuilder(driver)
action.pointer_action.move_to_location(8, 0)
action.perform()

# 基于当前指针位置的偏移量
ActionChains(driver)\
 .move_by_offset( 13, 15)\
 .perform()

1.3 Drag and drop

# 点击并按住 A 元素，移动到 B 元素，释放鼠标
draggable = driver.find_element(By.ID, "draggable")
droppable = driver.find_element(By.ID, "droppable")
ActionChains(driver)\
 .drag_and_drop(draggable, droppable)\
 .perform()

# 点击并按住 A 元素，移动到给定的偏移量，释放鼠标
draggable = driver.find_element(By.ID, "draggable")
start = draggable.location
finish = driver.find_element(By.ID, "droppable").location
ActionChains(driver)\
 .drag_and_drop_by_offset(draggable, finish['x'] - start['x'], finish['y'] - start['y'])\
 .perform()

2. Keyboard

2.1 Key

Simulate key operations on the keyboard.

from selenium.webdriver import Keys

"""
The Keys implementation.
"""

2.2 Press the key

from selenium.webdriver import Keys, ActionChains
from selenium.webdriver.common.by import By

# 按下 shift 键不放，输入字母，得到大写字母
ActionChains(driver)\
    .key_down(Keys.SHIFT)\
    .send_keys("abc")\
    .perform()

2.3 Lift key

# 按下 shift 输入大写 A
# 松开 shift 输入小写 b
ActionChains(driver)\
    .key_down(Keys.SHIFT)\
    .send_keys("a")\
    .key_up(Keys.SHIFT)\
    .send_keys("b")\
    .perform()

2.4 Enter characters

# 基于当前元素
ActionChains(driver)\
 .send_keys("abc")\
 .perform()

2.5 Input characters to the specified element

text_input = driver.find_element(By.ID, "textInput")
ActionChains(driver)\
  .send_keys_to_element(text_input, "abc")\
  .perform()

2.6 Copy and paste

cmd_ctrl = Keys.COMMAND if sys.platform == 'darwin' else Keys.CONTROL

"""
官方文档通过 firefox_driver 执行
"""
ActionChains(driver)\
    .send_keys("Selenium!")\
    .send_keys(Keys.ARROW_LEFT)\
    .key_down(Keys.SHIFT)\
    .send_keys(Keys.ARROW_UP)\
    .key_up(Keys.SHIFT)\
    .key_down(cmd_ctrl)\
    .send_keys("xvv")\
    .key_up(cmd_ctrl)\
    .perform()

"""
chrome 通过下面的方法实现
"""
ele = driver.find_element(value="textInput")
ele.send_keys('Selenium!')
ele.send_keys(cmd_ctrl, 'a')
time.sleep(2)
# 键盘的复制操作
ele.send_keys(cmd_ctrl, 'c')
time.sleep(2)
# 键盘的剪切操作
ele.send_keys(cmd_ctrl, 'x')
time.sleep(2)
# 键盘的粘贴操作
ele.send_keys(cmd_ctrl, 'v')
time.sleep(2)
# 键盘的删除操作
ele.send_keys(cmd_ctrl, 'a')
ele.send_keys(Keys.BACKSPACE)

3. Pen

Chromium only; v4.2+

A pen is a pointer input that has essentially the same behavior as a mouse, but can also have event properties unique to stylus pens. Also, a mouse has 5 buttons, while a pen has 3 equivalent button states:

• 0: touch (default, equivalent to left click)
• 2: Barrel button (equivalent to right-click)
• 5: Eraser button (currently not supported)

driver.get('https://www.selenium.dev/selenium/web/pointerActionsPage.html')
pointer_area = driver.find_element(By.ID, "pointerArea")
pen_input = PointerInput(POINTER_PEN, "default pen")
action = ActionBuilder(driver, mouse=pen_input)

# 使用笔
action.pointer_action\
  .move_to(pointer_area)\
  .pointer_down()\
  .move_by(2, 2)\
  .pointer_up()
action.perform()

# 添加指针事件属性
action.pointer_action\
  .move_to(pointer_area)\
  .pointer_down()\
  .move_by(2, 2, tilt_x=-72, tilt_y=9, twist=86)\
  .pointer_up(0)
action.perform()

4. Wheels

4.1 Scroll to element

Scrolls until the specified element appears on the screen.

iframe = driver.find_element(By.TAG_NAME, "iframe")
ActionChains(driver)\
  .scroll_to_element(iframe)\
  .perform()

4.2 Scroll by specified offset

# 传入一个 delta x 和 delta y 值，表示向右和向下滚动的量。负值分别代表左和上。

footer = driver.find_element(By.TAG_NAME, "footer")
# rect 具有元素位置和大小的字典，取元素的 y 值
# {'height': 23, 'width': 1169, 'x': 8, 'y': 5217.5}
delta_y = int(footer.rect['y'])
ActionChains(driver)\
  .scroll_by_amount(0, delta_y)\
  .perform()

4.3 Scroll to the specified offset based on the element

"""
第一个表示起始点，我们将其指定为元素，后两个是 delta x 和 delta y 值。
如果元素在可见窗口之外，它将滚动到屏幕底部，然后页面将根据提供的 delta x 和 delta y 值滚动。
"""
iframe = driver.find_element(By.TAG_NAME, "iframe")
scroll_origin = ScrollOrigin.from_element(iframe)
ActionChains(driver)\
 .scroll_from_origin(scroll_origin, 0, 200)\
 .perform()

4.4 Scroll to the specified offset based on the offset of the element

footer = driver.find_element(By.TAG_NAME, "footer")
scroll_origin = ScrollOrigin.from_element(footer, 0, -50)
ActionChains(driver)\
 .scroll_from_origin(scroll_origin, 0, 200)\
 .perform()

4.5 Scroll to the specified offset based on the offset of the origin

scroll_origin = ScrollOrigin.from_viewport(10, 10)
ActionChains(driver)\
  .scroll_from_origin(scroll_origin, 0, 200)\
  .perform()