Chrome-extension on mobile in Kiwi browser. Add context menu - google-chrome

This code work on desktop Chrome but don't work on android in Kiwi browser, I can't add new option in context menu when I select text
main.js
searchText = function(word){
var query = word.selectionText;
chrome.tabs.create({url: "https://www.ebay.com/sh/research?dayRange=365&sorting=-avgsalesprice&tabName=SOLD&keywords="
+ query}); };
chrome.contextMenus.removeAll(function() {
chrome.contextMenus.create({
id: "1",
title: "demo this!",
contexts:["selection"], // ContextType
}); })
chrome.contextMenus.onClicked.addListener(searchText);

Related

Forge Viewer PDF extension allow Document Browser to stay docked to side

I would like to keep the document browser docked to one side of the viewer with the thumbnails visible and no option to collapse the menu.
export const initializePDF = async (url: string) => {
const viewerDiv: any = document.getElementById("MyViewerDiv");
const viewer = new Autodesk.Viewing.GuiViewer3D(viewerDiv);
var options = {
env: "Local",
useADP: false,
};
Autodesk.Viewing.Initializer(options, () => {
viewer.start();
if (!url) console.log("error loading PDF");
viewer.loadExtension("Autodesk.PDF").then(() => {
viewer.loadModel(url, { page: 3 });
viewer.loadExtension("Autodesk.Viewing.MarkupsCore");
viewer.loadExtension("Autodesk.Viewing.MarkupsGui");
viewer.loadExtension("Autodesk.DocumentBrowser");
});
});
};
It seems that most of the properties and functions of the Autodesk.DocumentBrowser extension just make it easier to get to the various DOM objects of the panel, but then you can use their DOM functions and properties to achieve what you need. Here is the source code of the extension: https://developer.api.autodesk.com/modelderivative/v2/viewers/7.*/extensions/DocumentBrowser/DocumentBrowser.js
To move the panel to the top-left and show the Thumbnails tab you can do this:
let ext = await NOP_VIEWER.loadExtension("Autodesk.DocumentBrowser");
ext.ui.panel.container.style.left = 0;
ext.ui.panel.container.style.top = 0;
ext.ui.panel.panelTabs[1].click();

Can't get the selected text / highlighted text from the tab in my chrome extension

I am developing a chrome extension. I am trying to get the selected/highlighted text from the active tab and do something with it. For now, say all the extension does is writing what the selected text is on a popup. I can't seem to do it. I tried a lot of methods. content script, background scripts. Nothing works. in my manifest.jsonI have permissions for activeTab, contextMenus. I tried multiple functions that take the selected text but nothing works. Example of some functions
const text = (window.getSelection) ?
window.getSelection().toString() :
document.selection.createRange().text;
console.log(text)
chrome.contextMenus.create({
id: 'selectionGetter',
title: 'send selected text',
contexts: ['selection'],
});
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.sendRequest(tab.id, {method: "getSelection"},
function(response){
const url=response.url;
const subject=response.subject;
const body = response.body;
console.log(body)
});
});
chrome.browserAction.onClicked.addListener(function(tab) {
chrome.tabs.sendRequest(tab.id, {method: "getSelection"},
function(response){
sendServiceRequest(response.data);
});
});
Would love your help
See How to access the webpage DOM rather than the extension page DOM? for full explanation, here's a quick illustration:
chrome.tabs.executeScript({code: 'getSelection().toString()'}, ([sel] = []) => {
if (!chrome.runtime.lastError) {
document.body.textContent = 'Selection: ' + sel;
}
});
If you have default_popup declared in manifest.json then put this code in popup.js, and put <script src=popup.js></script> in popup.html. It will run each time the popup is shown.
Otherwise put it inside chrome.browserAction.onClicked listener in the background script.

How to check if extension has been activated in each tabs?

I created a Chrome extension. The function works fine in a single page.
Currently the problem is that how to check if the extension has been activated in each tab. So I can re-initialise the toolbar icon.
Steps to reproduce:
1. In page A, active the extension, change toolbar icon to close icon.
2. Open a new page B, the icon still keep using close icon.
I just want to make the toolbar icon reflect to each page.
I try to use tabs onUpdated, but it will affect the extension activated page.
chrome.tabs.onUpdated.addListener(function (tabId, changeInfo, tab) {
chrome.browserAction.setIcon({
path: "images/logo.png"
});
});
You could call chrome.browserAction.setIcon() passing tabId key, like:
chrome.browserAction.setIcon({
tabId: my-tab-id,
path: {"images/logo.png"}
});
You could also update the icon from background to all tabs, when some condition happens, so you could do something like this:
if (someCondition) {
chrome.tabs.query({}, function(tabs) {
tabs.forEach(tab => {
chrome.browserAction.setIcon({
tabId: tab.id,
path: {"images/logo-A.png"}//ICON A
});
});
});
} else {
chrome.tabs.query({}, function(tabs) {
tabs.forEach(tab => {
chrome.browserAction.setIcon({
tabId: tab.id,
path: {"images/logo-B.png"}//ICON B
});
});
});
}

