About this extension

Select and run the registered JavaScript (userscript) from the menu. Using browser.tabs.executeScript API.
Works on Android as well as on PC. I developed this extension for Firefox for Mobile where the bookmarklets is not available.

Usage
screenshot

Show menu in page: Show menu in page for quick access to the menu on Android.
Print debug info: Output debug information at the bottom of the Options tab.
Add line numbers: Add line numbers to script resource.
Script Resource: Script to register in the menu.
1. Script Resource must not begin with a non-directive line, such as a blank line. Always start with a specific directive line.
2. Each script begins with the //name directive.
  The //name directive specifies the script name to be displayed on the menu.
  　//name Go page top
3. The //matches directive specifies a comma-separated list of URL patterns for the pages where you want to display the script name. (Optional)
  //matches https://www.google.com/*, https://github.com/*
4. The //exclude directive specifies a comma-separated list of URL patterns for the pages where you don't want to display the script name. (Optional)
  The //exclude directive has a higher priority than the //matches directive.
  //exclude https://yobukodori.github.io/*, https://github.com/yobukodori/*
5. The //option directive specifies a comma-separated list of tokens (Optional). The following tokens are available.
  //option page, all, blank
  - nonce: Sets true to wrapCodeInScriptTag and nonce.
  - page: Sets true to wrapCodeInScriptTag.
  - all: Sets true to allFrames.
  - blank: Sets true to matchAboutBlank.
6. The //options directive sets details. (Optional)
  　//options
  　{
  　　"allFrames": true,
  　　"wrapCodeInScriptTag": true
  　}
  wrapCodeInScriptTag is a Script Menu specific option. If its value is true, the code is wrapped in a script tag and executed. Then you can access the variables/functions/objects, etc. defined by page script.
  Internally convert it to the following code and execute it. (function() { let e = document.createElement("script"); e.append(<your code>); e.nonce = <nonce value>; // Set if nonce option is true. document.documentElement.appendChild(e); e.remove(); })();nonce option is used with wrapCodeInScriptTag to set the nonce attribute on the script tag.
  For example, twitter.com restricts script execution with Content Security Policy nonce-source. To run code in the context of a page script://name xhr logger //matches *://twitter.com/* //; The next option should be 'nonce'. Specifying 'page' will fail. //option nonce //js XMLHttpRequest.prototype.open = new Proxy(XMLHttpRequest.prototype.open, { apply: function(target, thisArg, args ) { console.log(args[0], args[1]); return Reflect.apply(target, thisArg, args); } });
  You can also use comment style or comma expression style so that it will not cause an error when executed as javascript.
  　//options
  　/* { "wrapCodeInScriptTag": true } */
  or
  　//options
  　0, { "wrapCodeInScriptTag": true }
7. Content scripts and Page scripts
  See Content script environment.
  This add-on executes the code as a content scripts.
  To execute the code in the context of a page scripts, inject a script tag that wraps the code. The option wrapCodeInScriptTag does this for you.
  Without wrapCodeInScriptTag option
  [advantage]
  - Can execute external script file specified in the //js section without CSP restrictions.
  - Can read cross-origin resources with xhr/fetch without CORS restrictions.
  [disadvantage]
  - Can't access the variables/functions/objects, etc. defined by the page script.
  With wrapCodeInScriptTag option
  You can access the variables/functions/objects, etc. defined by the page scripts. However, the above restrictions of CSP and CORS will apply.
8. Finally, write the code with the //js directive.
  [NOTE] Doesn't check the syntax of the code, so please paste the code that has been tested to work. //js (function(){ alert("hello"); })();
9. Simply write the URL and you can execute the script.
  This add-on itself reads the script from the URL and executes the loaded code.
  [NOTE] If you want to access the variables/functions/objects, etc. defined by the page script, specify wrapCodeInScriptTag in the //options directive. //js https://yobukodori.github.io/foo.js
10. Prepared the following built-in scripts for Fenix.
  //name View Page Source //js builtin:view-page-source //name View (Selected) outerHTML //js builtin:view-outerhtml
11. //module directive and //require directive
  //module: define module.
  //require: import module or external script file. Can import multiple modules.
  //module libA //js function foo(){ console.log("foo"); } function bar(){ console.log("bar"); } //module libB //js function baz(){ console.log("baz"); } //name item-1 //require libA //js foo(); //name item-2 //require libA, libB //js bar(); baz(); //name item-3 //require https://code.jquery.com/jquery-2.2.4.min.js //js console.log(typeof $);
12. //#include preprocess-directive replaces this line with the contents of the file at the given url.//#include https://yobukodori.github.io/scrip-menu-item.js You can specify any part of the script resource as it is simply replaced before parsing.
13. Other directives. (Optional)
  //disable: disable this script. In case you don't use the script but want to keep it.
  //eof: Ignore the lines that follow.
  //[-=*;#]: Comment line. Excluding //#include.//name Obsolete script //disable //js (function(){/* code */})(); //=============================== //name Beautify the page //# comment //js (function(){/* code */})(); //eof ############################# [memo] ... [todo] ...
Go to line: Move the cursor to the specified line.
Go to Script...: Move the cursor to the start of each script.
Save: Save settings and scripts resource. And apply settings and scripts.
Apply: Apply settings and scripts. (doesn't save).
Get Status: get current status and applied scripts.
Clear Log: Clear log.

Rate your experience

Report this add-on

Used by