Frontend Development 7 min read

Using Tampermonkey for Browser Automation and Testing

This article explains how to use the Tampermonkey browser extension to interact with web pages, retrieve performance data, manipulate DOM elements, and automate testing tasks such as sign‑in assistance, event inspection, and cross‑origin requests, thereby improving testing efficiency and coverage.

JD Tech
JD Tech
JD Tech
Using Tampermonkey for Browser Automation and Testing

Preface

All tools and scripts that improve efficiency and quality belong to the scope of automation testing; this article does not focus on pure UI automation or API test scripts.

How to Interact with the Browser to Obtain Data

There are many ways to interact with a browser; this guide uses Tampermonkey (a popular user‑script manager) as an example.

1. What Is Tampermonkey?

Tampermonkey is a free browser extension and the most widely used user‑script manager, supporting Chrome, Microsoft Edge, Safari, Opera, and Firefox.

2. What Can Tampermonkey Do?

Examples from Greasyfork, such as the “JD Daily Sign‑in Helper” script, show that Tampermonkey can open different pages (e.g., membership sign‑in, shop lottery), locate and click the corresponding buttons.

Get page information

Operate page elements

Modify DOM structure

Inject custom JavaScript, CSS, etc.

3. Tampermonkey Built‑in API

The official Tampermonkey documentation lists a set of APIs that can be used directly; see https://tampermonkey.net/documentation.php?version=4.6 for details.

4. Using Tampermonkey in the Testing Process

Below are several practical examples that demonstrate how Tampermonkey can improve testing efficiency.

1. Displaying Web‑Page Performance Data

Open the browser console and enter window.performance.timing to view all timing metrics. These raw data can be processed to obtain performance indicators such as page load time, DNS lookup time, etc. A Tampermonkey script can automatically fetch these values after the page finishes loading and raise alerts when thresholds are exceeded.

2. Event Code Inspection

In a typical test scenario, a tester may need to locate the JavaScript handling a button click or a form submission. By using Chrome’s DevTools to inspect element attributes (e.g., the name attribute) and then searching the Sources panel, the related event handler can be found. A Tampermonkey script can highlight elements with bound events (green dashed box for change , red for click ) and display the source code on mouse‑over, greatly simplifying the debugging workflow.

3. Network Interface Access

Tampermonkey’s GM_xmlhttpRequest API enables cross‑origin requests, allowing testers to call external services directly from the browser. For example, a script can send page content to a translation API (such as Baidu Translate) and replace the original text with the translated result, demonstrating how to integrate third‑party services into automated test flows.

Conclusion

The examples above show how Tampermonkey can be leveraged in testing to retrieve performance data, inspect event handlers, and perform cross‑origin network requests, thereby enhancing test efficiency and coverage. Readers are encouraged to adapt these techniques to their own business testing needs.

Testingperformance-monitoringbrowser-automationFrontend ScriptingTampermonkey
JD Tech
Written by

JD Tech

Official JD technology sharing platform. All the cutting‑edge JD tech, innovative insights, and open‑source solutions you’re looking for, all in one place.

0 followers
Reader feedback

How this landed with the community

login Sign in to like

Rate this article

Was this worth your time?

Sign in to rate
Discussion

0 Comments

Thoughtful readers leave field notes, pushback, and hard-won operational detail here.