3

Estoy tratando de lanzar un mensaje por consola, dependiendo del tema elegido en Twitter, como se puede ver en la imagen siguiente:

Ventana emergente mostrada en Twitter para permutar entre los temas de Twitter.

Para poner en contexto: estoy en Firefox, about:debugging, con un complemento de prueba llamado test que tiene solo dos archivos: manifest.json y script.js con lo justo y necesario para que ejecute en paralelo el fichero script.js en el dominio de Twitter, como se ve a continuación:

manifest.json

{
  "content_scripts": [
    {
      "matches": ["https://*.twitter.com/*"],
      "js": ["script.js"]
    }
  ],
  "manifest_version": 2,
  "name": "test",
  "version": "0.1.0"
}

script.js

[...]

Lo único que hace lo de arriba es ejecutar en paralelo y tiempo real, el fichero script.js en Twitter, sin más.

Domino poco Javascript, así que tras investigar un poco mediante ingeniería inversa, he llegado a la conclusión de que el código que se lanza para cambiar entre temas es este.

Mi intención es que al cambiar entre 💙, ⭐️, 🌸, 🐙, 🔥 o 🥑, lance un console.log() distinto.

He probado reemplazando el código entero a lo bestia y metiéndole los parámetros que me interesaban, también he tratado de acceder a las funciones que cambian el tema aquí, pero desde script.js y ninguna de estas dos vías ha solucionado mi problema.

Por los lares de Stack Overflow encontré esta respuesta, de la que más o menos quiero que vaya orientada la solución.

He ofrecido toda la información de la que dispongo. Si la pregunta necesita ser modificada para proveer más información necesaria, invito a los editores a mejorarla, con la intención de esclarificar una respuesta canónica.

1 respuesta 1

0

No es la manera mas straighforward de hacerlo pero cada vez que cambias de color, twitter reemplaza los nodos por lo que cualquier event listener que hayas puestos se pierde, lo que se me ocurre para solucionar el problema es que cada vez que twitter reemplace los elementos, vuelvas a agarrar los nodos y les vuelvas a aplicar un event listener que vigile el cambio.


function spyOnColors() {
  const colores = document.querySelectorAll('label > input');
  colores.forEach(color => {
     color.addEventListener("click", function() {
        console.log(`you clicked ${this.ariaLabel}`);
        setTimeout(spyOnColors, 0);
     })
  })
};

A tener en cuenta, en mi caso observo el evento de click para hacerlo sencillo pero lo que te interesa es saber si cambio el seleccionado asi que podrias usar otros eventos o el mutation observer por el cual preguntaste hace unos dias, te deje una respuesta ahi tambien.

7
  • Si no te funciona avisame, lo probe desde la devtool, no desde el contexto de firefox el 23 mar. 2021 a las 2:19
  • Lo he probado y me salta el error siguiente: Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://api.twitter.com/1.1/jot/client_event.json. (Reason: CORS request did not succeed).
    – user128841
    el 25 mar. 2021 a las 23:27
  • @ortiz Revisa: es.stackoverflow.com/questions/218426 el 26 mar. 2021 a las 23:01
  • lo probaste escribiendo esa funcion en la consola y llamandola o lo probaste desde tu plugin? estas intentando hacer una llamada http dentro de tu callback? el 27 mar. 2021 a las 0:20
  • La llamo desde el complemento.
    – user128841
    el 27 mar. 2021 a las 0:27

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.