fluid-lab / gamepad-navigator

GSoC 2020 project
Other
6 stars 10 forks source link

Cannot handle links with an `href` that has inline javascript. #185

Open duhrer opened 3 months ago

duhrer commented 3 months ago

Sites like Dollar Country embed the libsyn player. The play button is a link whose href is inline javascript, i.e. href="javascrip:void[0];" [sic].

If you try to click this type of link using an element's click method, you'll get a CSP error like:

Refused to run the JavaScript URL because it violates the following Content Security Policy directive: "script-src 'self' 'wasm-unsafe-eval' 'inline-speculation-rules' http://localhost:* http://127.0.0.1:*". Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...') is required to enable inline execution. Note that hashes do not apply to event handlers, style attributes and javascript: navigations unless the 'unsafe-hashes' keyword is present.

Sadly, you cannot just surround this type of error in a throw/catch block, rather you have to listen for a particular error, which means you can't make the original click process continue.

I'm kind of grasping at straws for solutions here, but perhaps we can:

  1. Detect that there is javascript in the href.
  2. Find the element's click handlers and save them to a local variable.
  3. Remove the href from the element.
  4. Reregister the click handlers, perhaps inside a wrapper that issues event.preventDefault.
duhrer commented 2 months ago

Given that we can only get the list of listeners in the dev console, we have no good options thus far.

Someone suggested making the anchor tag into a button, which did work, but had side effects, both visually, and in terms of not working as expected. Basically a pause button replaces the play and it doesn't seem like replacing that with a <button/> works.

This may be the kind of thing we have to document in terms of "sites we can't work with".