The Chrome context menu offers two options for user interaction: one on the left-click and one on the right-click

Are you looking to create a Chrome browser extension with a context menu that has different actions for left and right clicks? It's possible in Firefox, but how can it be done in Chrome?

https://i.sstatic.net/qrwq3.png

Here is an example implementation in background.js:

chrome.runtime.onInstalled.addListener(function() {
    chrome.contextMenus.create({
        title: 'do action (left cl. - first, right cl. - second)',
        id: 'test',
        contexts: ['link'],
    });
});
chrome.contextMenus.onClicked.addListener(function(info, tab) {
    if (info.menuItemId === "test") {
        console.log("first action completed")
    }
});

Answer №1

It is challenging to differentiate between two clicks in a Chrome context menu.

Admittedly, the concept can be quite perplexing as users may not anticipate such behavior from a context menu user interface.

While clicking with a modifier key is more common (e.g. Delete vs Shift+Delete in a file manager), Chrome does not provide support for this functionality either.

To access the complete list of available data, please refer to this link.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Fixing an erroneous value that has been dragged into the drop function with Jquery

I am encountering an issue with my codes and need some assistance in identifying the problem. The data is being dynamically loaded from the database, and I am using a foreach loop to display all items in a draggable div. The issue arises when I drag an it ...

Using an if statement following the iteration of a JSON object in a React Native application

I am currently working on a weather app using react native as a fun project. I have set up an API to fetch weather data in JSON format. My goal is to show the hourly weather details based on the current time of the day. export default class App extends ...

Guide on converting JSON object to condensed rows when using ng-repeat

From the database, I am receiving a JSON object which is one large object: $scope.totalsum = { "A1": 1155000, "A2": null, "A3": 2133, "A31": 29292, "A32": 2321, "A33": 232342, ...

Issue with Bing Maps Infobox mouseout event: Problem arises when attempting to change the htmlContent asynchronously

Can anyone provide assistance? I am currently utilizing the latest Bing Maps version (v8), and I have encountered an issue. When creating a custom Infobox and populating its contents using an async request such as setTimeout/ajax, the mouseout event is tr ...

Generate Swagger documentation for an API developed using Express 4.x

My challenge lies in documenting my Node and Express 4 server with Swagger for a client. I have explored various tools for this purpose, but haven't found the perfect fit yet. The swagger-node-express tool seems promising, but unfortunately does not ...

Discover the magic of Rails with fullcalendar

When I add an event click in my fullCalendar script in events.js.cofee, it crashes with turbolink. SyntaxError: [stdin]:7:24: reserved word 'function' <%=javascript_include_tag 'application', 'data-turbolinks-track' => ...

Creating a new ES-6 class to extend express-js: Issues with binding getter and setter properties

I am intrigued by the idea of utilizing Express within an extended class. My goal is to create getter and setter methods for a property, but I'm facing the issue of these methods not being bound to the instances as desired. One way to work around this ...

Angular: Having trouble accessing method within scope

I am attempting to utilize a method from my $scope controller, which is imported from a Factory, and execute it using the onclick method in an Ionic-based HTML. However, I am encountering the issue of getting undefined and I am unsure of the reason behind ...

passing a PHP variable into an HTML input field

Recently, I've encountered a problem where I need to transfer PHP variables to HTML input fields. echo $ManuellTagnavnMain; for ($n = 0; $n < 6; $n++) { print_r(++$ManuellTagnavnMain.PHP_EOL); } I'm looking for a way to pass these values ...

When text-indent is assigned a percentage value, what determines the width that is used in the calculation?

Here's another issue I encountered while working on revising my Textarea Line Count plugin (shameless promotion). CSS's text-indent property allows for creating white space before the first line of text. It can be specified in various units like ...

identify the row preceding the expiration month of a domain using JavaScript or jQuery

Is there a way to highlight the row representing the domain whose expiry month is before the current month, using the date and time information provided in the table (<td>2017-04-14 17:21:00</td>) with JavaScript or jQuery? <table> & ...

What is the best method for targeting the clicked element using its class name?

I have a scenario where there are multiple elements with the same class name, but I am only interested in changing the class of the element that is clicked. var icon = $('.opener i'); // Need to target the class of the clicked element Functi ...

Enhancing the Look of Custom HTML Tags with React JSS Styling

I have incorporated material-ui into my project, here is an example of the code I am using: import React from 'react'; import { makeStyles } from '@material-ui/core/styles'; import Button from '@material-ui/core/Button'; cons ...

What is the best way to initiate JavaScript using a button click in WordPress?

I need to add a button to a WordPress page that triggers a JavaScript function when clicked. Here is the HTML code: <!DOCTYPE html> <html lang="en"> <head> <title></title> </head> <body> < ...

Bootstrap Toggle Button with Dropdown Menu

I have a button-group with font awesome icons and a dropdown on one of them, as illustrated in the example below. I am trying to toggle the button status, but for some reason, the 'active' class is automatically removed on mouseout. It seems to ...

Tips for creating a helper function that returns a promise for a React hook function

So, I have this React functional component that makes use of both the useState and useEffect hooks: import React, { useState, useEffect } from 'react'; import { requestInfo } from './helpers/helpers'; const App = () => { const [pe ...

Unable to save object in JavaScript memory

Currently, I am in the process of implementing a Stack in JavaScript using a LinkedList. However, I encountered an issue when trying to instantiate a Node class. When attempting to create a variable let newNode = new Node(x), I am receiving undefined. I a ...

Tips for obtaining the correct Javascript output for the number pyramid

I'm currently in the process of creating a half pyramid of numbers, but I'm facing an issue with getting the output to show the total for each line while maintaining everything except the * sign between the numbers. If anyone is able to offer som ...

Optimizing Chrome's Precious Load Time

Encountering issues with Chrome browser auto-filling passwords, usernames, etc. Creating a problem where input field validation for emptiness is not possible in Chrome while it functions correctly in other browsers. $(document).ready(function() { ...

Choosing an element in JQuery based on the value of its style property

I have three divs with the same class but different styles. I need to select only the third one using JQuery. <div class="ui-dialog ui-widget ui-widget-content ui-corner-all ui-draggable" tabindex="-1" role="dialog" aria-labelledby="ui-dialog-title-div ...