VS2017, WebBrowserControl, Javascript debugging --- wie?

Question

Hallo zusammen,
ich habe ein Projekt in Arbeit inkl. Einsatz von WebBrowserControl mit einer Website, die umfangreichen Javascript-Code enthält.

Nun, geht es um das Testen von Javascript. In so einem Fall gibt es nur geringe Möglichkeiten des Debuggens. Eigentlich erst mal nur mittels Befehlszeile alert(...); kann man Variablenwerte in einer MessageBox anzeigen, der Code hält dann an dieser Stelle auch an. Mit dieser Methode ist das Testen sage ich mal "mittelalterlich" und moderner Programmierung nicht angepasst.

Ich habe schon tagelang nach einer erweiterten Möglichkeit des Debuggens gesucht. Gefunden habe ich mehrere, vollkommen verschiedene Methoden, aber ausschließlich mit englischer Beschreibung und alle recht umständlich.

Kennt nicht jemand eine erträglich einfache Methode, die auch noch in verständlichem Deutsch plausibel beschrieben wird?

Grüße-

---

Dietrich

Answer 1

Visual Studio 2017 unterstützt das Debuggen von Javascript:
https://devblogs.microsoft.com/aspnet/client-side-debugging-of-asp-net-projects-in-google-chrome/

Der Artikel ist nicht auf Deutsch, allerdings denke ich das die nötigen Einstellungen auch so Nachvollziehbar sind. Die Sache ist auch nicht auch Chrome beschränkt, wie der Titel suggeriert (Chrome, Edge und IE sollten gehen).

---

- Gruß Florian

Answer 2

Hallo Florian, danke für deinen Tipp!

Es ist bei mir ein WinForms-Projekt mit WebBrowser-Control, da kann ich keinen Browser einstellen...(?)

Grüße-

---

Dietrich

Answer 3

Es ist bei mir ein WinForms-Projekt mit WebBrowser-Control, da kann ich keinen Browser einstellen...(?)

Dann Frage ich doch mal nach. Was willst Du machen?:

1. Das Javascript der Webseite debuggen
2. Deine eigene Anwendung debuggen

Für 1. ist der Link geeignet.

2. sollte nichts mit dem Javascript zu tun haben, den der Teil ist typischerweise nicht für das Javascript verantwortlich, welches eine aufgerufene Webseite ausliefert.

---

- Gruß Florian

Answer 4

Ich verwende:

Microsoft Visual Studio Community 2017
Version 15.9.9
VisualStudio.15.Release/15.9.9+28307.518
Microsoft .NET Framework
Version 4.7.03056

Ja, ich il 1. machen, Jvascript der Site debuggen.

Aber ich finde nirgends in der Benutzeroberfläche eine Einstellmöglichkeit für den Browser...

Grüße-

---

Dietrich

Answer 5

Aber ich finde nirgends in der Benutzeroberfläche eine Einstellmöglichkeit für den Browser...

Diese gibt es nur, wenn Du auch einen passenden Projekttyp (ASP.Net - Website oder WebApp) geöffnet hast.

---

- Gruß Florian

Answer 6

Wie gesagt, e3s ist ein WinForms-Projekt und ich öffne zum Editieren des Codes die Datei meines HTML-Codes inkl. Javascripts.

Sehe schon, dass es da wohl keine Lösung gibt...

Grüße-

---

Dietrich

Answer 7

Ein WinForms-Projekt ist keine Webseite.

Wenn Du die Webseite debuggen möchtest, musst du diese auch als solche im Visual Studio öffnen, dafür gibt es auch einen extra Menüpunkt File->open->website - beim debuggen wird diese dann in einer IIS Express Instanz ausgeführt.

---

- Gruß Florian

Answer 8

Hallo Dietrich,

öffne die HTML Datei aus dem lokalen Dateisystem in einem Browser deiner Wahl, drück F12 und Du hast die Debugmöglichkeiten des Browsers.

Alternativ leg ein neues Webprojekt in Visual Studio an, ggfs. noch eine Website im lokalen IIS, dessen Basisverzeichnis dann auf das Verzeichnis mit den HTML Dateien verweist und debug die HTML Dateien und den Javascript Teil dann ganz normal über Visual Studio.

Das Konstrukt, das Debugging über das Webbrowser Control durchzuführen, ist IMHO ungewöhnlich und daher gibt es dafür wohl auch keinerlei Unterstützung.

---

Gruß, Stefan
Microsoft MVP - Visual Developer ASP/ASP.NET (2001-2018)
https://www.asp-solutions.de/ - IT Beratung, Softwareentwicklung, Remotesupport

Answer 9

Ich muss nochmals erklären:

Ich habe eine steuernde Winform, von der ich Daten liefere an den HTML-Code im WebBrowser-Control, via Invokescript. Mit diesen Steuerungsdaten arbeitet dann der Javascript-Code im WebBrowser-Control und verändert quasi das Verhalten der Site (ja, ist das nun eine Website oder nicht...).

Es gibt also quasi einen Dialog zwischen einer Winform und dem WebBrowser-Control. Nun war meine Absicht, den Javascript-Code, der im WebBrowser-Control arbeitet, zu überprüfen mittels Debugging, weil einiges nicht so funktionierte wie es sollte.

Aber ich habe schon eine Idee, wie ich das lösen könnte. Komme später darauf zurück.

Danke für die Mitarbeit an alle!
Grüße-

---

Dietrich

Answer 10

Ich habe eigentlich eine ganz simple Lösung gefunden.

Im Javascript habe ich folgende Funktion:
        function debugViaVBValue(variable) {
            if (window.external) {
                window.external.debugSomeValues(variable);
            }
        }
die ich auch im Javascript folgendermaßen aufrufen kann:
debugViaVBValue(latDiff);

Dann in der "korrespondierenden" WindowsForm ebenfalls eine Funktion:
Public Sub debugSomeValues(v As Object)
      Debug.Print(v.ToString)
End Sub

Damit kann ich jede Javascript-Variable während des Ablaufs im Direktfenster anzeigen.

Grüße-

---

Dietrich