Descripción General y Tecnologías Clave

xpath-helper-plus es una extensión para Chrome diseñada para simplificar la localización de elementos web mediante XPath. Está desarrollada principalmente con TypeScript y Vue 3, utilizando Vite como herramienta de compilación. Esta herramienta mejora la funcionalidad original de xpath-helper al incluir características como la simplificación de consultas XPath, lo que agiliza el proceso de selección de elementos.

Tecnologías y Herramientas Utilizadas

• TypeScript: Proporciona tipado estático para mejorar la robustez del código.
• Vue 3: Facilita la creación de interfaces de usuario interactivas mediante componentes.
• Vite: Optimiza el desarrollo y empaquetado de la extensión.
• Chrome Extension API: Integra la herramienta en el navegador.

Requisitos Previos

Antes de proceder, asegúrate de tener instalados los siguientes componentes en tu entorno de desarrollo:

• Node.js (versión 14 o superior)
• npm (gestor de paquetes incluido con Node.js)
• Git (para control de versiones)

Pasos de Instalación

1. Obtener el Código Fuente

Clona el repositorio de xpath-helper-plus usando Git. Abre una terminal y ejecuta:

git clone https://github.com/mic1on/xpath-helper-plus.git

2. Acceder al Directorio del Proyecto

Una vez clonado, navega a la carpeta del proyecto:

cd xpath-helper-plus

3. Instalar Dependencias

Ejecuta el siguiente comando para descargar todas las dependencias necesarias:

npm install

4. Compilar la Extensión

Genera los archivos de distribución mediante el script de compilación:

npm run build

Los archivos resultantes se almacenarán en el directorio dist.

5. Cargar la Extensión en Chrome

1. Abre Chrome y dirígete a chrome://extensions/.
2. Activa el modo de desarrollador en la esquina superior derecha.
3. Haz clic en "Cargar extensión descomprimida" y selecciona la carpeta dist.

La extensión estará disponible en la barra de herramientas de Chrome.

Uso Básico de xpath-helper-plus

Existen dos métodos principales para utilizar la extensión:

• Edición manual: Ingresa una consulta XPath en el panel izquierdo de la extensión; los elementos coincidentes se resaltarán en la página web en tiempo real.
• Selección automática: Mantén presionada la tecla Shift y haz clic en cualquier elemento de la página; la extensión generará y optimizará automáticamente una expresión XPath correspondiente.