How to re-enable right click so that I can inspect HTML elements in Chrome?

Solution 1:

If they have just changed the oncontextmenu handler (which is the most straightforward way to do it), then you can remove their override thus:

window.oncontextmenu = null;

Otherwise, if it is attached to individual elements, you can get all the page's elements, and then remove the handler on each one:

var elements = document.getElementsByTagName("*");
for(var id = 0; id < elements.length; ++id) { elements[id].oncontextmenu = null; }

Or, it seems you can turn off such scripts; via an extension in Chrome or an option in Firefox - in the advanced box for javascript options, switch off 'Disable or replace context menus'.

Solution 2:

Tested in Chrome 60.0.3112.78.

Some of the above methods work, but the easiest in my opinion is:

Open dev tools (Shift+Control+i).
Select the "Elements" tab, and then the "Event Listeners" tab.
Hover over the elements/listener. A "Remove" button will show up.
Click "Remove".

E.g. see photo.

Remove event listener

Solution 3:

This bookmarlet works in Google sites/Youtube as of Aug 2019 (tested in Chrome and Firefox):

function enableContextMenu(aggressive = false) { 
void(document.ondragstart=null); 
void(document.onselectstart=null); 
void(document.onclick=null); 
void(document.onmousedown=null); 
void(document.onmouseup=null); 
void(document.body.oncontextmenu=null); 
enableRightClickLight(document); 
if (aggressive) { 
  enableRightClick(document); 
  removeContextMenuOnAll("body"); 
  removeContextMenuOnAll("img"); 
  removeContextMenuOnAll("td"); 
  } } 

function removeContextMenuOnAll(tagName) { 
var elements = document.getElementsByTagName(tagName); 
  for (var i = 0; i < elements.length; i++) { 
    enableRightClick(elements[i]); 
  } 
} 

function enableRightClickLight(el) { 
  el || (el = document); 
  el.addEventListener("contextmenu", bringBackDefault, true); 
} 

function enableRightClick(el) { 
  el || (el = document); 
  el.addEventListener("contextmenu", bringBackDefault, true); 
  el.addEventListener("dragstart", bringBackDefault, true); 
  el.addEventListener("selectstart", bringBackDefault, true); 
  el.addEventListener("click", bringBackDefault, true); 
  el.addEventListener("mousedown", bringBackDefault, true); 
  el.addEventListener("mouseup", bringBackDefault, true); 
} 

function restoreRightClick(el) { 
  el || (el = document); 
  el.removeEventListener("contextmenu", bringBackDefault, true); 
  el.removeEventListener("dragstart", bringBackDefault, true); 
  el.removeEventListener("selectstart", bringBackDefault, true); 
  el.removeEventListener("click", bringBackDefault, true); 
  el.removeEventListener("mousedown", bringBackDefault, true); 
  el.removeEventListener("mouseup", bringBackDefault, true); 
} 
function bringBackDefault(event) {
  event.returnValue = true; 
  (typeof event.stopPropagation === 'function') && 
  event.stopPropagation(); 
  (typeof event.cancelBubble === 'function') && 
  event.cancelBubble(); 
} 

enableContextMenu();

For peskier sites, set/pass aggressive to true (this will disable most event handlers and hence disable interaction with the page):

function enableContextMenu(aggressive = true) { 
  void(document.ondragstart=null);
  void(document.onselectstart=null);
  void(document.onclick=null);
  void(document.onmousedown=null);
  void(document.onmouseup=null); 
  void(document.body.oncontextmenu=null); 
  enableRightClickLight(document); 
  if (aggressive) {
    enableRightClick(document);
    removeContextMenuOnAll("body");
    removeContextMenuOnAll("img");
    removeContextMenuOnAll("td");
  }
} 

function removeContextMenuOnAll(tagName) {
 var elements = document.getElementsByTagName(tagName);
 for (var i = 0; i < elements.length; i++) { enableRightClick(elements[i]);
  }
} 

function enableRightClickLight(el) { 
  el || (el = document); 
  el.addEventListener("contextmenu", bringBackDefault, true); 
}

function enableRightClick(el) {
  el || (el = document);
  el.addEventListener("contextmenu", bringBackDefault, true); 
  el.addEventListener("dragstart", bringBackDefault, true); 
  el.addEventListener("selectstart", bringBackDefault, true); 
  el.addEventListener("click", bringBackDefault, true); 
  el.addEventListener("mousedown", bringBackDefault, true); 
  el.addEventListener("mouseup", bringBackDefault, true); 
} 

function restoreRightClick(el) {
  el || (el = document);
  el.removeEventListener("contextmenu", bringBackDefault, true); 
  el.removeEventListener("dragstart", bringBackDefault, true); 
  el.removeEventListener("selectstart", bringBackDefault, true); 
  el.removeEventListener("click", bringBackDefault, true); 
  el.removeEventListener("mousedown", bringBackDefault, true); 
  el.removeEventListener("mouseup", bringBackDefault, true);
} 

function bringBackDefault(event) {
  event.returnValue = true;
  (typeof event.stopPropagation === 'function') && 
  event.stopPropagation();
  (typeof event.cancelBubble === 'function') &&
  event.cancelBubble(); 
} 

enableContextMenu();

Solution 4:

I built upon @Chema solution and added resetting pointer-events and user-select. If they are set to none for an image, right-clicking it does not invoke the context menu for the image with options to view or save it.

javascript:function enableContextMenu(aggressive = true) { void(document.ondragstart=null); void(document.onselectstart=null); void(document.onclick=null); void(document.onmousedown=null); void(document.onmouseup=null); void(document.body.oncontextmenu=null); enableRightClickLight(document); if (aggressive) { enableRightClick(document); removeContextMenuOnAll('body'); removeContextMenuOnAll('img'); removeContextMenuOnAll('td'); } } function removeContextMenuOnAll(tagName) { var elements = document.getElementsByTagName(tagName); for (var i = 0; i < elements.length; i++) { enableRightClick(elements[i]); enablePointerEvents(elements[i]); } } function enableRightClickLight(el) { el || (el = document); el.addEventListener('contextmenu', bringBackDefault, true); } function enableRightClick(el) { el || (el = document); el.addEventListener('contextmenu', bringBackDefault, true); el.addEventListener('dragstart', bringBackDefault, true); el.addEventListener('selectstart', bringBackDefault, true); el.addEventListener('click', bringBackDefault, true); el.addEventListener('mousedown', bringBackDefault, true); el.addEventListener('mouseup', bringBackDefault, true); } function restoreRightClick(el) { el || (el = document); el.removeEventListener('contextmenu', bringBackDefault, true); el.removeEventListener('dragstart', bringBackDefault, true); el.removeEventListener('selectstart', bringBackDefault, true); el.removeEventListener('click', bringBackDefault, true); el.removeEventListener('mousedown', bringBackDefault, true); el.removeEventListener('mouseup', bringBackDefault, true); } function bringBackDefault(event) { event.returnValue = true; (typeof event.stopPropagation === 'function') && event.stopPropagation(); (typeof event.cancelBubble === 'function') && event.cancelBubble(); } function enablePointerEvents(el) {  if (!el) return; el.style.pointerEvents='auto'; el.style.webkitTouchCallout='default'; el.style.webkitUserSelect='auto'; el.style.MozUserSelect='auto'; el.style.msUserSelect='auto'; el.style.userSelect='auto'; enablePointerEvents(el.parentElement); } enableContextMenu();

Solution 5:

Easiest thing to do is open the dev tools by pressing Cmd + Opt + I (Mac) or F12 (PC). You can then use the search (magnifying glass, top left on the dev tools toolbar) to select the element.