Skip to content

Execute user script

Robin Thomas edited this page Aug 3, 2024 · 12 revisions

Execute user script

This is an advanced command that executes custom JavaScript code in the current webpage.

Warning!

Malicious user scripts can steal your private information. Only install scripts from sources that you trust!

User scripts run with the same permissions as the JavaScript code on the website itself, thus they can read nearly any data that is stored on the website and transmit it to another server.

Malicious websites can tamper with your code. Make sure that your code does not contain any sensitive data!

In JavaScript every global function is essentially a property of the window object and thus can be overwritten by any JavaScript code that is running on the webpage. This is great if you want to tamper with the page, but in return also means that the page can tamper with your code. Visit MDN for an example.
This does not mean that the webpage can do anything it couldn't have done without your code. So there is no real danger. It may break your code, make it behave differently or read your function parameters, but that's it. The last part is the main reason you shouldn't include any sensitive data in you script.

Target frame:

By default the script code is injected into the frame from which the gesture originates. This means the user script can only access variables from the frame's scope. If your code needs to process globally, you can work around this by changing the Target frame setting to All frames and using the postMessage API to communicate between the different frames.

User script API:

The global TARGET variable holds a reference to the HTML element where the gesture started. The target frame option should be set to source frame if your script relies on the TARGET variable.

Additionally Gesturefy exposes some methods from the Webextension API to user scripts. This is a subset of the tabs and windows functions. Every function returns a Promise that will be resolved with the appropriate value. The methods can be accessed via API.%NAMESPACE%.%FUNCTION NAME%();. The following example will get the currently active tab: API.tabs.query({active: true});

Exposed tabs functions:

  • query
  • create
  • remove
  • update
  • duplicate
  • goBack
  • goForward
  • move

Exposed windows functions:

  • get
  • getCurrent
  • create
  • remove
  • update

Examples:

Scroll right (useful for Wheel Gestures)

document.scrollingElement.scrollLeft += 15

Scroll left (useful for Wheel Gestures)

document.scrollingElement.scrollLeft -= 15

Hide element on page

// define global history variable
if (!window._elementHidingHistory) window._elementHidingHistory = [];

// push current element state to history
window._elementHidingHistory.push({
  targetElement: TARGET,
  originalValue: TARGET.style.getPropertyValue("display"),
  originalPriority: TARGET.style.getPropertyPriority("display"),
});
// hide element
TARGET.style.setProperty("display", "none", "important");

Undo hide element

// check if global history variable is defined and not empty
if (window._elementHidingHistory && window._elementHidingHistory.length > 0) {
  // get last history entry
  const elementHidingHistoryEntry = window._elementHidingHistory.pop();
  // show element
  elementHidingHistoryEntry.targetElement.style.removeProperty("display");
  // apply original display styles if any
  elementHidingHistoryEntry.targetElement.style.setProperty(
    "display",
    elementHidingHistoryEntry.originalValue,
    elementHidingHistoryEntry.originalPriority
  );
}

Close right tab

const queryTabs = API.tabs.query({
  hidden: false,
  currentWindow: true
});

queryTabs.then((tabs) => {
 const activeTabIndex = tabs.findIndex(tab => tab.active === true);
 const nextTab = tabs[activeTabIndex + 1]
 if (nextTab) {
   API.tabs.remove(nextTab.id);
 }
});

Search image url with Google

if (TARGET.src) {
 API.tabs.create({
  url: 'https://www.google.com/search?q=' + TARGET.src
 });
}

More user scripts:

Click here to view all issues that deal with user scripts.