Edge AutoRefresh mit Visual Studio Code unter Linux
Ich habe immer wieder Probleme mit den verschiedenen Extensions, die es für Browser gibt, die eine automatische Aktualisierung des Browsers versprechen. Das kann für Webentwickler sehr hilfreich sein, denn anstatt das Browserfenster immer wieder zu aktivieren und zu refreshen bei jeder Änderung, wäre ein automatischer Refresh bzw. ein einfacher Refresh mit nur einer Tastenkombination, direkt aus dem Editor heraus, sehr hilfreich. Die besagten Browser-Erweiterungen funktionieren immer nur sporadisch, also habe ich nach einer anderen Lösung gesucht. Unter Windows hatte ich das mal mit Powershell hinbekommen. So etwas muss doch dann auch für Linux möglich sein ... .
Das ist natürlich auch so, aber die Lösung war doch etwas schwieriger, als gedacht. Es reicht ja nicht, dass die Lösung einfach nur den Browser aktiviert und einen Reload der Seite initiiert. Anschliessend soll ja auch wieder der Editor - in diesem Fall Visual Studio Code - aktiviert werden, um direkt die nächsten Änderungen/Korrekturen vornehmen zu können.
Der Ablauf ist folgender:
- Suche den EDGE Browser
- Aktiviere das Fenster
- Sende STRG+R oder F5 für den Reload
- Gehe zurück zur Ausgangsanwendung
Unter Linux gibt es mit xdotool eine Möglichkeit, die Steuerung von Fenstern zu automatisieren. Das klappt auch, aber nur wenn man Linux mit "X11 ⧉" als Windowmanager betreibt, was veraltet ist. Die meisten Linux Distributionen nutzen als Windowmanager seit einiger Zeit "Wayland ⧉". Diskussionen darüber arten in die tiefgehende Glaubensfragen aus - ich sehe das immer pragmatisch und denke, dass die größtmögliche Kompatibilität mit Wayland erreicht wird und ein Switch zurück zu X11 auf lange Sicht Probleme verursachen wird.
Die Lösung habe ich gefunden, in dem ich den Edge Browser unter Linux installiert habe und ihn mit Hilfe eines Python Scripts und den Paketen Selenium und webdriver-manager steuere. Auf dem System muss natürlich Python und der Paketmanager PIP installiert sein. Dann kann man diese Pakete installieren:
pip install selenium webdriver-manager
Das Python-Script sieht dann wie folgt aus:
Hier ist zu beachten, dass in Zeile 7 der Pfad zu dem Edge-Driver im eigenen Homeverzeichnis angepasst werden muss. Warum in den Options auf "Chrome" verwiesen wird (Zeilen 10 und 11), dass kann ich nicht sagen - es funktioniert und dass ist das Wichtigste :-)
Aber damit das Ganze funktioniert reicht es nicht, den EDGE Browser einfach nur zu starten. Er muss im Developer-Modus gestartet werden, damit Selenium auf den Browser zugreifen kann. Das ist aber ganz einfach und funktioniert mit dieser Zeile:
microsoft-edge --remote-debugging-port=9222
Dieses Script kann man nun wieder in Visual Studio Code zunächst als Task einbetten und dann mit einem Keyboard Shortcut versehen. Ich habe zusätzlich auch diese Zeile, um den Edge zu starten, als separates Bash-Script eingebunden und kann dann den Browser und den Refresh mit separaten Shortcuts direkt auslösen. Wie man so etwas macht, habe ich in diesem Blog-Eintrag ⧉ genau erklärt.
So sieht der Task aus, der das Python Script, welches ich RefreshEdgeBrowser.py genannt habe, startet:
Die Definition des Keyboard Shortcuts sieht dann so aus:
Die Tastenkombination Alt+0 (Ziffernblock) löst dann das Script aus
Warum eigentlich EDGE unter Linux - ziemlich bescheuert, oder? Den Microsoft-Browser unter Linux installieren, sich also die Microsoft-Kröte in das schön bereitete Linux Nest legen? Nun, ich sehe das alles nicht als Glaubensfrage, sondern sehr pragmatisch. Wenn man den EDGE als Zielbrowser nutzt, hat man einen großen Teil aller Eventualitäten abgedeckt. Die Feinarbeit kann man dann mit der "Firefox Developer Edition" ⧉ und "Chromium" ⧉ erledigen.
Diese Lösung ist wirklich äußerst praktisch. Einfach einen Refresh mit Tastendruck aufrufen und schon sieht man das, was man im Code gerade eben fabriziert hat. Wer viele kleine Änderungen machen muss (ich erlebe das z.B. häufig, wenn Modalfenster in Bootstrap gebaut werden müssen, die eine Form beinhalten), dann spart das viel Zeit und nervige Klickerei.