Comment j’ai créé une extension Chrome pour convertir l’orthographe Reg US •

Mains sur Le registre a commencé sa vie à Londres en 1994 et compte aujourd’hui des journalistes et d’autres employés dans le monde entier, c’est-à-dire à San Francisco, Sydney, Singapour, Berlin et au-delà.

Auparavant, nos vautours écrivaient dans leur style local : les Américains utilisaient l’orthographe américaine, les Britanniques s’appuyaient sur l’orthographe britannique, les Australiens étaient à peu près à la mode britannique également, et tous les autres faisaient ce qui leur semblait naturel. Si un article était, par exemple, écrit par l’équipe américaine et publié le matin du Royaume-Uni, l’orthographe serait souvent changée en britannique.

Au fur et à mesure que nous ajoutions plus d’écrivains et d’éditeurs à travers le monde et touchions plus de personnes dans le monde – maintenant environ 40 millions de lecteurs uniques par an – dans toutes sortes de fuseaux horaires, il est devenu nécessaire pour des raisons logistiques et professionnelles de s’entendre sur un seul style cohérent pour le tout le site. Après Le registre passé d’un .co.uk à un .com pendant la pandémie, nous avons choisi l’orthographe américaine.

Pourquoi? Parce qu’il reflète honnêtement la véritable nature mondiale de notre lectorat. L’orthographe britannique peut nous faire apparaître uniquement au Royaume-Uni. Oui, nous sommes nés en Grande-Bretagne, mais aujourd’hui, nous accueillons autant de techniciens d’entreprise que possible sur la planète. Nous voulons que notre saveur de journalisme technologique irrévérencieux et informé se répande partout, afin que nous puissions faire notre part pour défier les fournisseurs, expliquer ce qui se passe et mordre la main qui nourrit l’informatique.

L’orthographe américaine n’est pas la tasse de thé de tout le monde, cependant, ou du moins c’est l’impression que nous avons eue en lisant des notes centrées sur la brique jetées à travers nos fenêtres numériques ces derniers temps.

En tant que branche d’olivier de ce segment passionné de notre lectorat avec une préférence pour l’anglais du roi, ce vautour a décidé de créer une extension de navigateur Chrome pour changer les mots dans les articles publiés de l’orthographe américaine à l’orthographe britannique.

Cela s’appelle Spellerizer, parce que je voulais être subtilement stupide dans l’espoir de me démarquer de la stupidité tentaculaire et impénitente qui est la nouvelle normalité d’Internet. De plus, le nom stupide rappelle que l’extension ne fonctionne pas très bien. Mais bon, c’est gratuit.

La traduction, même entre les orthographes américaines et britanniques, est un art qui nécessite de tenir compte du contexte. Spellerizer n’est pas si astucieux; il repose sur un algorithme de recherche et de remplacement par force brute qui ne prête aucune attention aux mots qui l’entourent. Donc, s’il voit “check”, il remplacera l’orthographe américaine par “check”, même si l’orthographe britannique appropriée dans ce cas est également “check”.

Vraiment, j’aurais dû m’appuyer sur un modèle d’apprentissage automatique pour apporter des modifications orthographiques plus éclairées. Mais cela n’aurait pas été un projet de codage de week-end. N’hésitez pas à soumettre des améliorations via GitHub.

Mon espoir en créant Spellerizer est de démontrer qu’il est raisonnablement facile d’écrire une extension de navigateur et d’encourager ceux qui connaissent modestement JavaScript à s’y essayer.

Bien sûr, il existe des options similaires, telles que des scripts shell, Perl ou Python pour récupérer, traduire et cracher des pages. Mais le navigateur est un logiciel particulièrement important et mérite d’être personnalisé si vous aimez écrire du code.

Spellerizer peut être téléchargé et installé à partir du Chrome Web Store ou de son dépôt GitHub. La première est une meilleure option si vous souhaitez qu’elle persiste et reçoive des mises à jour – certaines personnes signalent que Chrome supprime les extensions chargées manuellement (décompressées) au redémarrage du navigateur par mesure de sécurité. Cependant, ce n’est pas mon expérience.

