Auto Fill Form Extension

Une extension Chrome - Brave - Microsoft EDGE pour remplir automatiquement les formulaires web avec vos informations personnelles.

🚀 Fonctionnalités

• ✅ Détection automatique des inputs - L'icône apparaît automatiquement au clic sur un champ
• ✅ Remplissage en un clic - Cliquez sur l'icône flottante pour remplir automatiquement tous les champs
• ✅ Remplissage automatique des formulaires web
• ✅ Génération automatique de profils aléatoires avec données réalistes
• ✅ Gestion de plusieurs profils - sauvegardez et utilisez différents profils
• ✅ Sauvegarde de vos profils personnalisés avec noms personnalisés
• ✅ Mémorisation du dernier profil utilisé pour un remplissage rapide
• ✅ Support de multiples types de champs (texte, email, téléphone, etc.)
• ✅ Interface utilisateur moderne et intuitive
• ✅ Détection intelligente des champs de formulaire
• ✅ Support multilingue (français et anglais)

📦 Installation

Étape 1: Préparer les icônes

Avant d'installer l'extension, vous devez créer les icônes nécessaires :

1. Créez un dossier icons à la racine du projet
2. Ajoutez trois fichiers d'icônes :
   • icon16.png (16x16 pixels)
   • icon48.png (48x48 pixels)
   • icon128.png (128x128 pixels)

Vous pouvez utiliser n'importe quel éditeur d'images pour créer ces icônes, ou utiliser un générateur d'icônes en ligne.

Étape 2: Charger l'extension dans Chrome

1. Ouvrez Chrome et allez à chrome://extensions/
2. Activez le Mode développeur (en haut à droite)
3. Cliquez sur Charger l'extension non empaquetée
4. Sélectionnez le dossier Auto-Fill-Form-Extention
5. L'extension devrait maintenant apparaître dans votre barre d'outils Chrome

📖 Utilisation

Générer un profil aléatoire

1. Cliquez sur l'icône de l'extension dans la barre d'outils Chrome
2. Cliquez sur 🎲 Générer un profil aléatoire
3. Le formulaire sera automatiquement rempli avec des données réalistes
4. Donnez un nom à votre profil et cliquez sur 💾 Enregistrer le profil

Créer un profil personnalisé

1. Cliquez sur l'icône de l'extension dans la barre d'outils Chrome
2. Remplissez les champs avec vos informations personnelles :
   • Nom du profil (obligatoire)
   • Prénom
   • Nom
   • Email
   • Téléphone
   • Adresse
   • Ville
   • Code postal
   • Pays
   • Entreprise
   • Site web
3. Cliquez sur 💾 Enregistrer le profil pour sauvegarder vos données

Gérer vos profils

• Sélectionner un profil : Utilisez le menu déroulant pour choisir un profil sauvegardé
• Charger un profil : Sélectionnez un profil dans la liste pour le charger dans le formulaire
• Supprimer un profil : Sélectionnez un profil et cliquez sur le bouton 🗑️ pour le supprimer

Remplir un formulaire (Méthode 1 : Icône flottante - RECOMMANDÉ)

1. Naviguez vers une page web contenant un formulaire
2. Cliquez sur n'importe quel champ de formulaire (input, textarea)
3. Une icône flottante 🔖 apparaîtra à côté du champ
4. Cliquez sur l'icône pour remplir automatiquement tous les champs du formulaire
5. Le dernier profil utilisé sera automatiquement sélectionné (ou le premier disponible)

Remplir un formulaire (Méthode 2 : Via le popup)

1. Naviguez vers une page web contenant un formulaire
2. Cliquez sur l'icône de l'extension dans la barre d'outils Chrome
3. Sélectionnez un profil dans le menu déroulant (ou générez-en un nouveau)
4. Cliquez sur ✅ Remplir le formulaire
5. Les champs du formulaire seront automatiquement remplis avec les données du profil sélectionné
6. Ce profil sera mémorisé pour les prochains remplissages automatiques

Effacer un formulaire

1. Cliquez sur l'icône de l'extension
2. Cliquez sur Effacer les champs pour vider tous les champs du formulaire actuel

🔧 Structure du projet

Auto-Fill-Form-Extention/
├── manifest.json          # Configuration de l'extension
├── popup.html             # Interface utilisateur
├── popup.css              # Styles de l'interface
├── popup.js               # Logique de l'interface et gestion des profils
├── content.js             # Script de remplissage et détection des inputs
├── content.css            # Styles pour l'icône flottante
├── data.js                # Données pour génération aléatoire (prénoms, noms, villes, etc.)
├── generator.js            # Générateur de profils aléatoires
├── icons/                 # Dossier des icônes
│   ├── icon16.png
│   ├── icon48.png
│   └── icon128.png
└── README.md              # Ce fichier

🎯 Champs supportés

L'extension détecte automatiquement les champs suivants en utilisant leurs noms, IDs, placeholders ou labels :

• Prénom : firstname, first-name, fname, prenom, prénom, given-name
• Nom : lastname, last-name, lname, nom, family-name, surname
• Email : email, e-mail, mail, courriel
• Téléphone : phone, telephone, tel, mobile, cell
• Adresse : address, street, street-address, adresse, rue
• Ville : city, ville, town
• Code postal : zip, zipcode, postal, code-postal, cp
• Pays : country, pays, nation
• Entreprise : company, organisation, organization, entreprise
• Site web : website, site, url, web

🔒 Confidentialité

Toutes vos données sont stockées localement dans votre navigateur Chrome. Aucune information n'est envoyée à des serveurs externes. Vos données restent privées et sécurisées.

📝 Notes

• L'extension fonctionne sur toutes les pages web
• Les champs désactivés ou en lecture seule ne seront pas remplis
• L'extension déclenche les événements input et change pour s'assurer que les formulaires détectent les changements

🐛 Dépannage

Si l'extension ne remplit pas correctement un formulaire :

1. Vérifiez que votre profil est bien enregistré
2. Vérifiez que les noms des champs du formulaire correspondent aux mots-clés supportés
3. Ouvrez la console développeur (F12) pour voir les messages de débogage

📄 Licence

Ce projet est libre d'utilisation.