Connecting Chrome "Rich Notification" Api to Drop Down Menu

I'm trying to have it so that when a user clicks on the drop down menu in the google chrome's browser extension context menu that it creates the Chrome Notification. Any insight as to what I'm doing wrong would be much appreciated.
Side Note: All this is connected to a default popup on the chrome navbar that opens up a pop up box when clicked.
chrome.runtime.onInstalled.addListener(function() {
var context = "selection";
var title = "Add To test";
var id = chrome.contextMenus.create({"title": title, "contexts":[context],
"id": "context" + context});
});
var options = {
type: "basic",
title: "Primary Title",
message: "Primary message to display",
iconURL: "test_logo.png"
};
chrome.contextMenus.onClicked.addListener(function() {
chrome.notifications.create(options, blarg);
});
function blarg() {
console.log("Pop UP FOR LIFE");
}
var options = {
type: "basic",
title: "Primary Title",
message: "Primary message to display",
iconUrl: "test_logo.png"
};
You must change iconURL to iconUrl. After change notifications will work.
chrome.notifications | examples

chrome service worker push notification show only when tab url of my site is closed or not active

I would like to show GCM service worker message only when there is no open chrome tab in my website or the tab is open and not selected (active).
Here is my code.
Error: chrome is not defined(…).
manifest.json
{
"name": "Webplus Express",
"short_name": "Webplus Express",
"icons": [{
"src": "https://raw.githubusercontent.com/deanhume/typography/gh-pages/icons/typography.png",
"sizes": "192x192",
"type": "image/png"
}],
"start_url": "/index.html",
"display": "standalone",
"gcm_sender_id": "298340340811",
"gcm_user_visible_only": true,
"background": {
"scripts": ["service-worker.js"]
},
"permissions": [
"gcm","tabs","activeTab"
]
}
service-worker.js
// The service worker running in background to receive the incoming
// push notifications and user clicks
self.addEventListener('push', function(event) {
// Since there is no payload data with the first version
// of push messages, we'll grab some data from
// an API and use it to populate a notification
var s_id=0;
self.registration.pushManager.getSubscription().then(function(subscription) {
if(subscription!=null){
s_id= subscription.endpoint.split("/").slice(-1);
var mURL="https://www.webplusexpress.com";
var ok=true;
chrome.tabs.getAllInWindow(undefined, function(tabs) {
for (var i = 0;i<tabs.length; i++) {
if (tabs[i].url && (tabs[i].url.indexOf(mURL)!=-1)) {
//chrome.tabs.update(tab.id, {selected: true});
if(tabs[i].highlighted){
ok=false;
}
return;
}
}
});
if (ok){
event.waitUntil(fetch('https://www.wpe.com/pushnotifyapi?s_id='+s_id).then(function(response) {
if (response.status !== 200) {
// Either show a message to the user explaining the error
// or enter a generic message and handle the
// onnotificationclick event to direct the user to a web page
console.log('Looks like there was a problem. Status Code: ' + response.status);
throw new Error();
}
// Examine the text in the response
return response.json().then(function(data) {
if (data.error || !data.notification) {
console.error('The API returned an error.', data.error);
throw new Error();
}
var title = data.notification.title;
var message = data.notification.message;
var icon = data.notification.icon;
console.log('icon received'+icon);
var notificationTag = data.notification.tag;
return self.registration.showNotification(title, {
body: message,
icon: icon,
tag: notificationTag
});
});
}).catch(function(err) {
console.error('Unable to retrieve data', err);
var title = 'An error occurred';
var message = 'We were unable to get the information for this push message';
var icon = 'https://www.webplusexpress.com/images/3web+carre.png';
var notificationTag = 'notification-error';
return self.registration.showNotification(title, {
body: message,
icon: icon,
tag: notificationTag
});
})
);
}
}
});
});
self.addEventListener('notificationclick', function(event) {
console.log('On notification click: ', event.notification.tag);
// Android doesn't close the notification when you click on it
// See: http://crbug.com/463146
event.notification.close();
// This looks to see if the current is already open and
// focuses if it is
event.waitUntil(
clients.matchAll({
type: "window"
})
.then(function(clientList) {
for (var i = 0; i < clientList.length; i++) {
var client = clientList[i];
if (client.url == '/' && 'focus' in client)
return client.focus();
}
if (clients.openWindow) {
return clients.openWindow('/');
}
})
);
});
Referring to Implementing Push Messaging for Chrome might help. It shows each step you need to complete in order to support push messaging in your web app wherein checking if service workers are supported is done before registering the service-worker.js file.
In addition to that, using Page Visibility API to detect when a webpage is visible or in focus might also help. When the user minimizes the webpage or moves to another tab, the API sends a visibilitychange event regarding the visibility of the page as done in SO post - Is there a way to detect if a browser window is not currently active?