Zobacz, jak będziesz debugować strony w Firefoksie w 2012 roku

Firefox nie ma wbudowanych narzędzi programistycznych, a mimo to jest wyborem numer jeden wielu programistów na świecie. Dzieje się tak dzięki niesamowitemu dodatkowi o nazwie Firebug, który ma konsolę błędów, inspektora DOM, CSS, podgląd HTML i transferu.

Mozilla postanowiła jednak w końcu zbudować własne, wbudowane w Firefoksa narzędzia programistyczne. Co prawda, nie mają one za zadanie zastąpić Firebuga, ale dać nowe możliwości mniej zaawansowanym użytkownikom. Jednak są na tyle ergonomiczne, że z pewnością sprawią, że wiele osób nie będzie potrzebowało już Firebuga.

Narzędzia mają zostać udostępnione na początku 2012 roku, jednak już teraz można je przetestować w eksperymentalnym kanale Aurora.

Po części dzięki istnieniu Firebuga Mozilla mogła pozwolić sobie na wypróbowanie nowego podejścia do debugowania strony. Po włączeniu inspekcji elementu zostaje on podświetlony, podczas gdy reszta strony zostaje przyciemniona. Nad obiektem pojawia się nazwa tagu, który mu odpowiada w DOM.

Na dole nie wyświetla się źródło HTML jak w innych przeglądarkach. Mozilla zrobiła tu dosyć odważny krok, bowiem dla wielu z nas debugowanie strony zazwyczaj kojarzy się z grzebaniem w jej HTML-u.

Zamiast tego, zobaczymy na dole okruszki chleba, prowadzące do wybranego tagu w drzewie DOM. Z tego poziomu możemy wybierać tagi wyżej w hierarchii, wybrać wcześniejszy albo następny tag na tym samym poziomie w drzewie.

Po prawej stronie możemy wyświetlić listę właściwości CSS, które jednym kliknięciem są włączane bądź wyłączane. Zmiana ich wartości jest też łatwiejsza niż w kodzie HTML.

Oprócz tego, programiści mogą też podejrzeć HTML, jednak nie jest to funkcja, na którą twórcy Firefoksa kładą nacisk licząc, że nowy system nawigacji wykluczy potrzebę grzebania w HTML.

Ponadto, można odpalić konsolę JS umożliwiającą wywoływanie poleceń na bieżącym tagu albo notatnik JavaScript do pisania testowego kodu JavaScript, odpalanego na widocznej stronie internetowej.

Jeśli brzmi to interesująco, obejrzyj zapowiedź nowości na tym filmie:

Mozilla pracuje też nad integracją pluginu Tilt, wyświetlającego wizualnie zagnieżdżenia tagów i dodaniem skórkowanego edytora kodu dla miłośników jasnego tekstu na ciemnym tle.

Pod koniec przyszłego roku programiści dostaną też narzędzia do analizowania i optymalizacji wydajności aplikacji internetowych.

Ale to nie wszystko. Po siedmiu latach od zgłoszenia Mozilla doda numerację linii w podglądzie kodu źródłowego strony. A mówią, że to Microsoft ma długi ogon.

źródło: webmonkey.com

Podoba Ci się ten tekst? Powiedz o tym innym na Fb: lub na G+:

publikuj:

wydrukuj

6 skomentuj »

Komentarze

#1 dikamilo^® 2011-12-30 13:10:07 0
Opisane narzędzia są już dostępne od jakiegoś czasu na kanale Nightly, część z nich już testowałem jakiś czas temu, nie jest to takie intuicyjne jak firebug ale zawsze coś :)
IP: 79.191.106.[...] Mozilla/5.0 (Windows NT 6.1; WOW64; rv:12.0a1) Gecko/20111229 Firefox/12.0a1
#2 asdf 2011-12-30 14:21:21 0
Beznadzieja. Nie ma szans z firebugiem.
IP: 83.15.53.[...] Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:8.0.1) Gecko/20100101 Firefox/8.0.1
#3 wujek 2011-12-30 18:25:15 0
Okruszki chleba! Boziu, umarłem.
IP: 62.69.200.[...] Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/535.7 (KHTML, like Gecko) Chrome/16.0.912.63 Safari/535.7
#4 Fox 2011-12-30 20:05:27 0
Ja te okruszki chleba nazwałbym "fastryga", podobnie jak to jest przy ikonce domyślnej strony w Firefoksie :) Bo z tym mi się zawsze kojarzy:)

http://www.google.pl/search?q=fastryga&hl=pl&client=firefox-a&hs=V9N&rls=org.mozilla:pl:official&prmd=imvns&source=lnms&tbm=isch&ei=Lgv-TuPxCcT5sgaW4LH-Dw&sa=X&oi=mode_link&ct=mode&cd=2&ved=0CA0Q_AUoAQ&biw=1440&bih=781
IP: 83.27.7.[...] Mozilla/5.0 (Windows NT 6.0; rv:9.0.1) Gecko/20100101 Firefox/9.0.1
#5 tomaszs^® 2011-12-30 23:31:42 0
@wujek

to powstań ;)

@Fox

Ciekawe, ciekawe. Zapamiętam :)
IP: 89.69.28.[...] Mozilla/5.0 (Windows NT 6.1; rv:9.0.1) Gecko/20100101 Firefox/9.0.1
#6 drGonzo 2012-01-05 00:28:08 0
Mnie również polskie tłumaczenie breadcrumbs irytuje :)
IP: 178.182.62.[...] Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/535.7 (KHTML, like Gecko) Chrome/16.0.912.63 Safari/535.7

Aby dodać komentarz, musisz podać swój nick, treść komentarza oraz poprawnie przepisać oba słowa z obrazka (słowa muszą być rozdzielone spacją).
W treści komentarza można używać języka formatowania BBcode.