Skip to content

feat(browser): add cursor animations for click and scroll actions#23420

Open
kunal-10-cloud wants to merge 1 commit intogoogle-gemini:mainfrom
kunal-10-cloud:feat/cursor-animations-v3
Open

feat(browser): add cursor animations for click and scroll actions#23420
kunal-10-cloud wants to merge 1 commit intogoogle-gemini:mainfrom
kunal-10-cloud:feat/cursor-animations-v3

Conversation

@kunal-10-cloud
Copy link
Contributor

@kunal-10-cloud kunal-10-cloud commented Mar 22, 2026

Summary

This PR implements visual feedback for browser agent automation by adding cursor animations for click and scroll actions. These animations provide real-time visual cues in the browser window, enhancing transparency and aiding debugging by highlighting exactly where and how the agent is interacting with the page.

Details

  • Add mousedown-based pre-click listener with double-registration guard and 3-second safety timeout for click/hover tool animations
  • Add post-click ripple animation for click_at(x, y) coordinates
  • Add cascading arrow panel scroll animation with staggered arrows
  • Use Web Animations API for CSP compatibility
  • Add showCursorAnimations config option (default: true in non-headless)
  • All animations are aria-hidden, pointer-events:none, and self-removing
  • Errors in animation injection never block tool execution

Related Issues

Closes #21099

How to Validate

  1. Automated Tests:
    Run the Following test suites to verify configuration and injection logic: 
    npm run test -w @google/gemini-cli-core

Pre-Merge Checklist

  • Updated relevant documentation and README (if needed)
  • Added/updated tests (if needed)
  • Noted breaking changes (if any)
  • Validated on required platforms/methods:
    • MacOS
      • npm run
      • npx
      • Docker
      • Podman
      • Seatbelt
    • Windows
      • npm run
      • npx
      • Docker
    • Linux
      • npm run
      • npx
      • Docker

@kunal-10-cloud
feat(browser): add cursor animations for click and scroll actions
b73c924 
- Add mousedown-based pre-click listener with double-registration guard
  and 3-second safety timeout for click/hover tool animations
- Add post-click ripple animation for click_at(x, y) coordinates
- Add cascading arrow panel scroll animation with staggered arrows
- Use Web Animations API for CSP compatibility
- Add showCursorAnimations config option (default: true in non-headless)
- All animations are aria-hidden, pointer-events:none, and self-removing
- Errors in animation injection never block tool execution
@kunal-10-cloud kunal-10-cloud requested a review from a team as a code owner March 22, 2026 03:37
@gemini-code-assist
Copy link
Contributor

gemini-code-assist bot commented Mar 22, 2026

Summary of Changes

Hello, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request introduces a significant enhancement to the browser agent by providing real-time visual feedback during automated interactions. By displaying animations for clicks and scrolls directly within the browser window, users can more easily observe and understand the agent's actions, which is particularly beneficial for debugging and validating automation flows. This feature improves the user experience by making the agent's operations more transparent and intuitive.

Highlights

  • Visual Cursor Animations: Implemented visual feedback for browser agent automation, including distinct animations for click and scroll actions to enhance transparency and aid debugging.
  • Click Animations: Added a mousedown-based pre-click listener with a safety timeout for click and hover tools, and a post-click ripple animation for click_at(x, y) coordinates.
  • Scroll Animations: Introduced a cascading arrow panel animation with staggered arrows to visually indicate scroll direction (up/down) when press_key is used with scroll keys.
  • CSP Compatibility & Robustness: All animations utilize the Web Animations API for Content Security Policy (CSP) compatibility, are aria-hidden, pointer-events:none, self-removing, and designed so that errors in animation injection do not block tool execution.
  • Configurability: Added a new showCursorAnimations configuration option, which defaults to true in non-headless browser modes, allowing users to enable or disable these visual cues.
  • Comprehensive Testing: New unit tests were added for the cursor animation utility functions and the integration logic within the MCP tool wrapper, covering various scenarios including animation injection, disabling, and error handling.
Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature Command Description
Code Review /gemini review Performs a code review for the current pull request in its current state.
Pull Request Summary /gemini summary Provides a summary of the current pull request in its current state.
Comment @gemini-code-assist Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help /gemini help Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for GitHub and other Google products, sign up here.

Footnotes

  1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

@kunal-10-cloud
Copy link
Contributor Author

kunal-10-cloud commented Mar 22, 2026

Hi @cynthialong0-0, I have raised a clean new PR and closed the previous one

gemini-code-assist[bot]
gemini-code-assist bot reviewed Mar 22, 2026
View reviewed changes
Copy link
Contributor

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request introduces visual feedback for browser automation by adding cursor animations for click and scroll actions. The implementation is robust, featuring a new configuration option showCursorAnimations, CSP-compatible animations using the Web Animations API, and graceful error handling that prevents animation failures from blocking tool execution. The changes are well-tested with new unit and integration tests. The code is clean and follows best practices for injecting and managing transient UI elements in a web page. No critical or high-severity issues were found in this review.

@gemini-cli gemini-cli bot added the area/agent Issues related to Core Agent, Tools, Memory, Sub-Agents, Hooks, Agent Quality label Mar 22, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

1 more reviewer

@gemini-code-assist gemini-code-assist[bot] gemini-code-assist[bot] left review comments

Reviewers whose approvals may not affect merge requirements

At least 1 approving review is required to merge this pull request.

Assignees

No one assigned

Labels

area/agent Issues related to Core Agent, Tools, Memory, Sub-Agents, Hooks, Agent Quality

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

[Browser Agent] Mouse Cursor Animations for Click and Scroll Actions

1 participant

@kunal-10-cloud