The author adapts a Japanese developer’s forced‑break Chrome extension using GitHub Copilot (Codex) to create an open‑source add‑on that blocks prolonged browsing on any specified sites—by default Zhihu and Weibo—displaying a full‑screen cat overlay after a configurable time.
A detailed security analysis shows that LinkedIn's browser extension silently runs a heavily obfuscated JavaScript payload that probes over 6,200 Chrome extensions in a few milliseconds, building precise user profiles, political tags, and commercial intelligence, while Microsoft defends the practice as anti‑scraping.
This article details 15 powerful, under‑utilized Claude Code capabilities—including mobile apps, cross‑device session transfer, loop/schedule automation, hooks, Chrome extension verification, Git worktrees, batch processing, custom agents, remote dispatch, and voice input—showing how to build a verifiable, isolated, forkable, and schedulable AI‑driven development environment.
This guide explains how OpenClaw’s built‑in browser feature and the optional Browser Relay extension enable effortless data extraction from both public and login‑required websites, providing step‑by‑step installation commands, Chrome extension loading instructions, and a practical example of scraping top posts from a social platform.
Playwriter, an open‑source Chrome extension built on Microsoft Playwright, lets AI bypass login and captcha hurdles by acting as a browser co‑pilot, offering visual‑accessibility tagging to cut token usage and exposing the full Playwright API for advanced automation tasks.
This article explains how the zzChromeTools Chrome extension tackles the often‑overlooked “invisible time killers” in frontend development by injecting AOP‑style hooks into the main world, capturing beacon requests, and presenting them in a lightweight DevTools panel, dramatically reducing cognitive load and debugging time.
This guide explains Chrome's multi‑process architecture, the roles of each extension script (manifest, popup, background, content, injected), and how they communicate via chrome.runtime, chrome.tabs, and window.postMessage, with practical code examples and diagrams.
This guide explains how to create a lightweight Chrome extension that intercepts fetch and AJAX requests, lets you define mock rules without installing heavy clients, and dramatically reduces memory usage during front‑end development.
This article systematically introduces Midscene.js, an AI‑powered next‑generation UI automation tool, covering its design motivations, core architecture, UI context acquisition, LLM‑driven planning, element verification strategies, Chrome extension implementation, common pitfalls, and practical business insights.
This guide explains how to build and use a lightweight Chrome extension that lists recently closed tabs, lets you restore individual pages or all at once, shows site icons and timestamps, and runs with minimal permissions using the Chrome Sessions, Tabs, and Favicon APIs.
This tutorial shows how to create a lightweight Chrome extension that automatically blocks popular online game sites during prohibited hours, covering requirement analysis, project structure, manifest and background scripts, installation steps, testing, and customization options.
This article walks through the design and implementation of a Chrome extension that mocks API responses by intercepting network requests using Manifest V3, covering architecture differences, core configuration, request‑blocking techniques, script injection, project structure, rule creation, whitelist management, and future enhancements.
This article details the design and implementation of FunTester, a Chrome extension that provides a sidebar for comprehensive tab management, including domain grouping, theme switching, tab actions, custom right‑click menus, dynamic icons, and real‑time status updates, all illustrated with JavaScript code examples.
This article walks through integrating a Chrome extension into an Electron app, handling file‑protocol loading, cross‑origin iframe restrictions, site‑isolation settings, and code modifications needed to expose Laya objects from an iframe to the extension.
This curated collection gathers the most valuable fault‑testing, Byteman, Chrome Extension, and frontend development articles from 2024‑2025, providing concise titles, direct links, and publication dates to help engineers quickly locate essential technical knowledge.
This guide walks you through building a Chrome extension that captures the current webpage, converts its HTML to Markdown using an AI‑assisted code generator, and saves the result locally, covering architecture, code generation, installation, usage, and common pitfalls.
This collection gathers recent technical articles covering fault testing fundamentals, Byteman usage guides, and Chrome extension development tutorials, providing developers with practical insights, best practices, and hands‑on examples to improve system reliability, testing strategies, and front‑end extension capabilities.
This guide explains the shift from persistent background scripts to Service Workers in Manifest V3, compares three timer implementation strategies—including chrome.alarms, content‑script intervals, and event‑driven storage checks—and provides best‑practice recommendations for idempotency, logging, deduplication, and state persistence.
This guide explains how to implement reliable scheduled tasks in Chrome extensions under Manifest V3, covering the shift from persistent background scripts to service workers, three practical approaches—including chrome.alarms, content script timers, and event‑driven simulations—plus best‑practice tips for idempotency, logging, and state persistence.
The article outlines three practical approaches to get the most out of DeepSeek—using it as a conversational assistant, integrating its API to power AI tools such as the Chrome immersive‑translation plugin, and leveraging it for AI‑assisted programming—while comparing the V3 and R1 models and offering concrete configuration steps.
This article provides a comprehensive guide to Chrome extension development, covering the History, Downloads, and Storage APIs with practical code examples, advanced usage tips, privacy considerations, and custom scripts for efficient data management.
Midscene.js leverages multimodal AI to simplify web UI automation by providing .ai, .aiQuery and .aiAssert methods, supporting JavaScript and YAML integrations, a Chrome extension, and detailed cost analysis while acknowledging latency, interaction limits, and prompt‑engineering challenges.
This article walks through the design, implementation, and debugging of a Chrome extension that converts between timestamps and human‑readable dates, covering manifest configuration, background and popup scripts, UI layout, and usage instructions.
This article walks through the design, implementation, and debugging of a Chrome extension that converts timestamps between seconds, milliseconds, and human‑readable date‑time formats, covering manifest setup, background scripts, popup UI, and JavaScript logic.
This article explains what browser extensions are, outlines the Chrome extension file structure, walks through creating the manifest, popup UI, content and background scripts, demonstrates messaging APIs, and shows how to add features such as ad removal, context‑menu shortcuts, request blocking, custom new‑tab pages, and text‑highlighting.
Learn how to create a custom Chrome extension that generates QR codes for any webpage, covering plugin architecture, manifest configuration, background and popup scripts, testing, and publishing steps, while highlighting benefits like personalization, security, and cost savings for developers.
This article explains why writing a custom Chrome extension is beneficial and provides step‑by‑step instructions, including directory structure, manifest, background script, popup UI, testing, and publishing, to create a QR code generator that works directly from the browser.
This article walks you through the fundamentals of Chrome extension development, covering its advantages, required prerequisites, manifest file creation, core components such as popup pages, background scripts, content scripts, and context menus, complete with practical code examples and configuration details.
A Chrome proxy plugin was built to intercept micro‑frontend requests and map online URLs to local development servers, eliminating the need to launch both parent and child apps, restoring hot‑module replacement speed, offering one‑click rule configuration, and achieving full coverage and faster development for DeWu’s team.
This article discusses the difficulty of locating source code in a massive React component library and evaluates three solutions—Chrome React Developer Tools, other Chrome plugins, and the react-dev-inspector npm package—providing installation steps, code integration details, advantages, and drawbacks.
This tutorial walks through creating a Chrome extension that uses the ChatGPT API to translate selected text, covering setup with OpenAI's quickstart, key code snippets for prompts, content‑script and background service worker, Vite plugin usage, deployment on Vercel, and runtime considerations.
This tutorial walks through creating a Chrome extension that captures images from web pages, sends them to a Python‑backed Tesseract OCR engine, and displays the recognized text, covering the plugin's file structure, manifest configuration, JavaScript code, HTML UI, CSS styling, and installation steps.
This tutorial explains how to develop a Chrome extension that assists developers in locating web page elements and generating XPath expressions by outlining the plugin's structure, providing complete configuration files, JavaScript code, HTML/CSS UI, and step‑by‑step instructions for loading and testing the extension.
This article provides a step‑by‑step guide to creating a Google Chrome extension using Python and Flask that validates JSON data on the current page, covering prerequisite setup, project structure, manifest configuration, content and background scripts, backend server implementation, and testing procedures.
This article provides a step-by-step guide to creating a Google Chrome extension that captures full-page screenshots, detailing the required project structure, manifest configuration, JavaScript background and content scripts, and a Python Selenium script for automated screenshot capture and saving.
This article provides a detailed walkthrough of LocatorJS, covering how to clone the repository, set up the development environment, explore the Chrome extension code, and dissect the runtime implementation that leverages React fiber, SolidJS components, and Babel plugins to enable precise code‑to‑UI mapping.
ChatGPT’s web interface has been increasingly showing “Something went wrong” errors after idle periods, and this guide explains two remedies: using an OpenAI API key for more stable access, and installing the KeepChatGPT Chrome/Tampermonkey extension, which suppresses the error and adds several usability enhancements.
The article explains why ChatGPT’s “Something went wrong” error appears frequently, compares using an OpenAI API key versus installing the KeepChatGPT Chrome extension, and provides a step‑by‑step guide to install Tampermonkey and the extension to permanently stop the error.
This article explains the fundamentals of Chrome extension development using Manifest V3, covering concepts such as the manifest file, service workers, content scripts, UI pages, and provides step‑by‑step code examples to build a color‑extraction extension.
This guide explains how to create a Chrome extension that intercepts image downloads from design tools, compresses PNG files using WebAssembly‑compiled pngquant and advpng, uploads the optimized assets to a CDN, and manages them with IndexedDB for efficient front‑end workflows.
This guide walks through creating a Chrome extension using Vue and Vite, covering project initialization, multi‑entry Rollup configuration for background scripts, UI development with tdesign‑vue‑next, debugging hash‑related loading issues, and final deployment steps.
The article describes how the author leveraged GPT‑4 to generate JavaScript bookmarklet code, troubleshoot errors, and ultimately build a Chrome extension named “image‑alt‑copier” that extracts and copies alt text from Midjourney images, illustrating low‑bar entry into web development.
This guide walks you through downloading the SwitchyOmega_Chromium.crx file, enabling Chrome's developer mode, handling the CRX_HEADER_INVALID error with two practical solutions, loading the unpacked extension, and setting up proxy IP and port for seamless browsing.
This article describes a visual self‑service event‑tracking platform for AutoHome H5 pages that separates tracking code from business code, provides a visual editor for non‑technical users, generates SDKs, and includes a Chrome extension for cross‑domain iframe injection.
This article introduces four open‑source JavaScript projects—Screenity, Omni, Mapus, and Flowy—detailing their features, usage, and GitHub repositories, providing developers with powerful tools for screen recording, browser management, collaborative mapping, and flowchart creation.
Mooncake is a unified data‑mocking platform that lets developers quickly generate and switch multi‑scenario mock data via a Chrome proxy plugin, online configuration service, and capture panel, supporting various client environments, and has been promoted internally through demos, documentation, and feedback loops, now serving hundreds of users and thousands of mock scenes.
This article walks through creating a Chrome QR‑code extension using Svelte, covering project setup with SvelteKit, manifest configuration for MV3, component development, reactive logic, download handling, custom adapter creation to satisfy CSP, build steps, debugging, and the final result.
The article explains how NetEase Cloud Music built a Chrome extension that captures tab audio, processes it with an AudioWorkletNode, extracts fingerprints via WebAssembly in a sandboxed iframe, and matches songs locally, all while navigating Manifest V3’s service‑worker, CSP, and deprecation constraints.
Design review often relies on manual screenshot comparison, but this guide introduces a range of Chrome extensions, desktop clients, and npm packages—such as Perfect Pixel, CSS Peeper, Design‑Compare, PixelEye, pixelmatch, and looks‑same—that streamline pixel‑perfect page comparison, improve implementation fidelity, and enable automated visual regression in CI pipelines.
Building a Chrome extension that redirects network requests illustrates the complexities of message passing across isolated contexts, and the article shows how the browser‑extension‑kit framework abstracts routing, state management, and RxJS integration to streamline development, reduce boilerplate, and improve maintainability for React‑based popups and background scripts.
This tutorial explains how to create a Chrome browser extension that generates QR codes (optionally with protocol headers) and decodes them, covering the background motivation, directory layout, manifest and popup design, core JavaScript logic, installation steps, and a download link for the complete source.
This guide introduces Omni, an open‑source Chrome extension that transforms keyboard shortcuts into a powerful productivity suite, detailing its 50+ features, installation methods, command usage, and how developers can customize it via its GitHub source code.
This article demonstrates building a Chrome extension that redirects requests, explains the challenges of managing messages across isolated execution environments, and introduces a new framework—browser‑extension‑kit—that streamlines background, popup, and content‑script communication using RxJS and declarative decorators.
This guide walks you through installing the Chrome Web Scraper extension, explains core concepts like sitemaps and selectors, and demonstrates how to handle both simple and complex pagination as well as secondary page crawling, enabling you to extract structured data from websites without writing code.
This article describes the design and implementation of a cloud‑native automated web‑page recording system for Douyu advertising, covering the problem background, technology stack, end‑to‑end workflow, Chrome extension tricks, containerization with Docker, database handling, and deployment on Kubernetes, enabling scalable, hands‑free video capture and delivery.
This collection presents a range of technical articles covering low‑code and zero‑code solutions, AI‑driven code generation, WebAssembly, frontend engineering practices, algorithms, JavaScript performance, CSS Grid, Chrome extensions, and advanced JavaScript features, offering insights for modern web developers.
This tutorial explains how to create a Chrome extension that injects JavaScript into Juejin pages to load a Live2D cat model, covering manifest configuration, script injection, canvas setup, optional real‑time chat integration, and step‑by‑step installation instructions.
The article explains Chrome extensions’ architecture—including manifest files, background, popup, and content scripts—and how the extension, render, and browser processes communicate, then showcases practical use cases such as page overrides, cookie control, tab management, request interception, DOM automation, and a multilingual management tool for a global e‑commerce platform.
This article reviews the Automa Chrome extension, detailing its installation, main interface, workflow creation, core actions, logging, and plugin utilities, while evaluating its strengths and limitations for automating repetitive web tasks without writing code.
This article explains how to design and implement a Chrome extension using React, Webpack, and JavaScript to store multiple login accounts, tag them, isolate environments, and provide one‑click login directly from the browser and VS Code, improving efficiency for testers, developers, and product teams.
This tutorial walks through creating a Chrome extension from scratch, setting up a Node.js WebSocket server with Express and Socket.IO, and wiring the extension’s background, content‑script, and popup scripts together so they can exchange messages and automate browser actions.
This article explains how to build a Chrome extension that monitors TAPD bug and task status changes and automatically sends notifications to a DingTalk group via a webhook, reducing average resolution time from 4.8 to 2.9 hours and improving testing efficiency.
This tutorial explains what browser extensions are, walks through creating a simple Chrome extension with a manifest file, adds icons and a popup page, details background, content‑scripts, inject‑scripts, permissions, inter‑script communication, and demonstrates a practical HTTP‑Header extension example.
The article expands the San DevTools technical analysis by detailing how to build Chrome DevTools extensions—defining a devtools page, creating panels, and debugging them—while also covering supporting technologies such as Yarn‑workspace monorepos, TypeScript path aliases, a lightweight middleware server, message‑batching bridges, and custom SVG icon components.
San DevTools implements a four‑module remote‑debugging architecture where the Message Channel uses WebSocket to multiplex bidirectional frontend‑backend communication, Chrome extensions exchange messages via ports and postMessage, and both a custom San DevTools Protocol and the standard Chrome DevTools Protocol are supported through hook‑based agents and client examples.
This guide explains why testing Internet Explorer on macOS is still necessary and walks through seven viable approaches—including online cross‑browser services, virtual machines, RemoteIE, Microsoft Remote Desktop, Chrome extensions, WineBottler, and Boot Camp—detailing their setup steps, advantages, and limitations.
Learn how to install the Web Scraper Chrome extension, configure sitemaps and selectors, and handle pagination, scrolling, and click‑load scenarios to build robust, multi‑level web crawling projects without writing code, covering selector types, multi‑page navigation, and data export to CSV.
This article introduces Chrome extension fundamentals, outlines its core components and APIs, and provides a step‑by‑step guide—including server‑side WebSocket handling, content‑script communication, popup QR‑code generation, and installation methods—to create a flip‑pen remote‑control plugin.
This article explains how to build a Chrome extension that integrates with the Hunter distributed tracing system to automatically capture failing API calls during web testing, visualize request chains, and improve debugging efficiency, including manifest configuration, background and popup scripts, and implementation details.
This guide compares common ways to explore open‑source projects, introduces the Octotree Chrome extension as an elegant solution, and provides step‑by‑step instructions for installing and using it to efficiently navigate GitHub repositories.
This guide walks you through installing the Postman Chrome extension—both via the official website and manual unpacked loading—then introduces its main interface, key buttons, and advanced features for API testing and HTTP requests.
Chrome extensions are small HTML‑CSS‑JS programs whose functionality is defined in a manifest.json that lists permissions, icons, and components such as background scripts, content scripts, options pages, and UI actions, with communication via runtime messaging, storage via web or Chrome APIs, and updates managed through an update_url.
This tutorial walks you through creating a Chrome extension—from understanding what extensions are, setting up the manifest and HTML files, testing in developer mode, adding movie‑background features with the TMDb API, to publishing the finished extension on the Chrome Web Store.
This guide walks you through the fundamentals of Chrome extension development, covering what extensions are, their architecture—including content scripts, popup, and background pages—message passing, sample manifest and code, and the steps to package and publish your extension to the Chrome Web Store.
This tutorial walks through creating a Chrome extension that automates page clicks to repeatedly refresh and purchase a Huawei Honor V9, covering element inspection, simulated clicks with timers, JavaScript fundamentals, packaging the extension, and additional handy scripts.
This tutorial walks you through creating a Chrome extension that functions as a standalone app, implementing a GitHub repository search, packaging it with CCA, and running it on iOS simulators or devices, complete with manifest setup and code examples.
This guide walks through building a Chrome extension that automatically clicks Taobao’s red‑envelope buttons, covering folder setup, manifest configuration, XPath button detection, script insertion, loading the extension in developer mode, and testing while noting anti‑cheat limitations.
