El navegador Edge cada día se va pareciendo más a un navegador competitivo, pero aún le faltan muchas cosas para llegar a ser realmente una alternativa seria a los dos grandes Firefox y Chrome.
Entre las muchas cosas que aún tiene que mejorar y ampliar son las extensiones, algo en lo que está haciendo su mejor esfuerzo. El catálogo es corto de momento aunque seguramente irá aumentando a medida que los desarrolladores comiencen a confiar y creer en él.
Microsoft sabe que uno de los fuertes de cualquier navegador son precisamente sus catálogos de extensiones, que dotan de mayor usabilidad y niveles de personalización a sus usuarios.
Tratando de ampliar su catálogo lo más rápidamente posible, ha comenzado a usar una interesante estrategia….si no puedes con el enemigo…COPIALO.
Hace algún tiempo, lanzó una app UWP para Windows 10 llamada Microsoft Edge Extension Toolkit, la cual nos permite migrar o convertir muchas extensiones diseñadas para el navegador Google Chrome en extensiones para Microsoft EDGE, esto con el objetivo de facilitar la migración de extensiones con el menor trabajo de programación posible, llegando al punto de que los desarrolladores ni siquiera tengan que hacer modificaciones en su código y además permitir con el menor esfuerzo que el mismo usuario pueda hacerlo también.
En muchos casos la conversión es sencillísima, sin ninguna complicación y sin necesidad de saber programación, códigos o diseño de extensiones, simplemente seleccionar la extensión objetivo y darle al botón convertir.
En otros casos es posible que no sea posible la conversión por estar íntimamente diseñadas para Chrome, aunque esos casos serán los menos.
Y también es posible que algunas necesiten pequeños retoques menores como un ajuste en los iconos o un texto, etc…
En este tutorial veremos cómo hacer esta conversión usando una extensión de ejemplo.
Para nuestro caso usaremos la extensión Popup Blocker (strict), de la cual ya hicimos un artículo en su día y que no es una extensión complicada.
https://blog-conocimientoadictivo.blogspot.com/2017/01/popup-blocker-strict-bloquea-de-una-vez.html
El primer paso de nuestro tutorial es asegurarnos que tenemos instalada la extensión en nuestro Chrome
El siguiente paso es identificarla en la instalación de Chrome.
Las extensiones de Google Chrome suelen estar disponibles en
C:\Users\NOMBRE DE USUARIO\AppData\Local\Google\Chrome\User Data\Profile 1\Extensions
Es posible que en tu equipo pueda estar ubicado en otro sitio, te recomendamos que consultes la ayuda de Chrome o hagas una simple búsqueda en Internet como hice yo.
Es importante que tengas activada la opción Elementos ocultos en la cinta de opciones del explorador de archivos
El siguiente paso es posiblemente el más pesado…identificar en que carpeta se encuentra la extensión que queremos convertir. Habrá que recorrerlas una a una hasta identificarla. pues las carpetas que las contienen están nombradas con un código numérico y no con sus nombres de extensión.
En nuestro caso de ejemplo, buscamos la extensión Popup Blocker (strict).
Yo fui abriendo carpetas tratando de encontrar el icono de la extensión, que es una buena forma de identificarla
Una vez identificada, podemos copiar su carpeta padre y pegarla en otro sitio como copia de seguridad por si algo sale mal y la dañamos. En mi caso usé la ubicación original como carpeta de trabajo y la que copié la guardé como un seguro por si acaso, aunque puede que tú quieras hacer lo contrario, trabajar con la copia y dejar la original intacta.
Una vez con la extensión de nuestro objetivo perfectamente identificada, pasemos a instalar Microsoft Edge Extension Toolkit.
Podemos instalarla desde la Tienda de Microsoft
https://www.microsoft.com/en-us/store/p/microsoft-edge-extension-toolkit/9nblggh4txvb
Iniciamos la aplicación y pulsamos la opción Load extension to convert
Navegamos hasta donde tenemos la extensión a convertir. En nuestro ejemplo les recuerdo que usé directamente la carpeta original de dicha extensión. Aceptamos pulsando en Seleccionar carpeta
A los pocos segundos veremos el code de cada uno de los elementos que integran la extensión, donde el más importante es el manifest.json
Si somos mañosos con programación, podemos ajustar el code a nuestras necesidades y gustos…yo no soy uno de esos y directamente me va a valer tal y como está.
Es posible que se muestren advertencias indicando problemas y/o errores…como ya he dicho no soy para nada experto en javascript, así que no podría decirles en ese caso como solucionarlo. En este ejemplo, cómo ven no aparecen errores ni problemas (ya les dije que era una extensión no complicada).
Si no hacemos ningún cambio en la misma, pulsamos en You extensión is ready for testing. Click here to see next steps
Es posible que se nos muestre una advertencia UAC de que hay una aplicación tratando de abrir Edge…Le decimos que sí.
Se nos abrirá el navegador Edge con una página con instrucciones. Yo recomiendo leerlas, aunque nosotros seguiremos con los siguientes pasos directamente.
Por defecto, Edge no permite la instalación de extensiones de fuentes de terceros, solo de su tienda. Pero podemos configurarlo para que permita la instalación de fuentes externas (al igual que se hace en Android). Y eso es lo que vamos a hacer a continuación.
En la barra de navegación escribimos
about:flags
y pulsamos Enter.
Se abrirá una página con diversos ajustes para desarrolladores.
De entre todas las opciones, nos aseguramos de marcar la que dice Habilitar características de desarrollador de extensiones
Ya podemos salir de esa página si lo deseamos.
A continuación abrimos el panel de Extensiones desde el menú principal
En el panel de Extensiones, pulsamos en el botón Cargar extensión
Navegamos hasta la carpeta de trabajo de nuestra extensión
En nuestro ejemplo, repito una vez más, usamos la ubicación original de la extensión instalada en Chrome
Y pulsamos en Seleccionar carpeta
En unos segundos se cargará nuestra nueva extensión adaptada ya a Edge
Y eso sería todo. Solo restaría pulir algunos detalles si acaso. Por ejemplo, en este caso el icono que se muestra en Edge es un icono genérico, así que podríamos querer modificar eso para que se muestre el icono de la extensión como en Chrome (o bien uno nuestro personalizado)
Para complementar este tutorial, vamos a tratar de cambiar precisamente el icono.
Edge tiene preferencia por determinados tamaños de icono. Para los mostrados junto a la barra de direcciones o el panel lateral, usa de preferencia los tamaños 20, 25, 30 y 40 pixeles.
Normalmente los iconos de la interfaz de las extensiones se indican en la línea o apartado browser_action en el manifest.json.
Vamos a buscar esa línea en el código en Microsoft Edge Extension Toolkit y observamos que hay dos iconos referenciados, uno de tamaño 16 y otro de tamaño 32.
Esos tamaños no son del gusto de Edge, así que vamos a crear dos nuevos iconos que sí sean compatibles. En nuestro ejemplo vamos a probar con los tamaños 20 y 25, que serían los más aproximados a esos dos.
En el explorador de Windows, navegamos hasta la carpeta donde se ubican los iconos de nuestra extensión.
Usamos un conversor o un editor de imágenes para crear un nuevo icono basado en alguno de los que encontremos ahí, pero de tamaño 20x20 pixeles y otro de 25x25 pixeles.
Cada quien que use la herramienta que mejor le convenga para eso…yo personalmente usé Honeyview y su utilidad de conversión de imágenes.
Cuando tengamos creados nuestros nuevos iconos, regresamos al código y modificamos las líneas que hacen referencia a los iconos para que apunten a los nuevos que hemos creado y pulsamos en Save Files para guardar los cambios
A continuación pulsamos en Validate. No es un paso obligatorio, pero es recomendable. Esto hace que la aplicación revise la sintaxis del código y pueda indicarnos si hay errores.
Abrimos el navegador Edge. Es posible que al principio no se cargue la nueva extensión y nos aparezca un cartel de aviso que nos indica que se han desactivado las extensiones de orígenes desconocidos por motivos de seguridad, Pulsamos en Activar de todos modos
Entramos en el panel de Extensiones. Pulsamos en la rueda dentada al lado de nuestra extensión para abrir su panel de ajustes
Navegamos hacia abajo y pulsamos en el botón Volver a cargar la extensión
Si todo ha ido bien, veremos que el icono de nuestra extensión ya muestra su icono correctamente.
0 comentarios