Testen der eigenen Website für Microsoft Edge auf Mac, Linux und Windows


Microsoft Edge ist der neue Standardbrowser in Windows und steht über das Update auf Windows 10 vielen neuen Nutzern zur Verfügung. Mit seiner neuen Rendering Engine (EdgeHTML) und interessanten Funktionen für den Endnutzer, ist er ein Browser für das moderne Web. Wer mehr zu Microsoft Edge erfahren möchte, dem empfehle ich diesen TechTalk zu Microsoft Edge, den ich gemeinsam mit Daniel Meixner aufgenommen habe.

Durch das kostenfreie Update auf Windows 10 wird sich Edge schnell verbreiten und spielt daher für Webentwickler eine immer wichtigere Rolle. Aus diesem Grund sollte die eigenen Website für Microsoft Edge getestet werden, insbesondere wenn noch auf veraltete Technologien wie Browserweichen über den User Agent oder Plug-Ins zurückgegriffen wird. In Zukunft sollte also Microsoft Edge ein fester Bestandteil der Testmatrix sein. Doch wie können wir unsere Websites in Microsoft Edge testen, wenn wir kein Windows 10 System zur Verfügung haben? Im folgenden möchte ich die Werkzeuge vorstellen, die Microsoft zum Testen bereitstellt.

Wer lieber ein Video anschaut, statt zu lesen: Fast alle der folgenden Punkte habe ich auch in diesem Video auf Channel 9 zusammengefasst.

Testen für Microsoft Edge

Das wichtigste vorab: Wer heute schon auf moderne Web Standards zurückgreift und auf Browser-spezifische Funktionalitäten verzichtet, dessen Website wird mit sehr großer Wahrscheinlichkeit schon jetzt ohne Probleme mit Microsoft Edge funktionieren.

Für eine Kompatibilität mit Microsoft Edge sollte ich möglichst viele der folgenden Fragen mit “Ja” beantworten können:

  • Verzichte ich auf die Verwendung von veralteten Document Modes?
    • Nutzung von <!DOCTYPE html> und Verzicht auf x-ua-compatible im Header der Seite
  • Wird unterschiedlichen modernen Browsern das gleiche Markup ausgeliefert?
    • Verzicht auf Browserweichen
  • Verzichte ich auf veraltete Plug-Ins?
    • Wie andere moderne Browser bringt Microsoft Edge eine Unterstützung für Flash und PDF mit. Andere Plug-Ins werden nicht unterstützt. Viele Plug-Ins sind durch moderne Web Standards nicht mehr zeitgemäß.
  • Sind alle JavaScript Libraries aktuell?
    • Veraltete JavaScript Libraries können Sicherheitsrisiken, Browserweichen und fehlende Unterstützung für z.B. Touch Events mit sich bringen.
  • Verzichte ich auf User Agent Sniffing zum Zweck der Browsererkennung?
    • Browser Detection statt Feature Dectection, kann dazu führen, dass Nutzer neuer Browser / Browser-Versionen nicht korrekt erkannt werden und daher nicht alle Funktionen der Website nutzen können. Hier sollte auf Feature Detection umgestellt werden.
  • Verzichte ich auf Herstellerspezifische CSS Prefixes, oder gebe zumindest immer auch die Herstellerneutrale Variante an?
    • Die Nutzung von speziellen CSS Prefixes, ohne die Angabe einer Alternative, kann die Darstellung der Seite für Nutzer anderer Browser erheblich verschlechtern.

Dies sind schon ein paar Punkte, welche jedoch mit den richtigen Werkzeugen schnell zu ermitteln sind.

Site Scan

Unter http://dev.modern.ie/tools/staticscan/ steht ein kostenfreier Site Scan bereit, welcher die eigene Website auf die oben genannten Punkte untersucht und gegeben falls Verbesserungsvorschläge liefert. Umso besser meine Seite in diesem Test abschneidet, umso besser ist auch die Kompatibilität mit Edge und anderen modernen Browsern.

image

Die wichtigsten Bereich sind hierbei die oben angesprochenen Punkte, hier unter “Modern web interoperability”. Wer weitere Verbesserungen wie Responsive Design oder eine optimale User Experience unter Windows umsetzen möchte, kann zudem in die unteren Punkte tiefer einsteigen.

Ein typischer Testbericht gibt einem einen guten Einblick in die kritischen Punkte und liefert Hinweise und Links zur Verbesserung der eigenen Seite. Hier als Beispiel die Details zu CC Prefixes:

image

Virtuelle Maschinen mit Microsoft Edge

