Esta traducción está incompleta. Por favor, ayuda a traducir este artículo del inglés.

 

Valence (es formalmente un adaptador de Firefox Tools) es un complemento experimental que permite a Firefox Developer Tools depurar una mayor variedad de navegadores, no solo los navegadores basados en Gecko Firefox, Firefox para Android y Firefox OS

Los objetivos de depuración iniciales son Chrome en Android, Chrome Desktop y Safari en iOS.

 

 

Valence todavía esta en una etapa temprana, y solo está disponible como un  avance. Nosotros recomendamos no usarlo en el trabajo díario.

Installation and setup

Instalando Valence

Si tú usas Firefox Developer Edition (en cualquier versión) o Firefox 37 y posterior (en cualquier canal), Valence estará instalado automaticamente cuando abras WebIDE, entonces tu podrás saltarte este paso.

De otra manera, instala la última versión aquí.

Nota: Tendrá que habilitar el modo de desarrollador en su dispositivo, así como la depuración de USB. Siga estas instrucciones para habilitar el modo de desarrollador.

Chrome en la configuración de Android

Valence requiere Chrome 37.0 o superior (si instaló Chrome y Chrome beta y ambos se ejecutan al conectar Firefox Developer Tools a su dispositivo, solo verá las pestañas de uno de los navegadores).


Tendrá que habilitar el modo de desarrollador en su dispositivo, así como la depuración de USB. Siga estas instrucciones para habilitar el modo de desarrollador.

Safari, Firefox y otras WebViews en la configuración de iOS

 

Valence ha sido probado contra Safari en iOS 6, 7 y 8, así como para iOS Simulator en OS X. El mismo código es compatible con la depuración de Firefox en iOS y otras WebViews incorporadas en iOS o iOS Simulator.

Deberá habilitar la compatibilidad del desarrollador en su dispositivo. Siga las instrucciones de esta página (en la sección "Para habilitar Web Inspector en iOS") para comenzar.

El soporte de iOS usa el ios-webkit-debug-proxy de Google y su fork ios-webkit-debug-proxy-win32 en Windows. No es necesario que se realice ninguna configuración especial en Mac, Linux y Windows Vista (o posterior), Valence contiene y administra el proxy. En Windows XP, primero deberá descargar PowerShell de Microsoft, que es requerido por el complemento. En Windows, también verá un aviso de firewall la primera vez que se inicia el proxy, donde debe hacer clic en Permitir. Tenga en cuenta que en Windows los controladores de dispositivos son instalados por iTunes, por lo que deberá tenerlos instalados, o al menos las aplicaciones de Apple Mobile Device Support y Apple Application Support que vienen con él.

 

Configuración de Chrome Desktop

 

Valence requiere Chrome 37.0 o superior. También debe iniciar Chrome Desktop con un indicador especial, ya que la depuración remota no está habilitada de manera predeterminada en Chrome Desktop.

La bandera importante es --remote-debugging-port = 9222. Hay una página con información sobre cómo ejecutar el proceso de Chrome con estos indicadores.

Existen otros indicadores que pueden ser útiles si desea ejecutar esto junto con otro perfil de Chrome. Al ejecutar con --no-first-run, --no-default-browser-check y --user-data-dir, puede ejecutar este proceso junto con otro perfil de Chrome.

Por ejemplo, en OSX, podría ejecutar el siguiente comando para iniciar una copia depurada de Chrome:

 

$ /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222 --no-first-run --no-default-browser-check --user-data-dir=$(mktemp -d -t 'chrome-remote_data_dir')

Si hace clic en el botón de la barra de herramientas y no ocurre nada, lo más probable es que no tenga nada ejecutándose en el puerto 9222. Consulte la Consola del navegador para ver qué ha salido mal.

Corriendo Valence

 