Comme je n’ai jamais eu d’extension dans le Chrome Web Store auparavant, vous pouvez vous attendre à voir un avertissement – “Cette extension n’est pas approuvée par la navigation sécurisée améliorée”. – sur la page chrome://extensions/ post-installation. Google explique : “Pour les nouveaux développeurs, il faut généralement quelques mois pour obtenir la confiance.”

Spellerizer n’est pas officiellement approuvé ou soutenu par Le registre et son éditeur Situation Publishing qui ne donne aucune garantie quant à son adéquation ou sa fonction. Comme le dit la liste du Chrome Web Store, vous n’en avez probablement pas besoin. Mais si vous le voulez, si vous le voulez vraiment, mes éditeurs sont d’accord avec l’existence de l’extension pour le moment.

La documentation de l’API d’extension Chrome de Google est un bon endroit pour se familiariser avec les particularités de la création d’une extension de navigateur. Une fois que vous avez une idée de base de la façon dont les principaux composants (le fichier manifeste, le service worker, les scripts de contenu et d’autres pages Web liées à l’extension) sont liés les uns aux autres, il vaut la peine d’installer une extension telle que la visionneuse de source d’extension Chrome (CRX) pour afficher le code source de l’extension sur le Chrome Web Store avant de le télécharger.

Il est possible d’afficher le code source d’une extension déjà installée, mais cela demande un peu plus d’effort car vous devez connaître le chemin d’accès au dossier d’extension de Chrome (chrome://version/ -> [Profile Path field]/extensions) puis reconnaissez l’identifiant correct de 32 caractères utilisé pour le nom de répertoire de l’extension parmi d’autres qui peuvent être présents.

Spellerizer est peut-être plus compliqué que nécessaire car j’ai choisi d’implémenter l’internationalisation – un moyen de remplacer les chaînes de texte visibles dans l’extension par du texte traduit basé sur la langue définie par le navigateur. Le script localize.js rassemble les valeurs de texte des éléments de page HTML marqués avec l’attribut “data-i18n”, puis remplace les traductions extraites du fichier messages.json.

L’extension, écrite à l’aide de Manifest v3, fonctionne en chargeant le service worker, background.js, et en affichant onboarding-page.html lors de l’installation. Préliminaires à l’écart, il ajoute une fonction d’écouteur à l’icône Spellerizer, qui si vous avez suivi les instructions et épinglé à la barre du navigateur, sera visible sans fouiller dans le menu contextuel Extensions.

La fonction d’écoute attachée à l’icône du vautour du Spellerizer déclenche le fichier content-script.js, qui fait le gros du travail. Si vous cliquez dessus lors de l’affichage d’un S’inscrire page, il récupère le fichier de données d’orthographe, spelling_data.json (mis à disposition par le développeur Heiswayi Nrird sous une licence MIT), et parcourt tous les nœuds DOM – une arborescence utilisée pour organiser les éléments d’une page Web.

L’approche que j’ai adoptée n’était pas particulièrement sophistiquée – j’ai depuis appris qu’il existe un moyen plus concis d’itérer les nœuds DOM à l’aide d’un objet Treewalker – mais les boucles dans les boucles font le travail. La fonction scanWords (ligne 20, content-script.js) sépare le texte d’affichage associé aux nœuds DOM en mots individuels et compare chacun à chacune des quelque 1700 paires de mots US/UK. S’il trouve une correspondance, il remplace l’orthographe américaine par celle du Royaume-Uni, en préservant la casse de l’original.

Si le script trouve des mots à remplacer, il mettra à jour le badge de l’icône d’extension avec un nombre représentant le nombre de mots échangés. Le badge disparaît lorsque vous cliquez sur un autre onglet du navigateur. Et si vous rechargez un S’inscrire page, toutes les modifications apportées disparaissent car elles ne sont que côté client.

Il y a aussi une page d’options que j’ai ajoutée pour tester les données persistantes via l’API de stockage local. Accessible via un ctrl-clic sur l’icône Spellerizer, le menu des options comporte une seule case à cocher intitulée “World Peace”.

Comme vous pouvez l’imaginer, cela n’a aucun effet. Prendre plaisir. ®