Viele Entwickler haben aktuell noch nicht die Möglichkeit auf ein Windows 10 System mit Microsoft Edge für Testzwecke zurück zu greifen. Aus diesem Grund stehen über http://dev.modern.ie/tools/vms/ virtuelle Maschinen (VMs) für Linux, Mac und Windows Hostsysteme bereit. Je nach System sind die VMs für die Nutzung mit Hyper-V, VirtualBox, VMware oder Parallels.

image

Die für einen Test mit Microsoft Edge relevante VM ist “Microsoft Edge on Win10”, es stehen jedoch für den Unternehmenseinsatz auch VMs mit älteren Windows Versionen und dem Internet Explorer von Version 6 – 11 bereit.

Nach dem Download der VM (ca. 4 GB), muss diese noch mit dem gewählten Virtualisierungstool gestartet werden. Der Login für die Windows 10 VM mit Edge lautet User “IEUser” und das Passwort “Passw0rd!”, jeweils ohne “”.

In der virtuellen Maschine kann Microsoft Edge nun für Tests der eigenen Seite verwendet werden. Hierfür stehen, neben dem Browser selber, natürlich auch die neuen F12 Entwicklertools von Microsoft Edge zur Verfügung. Mit diesen kann nicht nur zwischen Windows 10 und Windows 10 Mobile Modus gewechselt werden, sondern auch die eigene Seite zu Testzwecken mit unterschiedlichen User Agents aufgerufen werden.

image

Fernzugriff auf einen Internet Explorer mit Edge Rendering Engine über RemoteIE

Da nicht für jeden Entwickler und jede Hardware der Download und Betrieb einer vollständigen virtuellen Maschine geeignet ist, besteht unter https://remote.modern.ie/ die Möglichkeit über Azure Remote App kostenfrei auf eine angepasste Form des Internet Explorer 11 mit EdgeHTML Rendering Engine (statt Trident / MSHtml) zurück zu greifen.

Der Azure Remote App Client steht für Mac, iOS, Android, Windows Phone und Windows zum Download bereit. Über diesen Client kann dann direkt, ohne Download einer vollständigen VM, auf einen Browser mit der neuen Rendering Engine zurückgegriffen werden.

image

Wie ein Check des User Agent Strings zeigt, identifiziert sich dieser Browser, trotz Internet Explorer-Optik, mit dem gleichen User Agent String wie Microsoft Edge und nutzt die gleiche Rendering Engine.

image

Dieser Browser kann somit zum Test der eigenen Website für Microsoft Edge verwendet werden. Dies ist ein wichtiger Unterschied zum “regulären” Internet Explorer 11 unter Windows 10, welcher weiterhin aus Kompatibilitätsgründen zur Verfügung steht und die bisherige Trident Engine nutzt.

image

Zusammenfassung und weitere Ressourcen

Wie wir gesehen haben, können dank der Werkzeuge auf dev.modern.ie neben einem Windows 10 System mit Edge einige weitere Möglichkeiten für den Test der eigenen Website für Microsoft Edge verwendet werden. Hiermit sollte einem Test, auch von Mac und Linux Systemen, nichts mehr im Wege stehen.

Hier noch ein paar weitere Informationen zum Test für Microsoft Edge:

  • Microsoft Edge unterstützt auch WebDriver zum automatisierten Test von Websites. Das entsprechende Tool steht hier zum Download bereit. Die möglichen WebDriver commands findet man im Bereich Platform Status auf der Edge Developer Site. Dieser Blogeintrag geht näher auf die Verwendung von WebDriver ein.
  • Um die Unterstützung für einzelne Funktionen in Microsoft Edge (und anderen Browsern) zu prüfen gibt es unter http://dev.modern.ie/platform/status/ eine Übersicht mit Suchfunktion.
  • Neben den Entwickler Ressourcen unter http://dev.modern.ie gibt es Community-Unterstützung bei stackoverflow. Auch Microsoft Mitarbeiter (unter anderem aus der Edge Produktgruppe) sind dort aktiv.
  • Auf GitHub findet sich zudem ein Tutorial zum Edge Mode und dem Thema Feature Detection.

Ich hoffe ich konnte mit diesem Artikel einen guten Überblick über die Möglichkeiten für den Test der eigenen Website für Microsoft Edge geben. Bei Fragen und Anregungen stehe ich gerne über die Kommentare oder Kontaktmöglichkeiten zur Verfügung.

Video: Testen der eigenen Website für Microsoft Edge von Mac, Linux und Windows

 

Links:

English Abstract:

You can use the tools on dev.modern.ie to test your website for Microsoft Edge, even if you are developing on Linux, Mac or an older version of Windows. The Edge Developer Site offers a free site scanner to flag common issues, Virtual Maschines with Windows 10 + Edge and remote browser access from different systems. If you are already using modern web standards you are already on the right way to reach compatiblity with Microsoft Edge.

Comments (0)

Skip to main content