mrcoles / bookmarklet Goto Github PK

I am posting for the next unfortunate one who is hoping to find a solution for the regeneratorRuntime issue.
I could be persuaded to submit a PR, but it appears the author has abandoned this project so there is no incentive there.

Here is what I did.

1. cloned the project
2. removed all babel dependencies from package.json and code.
3. replaced "uglify-js" with "terser"
4. Here is the function that you have to change.
   function minify(code) { return terser.minify(code).code; }

ta-dah. No more questionably useful babel transpilations.

Hi, when I try to use this it says that the regeneratorRuntime is not defined.
A quick google shows that it's missing the Babel polyfill.

adding it via @script does not work.
only loading it prior to executing the bookmarklet works.

maybe make Babel toggleable with a command line flag?

Please can you add a LICENSE file to this project. package.json says it is has an MIT license - it would be good to add the text of that to the project to make it clear.

The README in this repo shows that there's a -d option to make a demo page, which is neat. However, when running bookmarklet -h in the terminal, this isn't document. Also there's a spurious ' in the output, after "stdout".

Just found this tool and it looks really helpful, thanks :-).

When installing the bookmarklet module NPM warns us that the js-core < 3 has a number of issues and should not be used.

EDIT: Confirmed that this is an issue of babel-core and babel-preset-env. There seems to be an outstanding PR to upgrade to a newer version of babel. Possible fix for this?

The feature that generates a demo page is a real time-saver. However, the styling makes the button and the link have very low contrast. The contrast ratio between the white and cyan is just 1.63:1. Depending on screen, environment and visual acuity, it will be hard for some people to see.

The Web Content Accessibility Guidelines (level AA) recommend at least a 3:1 contrast ratio for meaningful graphical elements (i.e. to help people identify the button against its background) and 4.5:1 for text (for the button's label, and the link)—though if the text is considered large this drops to 3:1.

There are some examples of how to improve non-text contrast on W3C's site.

If you're interested, I'd be happy to submit a PR that addresses the contrast issues. Here are two different possibilities...

1. Simply use a darker colour than the cyan both for the button's background and link text.
2. Use a darker colour for the link text, keep the cyan for the button's background, but use a darker colour for the button's text and add border.

Further, if you try tabbing through the page, the focus indication is very slight too, because it is using the browser's default, and in some browsers this means it's the same light cyan colour, and quite thin, so is also hard to see. (You can use CSS outline-offset to create a border between the focus outline and the button/link, to make it easier to meet contrast requirements.)

Hi, I have some scripts use return on top level thus can't be converted.

Then I find we can tell Terser to enable bare_returns to accept it.
https://github.com/terser/terser#parse-options

Would it be good to add a CLI option like --minify to delegate to Terser?

I am willing to prepare a PR, maybe introduce yargs to help handling the options.

Would be awesome to be able to load external scripts as ecma script modules to do import statements inside the bookmarklets.

I wrote a bookmarklet using ES6 Classes and used class fields in my code. babylon is throwing an error, because, it seems that class fields aren't supported in babel preset env.
bablylonError.txt

Source:

console.log('\w');

Expected result:

console.log('\w');

Actual result:

console.log('w');

Thanks & greetings!

Hello, can I rely on the generated bookmarklet to load the scripts in sequence, or is the order of loading random?

When using this with any code (including running test/run.sh) I am getting the following in the output file:

javascript:(function()%7BNaN%7D)()

Hi. Awesome job - I used to have to do all that work manually. I haven't been so excited to find a new package like this in months! :)

Have you considered making the demo page customizable? For the sake of simplicity, a key in package.json would be enough.
Being able to provide a name for the bookmarklet to show instead of 'Bookmarklet; would be a great start.
Pointing to a HTML page template would be even better.

I could help out with that.