Tag: extension
-
How to get browsing history using chrome.history.search()
In this post, I will introduce you how to use chrome.history.search() method to retrieve the browser history in Browser Extension. Manifest First, You need to declare “history” permission into your manifest.json file.For example, Chrome.history.search() method Chrome.history.search() method has two parmeters. You can get your desired history by using the query parameter. chrome.history.search( query: object, callback?:…
-
How to create Side Panel with Chrome Extension
What is Side Panel? A browser side panel is a vertical interface section, typically located on the right edge of a browser. It provides quick access to tools, extensions, or web content without disrupting the main browsing area. Setp1. Edit your manifest.json file To use the Side Panel API, in the extension manifest file: Step2. Create a…
-
How to fix “Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received”
To solve errors related to the asynchronous response In the previous post, I learned how to implement send/receive messages asynchronously in the browser extension. In this post I introduce a sample code of sending a message and returning values asynchronously by showing how to fix the errors related to the asynchronous response. This background.js has…
-
How to send a message to another part of the browser extension – asynchronously
Erros I got when send a message asynchronously I got some errors related to messaging from a content script to another part of the extension for example a background JavaScript. These are the errors I got, I found I need to understand how to send a message to another part of the browser extension asynchronously.…
-
How to Overlay a Custom SVG Image on a Favicon
Hello! Let me introduce an app I created as a browser extension that overlays a custom SVG image (a pink square image) on a fetched favicon to display it as a new favicon. 1. Required files and Prerequisites I’m using a svg.js library to manage svg images. Please see the previous post to see how…
-
How to Generate SVG Favicon and Replace in Browser Extension
I created the Edge Extension to set an SVG format favicon when you double click the page. I will introduce how to implement it. 0. Prerequisites You need to download SVG.js library to create SVG format data in JavaScript that runs in Web Browser. You can see the instructions in the previous post. Also, you…
-
How to Use SVG.js in Browser Extension
Prerequisites This article focuses on developing Edge Extensions. In this post, I will explain how to use the SVG.js library within a Content Script. What’s SVG.js? SVG.js is a lightweight JavaScript library that makes working with SVG (Scalable Vector Graphics) easy. It provides a simple and intuitive API for creating, manipulating, and animating SVG elements…
-
Use SVG.js v3.0 in Edge Extension
Getting Started I’m currently developing an Edge extension. So far, I’ve got to retrieve favicon .ico images, but now I’m looking into how to add a mark to these favicons. For example, enclosing the image with a large red circle or adding a star mark to the top-right corner of the image. Using the SVG…
-
Highlight Tabs with Edge Extension
Overview Today, I will introduce you how to highlight Edge browser tabs when you double click on the active tab page. Every time you click on the tab page, you get highlighted tabs so that you can see which tabs are important for you throughout your web search activity by using this Edge Extension. Edge…
-
Add background.js to Edge Extension
Overview The Complete manifest file is saved in the HistoryMark Repository folder. 1. Update manifest file I added four items to my manifest.json file. The Complete manifest file is saved in the HistoryMark Repository folder. 2. Add EventListner in Content Script I created “content.js” that has addEventListener() method. This JavaScript is injected into all tab…
Journey of learning 