Valence funciona al agregar a la ventana de WebIDE que ya se usa para conectarse a Firefox OS.

 

  1. Conecte su dispositivo: conéctelo, encienda su navegador y navegue a la página en la que desea trabajar. Si está utilizando OS X y tiene Xcode instalado, también puede usar el simulador de iOS.
  2. Inicie WebIDE: ejecute WebIDE desde el menú de Web Developer en Firefox.
  3. Elija su Runtime: abra la lista de tiempo de ejecución a la derecha de la barra de herramientas. En la sección "Personalizar", selecciona "Safari, Firefox y otras vistas web en iOS" o "Escritorio de Chrome". Para dispositivos Android, elija "Chrome en Android" en la sección "Dispositivos USB". Es posible que deba aceptar una conexión de depuración desde su dispositivo.
  4. Elija su pestaña: desde la lista de aplicaciones a la izquierda de la barra de herramientas, elija la pestaña que desea depurar.
  5. Inicie la depuración: haga clic en el botón Depurar (se parece a un botón de pausa) para conectar las herramientas del desarrollador.

Envíenos sus comentarios: informe cualquier problema o problema al que se encuentre. Puede usar el rastreador de problemas en nuestro proyecto GitHub. ¡Hay un montón de funcionalidades para agregar, y sus comentarios nos ayudarán a enfocarnos primero en las partes más importantes!

FAQ

¿Qué hay debajo del capó?

Este complemento es una nueva implementación del Protocolo de Herramientas para Desarrolladores de Firefox. En lugar de interactuar directamente con el contenido, habla sobre el protocolo de depuración remota surgido de Chrome y iOS. Esta implementación se aloja dentro del proceso de Firefox y se usa internamente con las herramientas para desarrolladores de Firefox.

¿Cuándo estará listo?

¡Aún no lo sabemos! Trabajamos arduamente y queremos mostrarte nuestro progreso. Cuando estemos seguros de que está listo para ser utilizado para el desarrollo a tiempo completo, haremos un lanzamiento completo. Mientras tanto, la vista previa se actualizará regularmente.

¿Cómo puedo contribuir?

La página del proyecto GitHub tiene instrucciones para involucrarse con el código. Sus comentarios también son útiles: hable con nosotros en Twitter en @FirefoxDevTools, problemas de GitHub o UserVoice.

¿Es esto lo mismo que remotedebug.org?

 

No. El objetivo final del proyecto remotedebug.org es proporcionar un protocolo unificado para que las herramientas de terceros se comuniquen con todos los navegadores, mediante la estandarización de una versión del protocolo Chromium. No conocemos proveedores de navegadores que se hayan comprometido a unificar protocolos.

Con Valence, actualmente no estamos tratando de resolver el problema de un protocolo estándar, solo estamos haciendo lo que tenemos que hacer para proporcionar las herramientas de desarrollo de Firefox para estos navegadores. Nuestra herramienta se basa en el protocolo Firefox Developer Tools en lugar del protocolo Chromium.

Si bien las primeras versiones del bridge de protocolo de remotedebug.org sirvieron como inspiración para este proyecto, estamos tomando la idea en una dirección diferente.

 

¿No están cambiando constantemente los protocolos de flujo descendente?

 

Sí, y creemos que es genial: a medida que las herramientas de desarrollo de proveedores se mueven a un ritmo rápido, ampliamos nuestros protocolos tan rápido como desarrollamos funciones. Nos comprometemos a mantener Valence actualizado a través de estos cambios de protocolo. Esta es una de las razones por las que enviamos esto como un complemento en lugar de una característica incorporada: queremos que las actualizaciones de las nuevas versiones de protocolos lleguen a usted tan rápido como podamos construirlas.

Este no es un trabajo fácil, pero nos preocupamos lo suficiente por este problema que haremos lo que sea necesario para mantenerlo en funcionamiento.

 

¿Puedo usar este protocolo yo mismo para orientar varios navegadores con mi herramienta?

Ese no es un objetivo inicial de Valence. Pero si hay suficiente interés, podríamos considerarlo: ponerse en contacto.

Consigue ayuda

Ve a la sala #devtools en el IRC y trataremos de ayudarte.

Etiquetas y colaboradores del documento

Colaboradores en esta página: KervinAraya, norfeo87, rafaeldel307
Última actualización por: KervinAraya,