{"id":1993,"date":"2021-10-13T12:12:05","date_gmt":"2021-10-13T10:12:05","guid":{"rendered":"https:\/\/ekiwi.de\/?p=1993"},"modified":"2021-10-13T12:12:05","modified_gmt":"2021-10-13T10:12:05","slug":"java-script-und-html-debugging-in-autodesk-fusion-360","status":"publish","type":"post","link":"https:\/\/ekiwi.de\/index.php\/1993\/java-script-und-html-debugging-in-autodesk-fusion-360\/","title":{"rendered":"Java-Script und HTML-Debugging in Autodesk Fusion 360"},"content":{"rendered":"<p>Wie debuggt man JavaScript und pr\u00fcft HTML in Autodesk Fusion. <\/p>\n<p><!--more--> <\/p>\n<p>Derzeit arbeite ich an einem Plugin f\u00fcr Autodesk Fusion, mit einigen HTML-Schnittstelle und ich fragte mich, wie zu debuggen und inspizieren den HTML-Teil der Anwendung. Hier sind einige Informationen. <\/p>\n<p>Wenn Sie eine Anwendung \/ ein Addin in Autodesk Fusion starten, sollten Sie in der Lage sein, die Anwendung remote zu debuggen. Zum Beispiel k\u00f6nnen Sie &#8222;localhost:1234&#8220; in Chrome oder Edge \u00f6ffnen, um sich mit dem internen Browser von Fusion zu verbinden. Fusion verwendet einen Browser namens Neutron, der aber im Grunde ein Chromium-Browser ist. <\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"\/wp-content\/uploads\/2021\/10\/fusion_1.png\" alt=\"\" width=\"391\" height=\"241\" class=\"alignnone size-full wp-image-1994\" srcset=\"\/wp-content\/uploads\/2021\/10\/fusion_1.png 391w, \/wp-content\/uploads\/2021\/10\/fusion_1-300x185.png 300w\" sizes=\"auto, (max-width: 391px) 100vw, 391px\" \/><\/p>\n<p>Wie Sie sehen k\u00f6nnen, \u00f6ffnet sich ein Bildschirm, in dem Sie die Anwendung ausw\u00e4hlen k\u00f6nnen. Sobald Sie auf die Anwendung klicken, sollten sich die Entwicklungswerkzeuge von Chrome verbinden. Ich hatte jedoch ein Problem. <\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"\/wp-content\/uploads\/2021\/10\/fusion_2.png\" alt=\"\" width=\"535\" height=\"166\" class=\"alignnone size-full wp-image-1995\" srcset=\"\/wp-content\/uploads\/2021\/10\/fusion_2.png 535w, \/wp-content\/uploads\/2021\/10\/fusion_2-300x93.png 300w\" sizes=\"auto, (max-width: 535px) 100vw, 535px\" \/><\/p>\n<pre>\r\ninspector.js:2930 Uncaught TypeError: document.registerElement is not a function\r\n    at Object.UI.registerCustomElement (inspector.js:2930)\r\n    at inspector.js:2941\r\n    at inspector.js:2943\r\n<\/pre>\n<p>Nach einigen Recherchen im Internet wurde empfohlen, den CEF-Client aus dem folgenden Github-Projekt zu verwenden: <\/p>\n<p><a href=\"https:\/\/github.com\/Adobe-CEP\/CEP-Resources\/tree\/master\/CEP_9.x\" target=\"_blank\" rel=\"noopener\">https:\/\/github.com\/Adobe-CEP\/CEP-Resources\/tree\/master\/CEP_9.x\/<\/a><\/p>\n<p>Laden Sie einfach den Cef-Client f\u00fcr Ihr Betriebssystem herunter und f\u00fchren Sie ihn aus. Mit dem Client konnte ich eine Verbindung herstellen, die Anwendung debuggen und \u00fcberpr\u00fcfen. <\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"\/wp-content\/uploads\/2021\/10\/fusion_3.png\" alt=\"\" width=\"848\" height=\"559\" class=\"alignnone size-full wp-image-1996\" srcset=\"\/wp-content\/uploads\/2021\/10\/fusion_3.png 848w, \/wp-content\/uploads\/2021\/10\/fusion_3-300x198.png 300w, \/wp-content\/uploads\/2021\/10\/fusion_3-768x506.png 768w, \/wp-content\/uploads\/2021\/10\/fusion_3-120x80.png 120w\" sizes=\"auto, (max-width: 848px) 100vw, 848px\" \/><\/p>\n<h2>Audodesk Fusion Browser-Debugging, Anwendung wird nicht angezeigt<\/h2>\n<p>Da dies bei meinem Test-Addin funktionierte, funktionierte es nicht bei dem Addin, an dem ich gerade arbeitete. Es gibt also eine andere M\u00f6glichkeit der Verbindung, die auch mit dem installierten Edge-Browser funktioniert. Dies k\u00f6nnte ohnehin der bessere Weg zur Fehlersuche sein.  <\/p>\n<p>OK, \u00f6ffnen Sie also http:\/\/localhost:9766 und dann werden die ge\u00f6ffneten HTML-Seiten angezeigt. Sie k\u00f6nnen sie anklicken und sollten nun auch in der Lage sein, die HTML-Seite zu debuggen und zu inspizieren. <\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"\/wp-content\/uploads\/2021\/10\/fusion_4.png\" alt=\"\" width=\"980\" height=\"366\" class=\"alignnone size-full wp-image-1997\" srcset=\"\/wp-content\/uploads\/2021\/10\/fusion_4.png 980w, \/wp-content\/uploads\/2021\/10\/fusion_4-300x112.png 300w, \/wp-content\/uploads\/2021\/10\/fusion_4-768x287.png 768w\" sizes=\"auto, (max-width: 980px) 100vw, 980px\" \/><\/p>","protected":false},"excerpt":{"rendered":"<p>Wie debuggt man JavaScript und pr\u00fcft HTML in Autodesk Fusion.<\/p>\n","protected":false},"author":1,"featured_media":588,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_links_to":"","_links_to_target":""},"categories":[5,15],"tags":[419,77,4,44],"class_list":["post-1993","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-hmtl","category-javascript","tag-autodesk","tag-chrome","tag-html","tag-javascript"],"_links":{"self":[{"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/posts\/1993","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/comments?post=1993"}],"version-history":[{"count":0,"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/posts\/1993\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/media\/588"}],"wp:attachment":[{"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/media?parent=1993"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/categories?post=1993"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ekiwi.de\/index.php\/wp-json\/wp\/v2\/tags?post=1993"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}