2010-07-21 41 views
10

Tôi đã gỡ lỗi thông qua JavaScript bằng cách sử dụng Firebug hơn trăm lần mà không phải lo lắng về những gì đang xảy ra ở đó. Tôi muốn biết chính xác Firebug xử lý gỡ lỗi JavaScript/DOM như thế nào.Firebug hoạt động như thế nào?

Giả sử tôi đặt điểm ngắt trên một số câu lệnh bên trong một phương thức và bắt đầu gỡ lỗi. Tôi muốn biết chuyện gì đang xảy ra ở đó?

+2

Và cũng như thế nào nó sửa đổi các trang web để nó hightlights các yếu tố khi con trỏ lơ lửng trên chúng? – djondal

Trả lời

8

Khi bạn nhấp vào một dòng để đặt điểm ngắt, Firebug sẽ ghi lại URL của tệp và số dòng trong trường hợp bạn tải lại trang. Sau đó, nó tìm kiếm URL/dòng trong cấu trúc dữ liệu nội bộ của nó để quyết định hàm Javascript nào (được gọi là 'script' trong Mozilla) mà bạn muốn breakpoint. Tiếp theo nó gọi một chức năng nền tảng Mozilla để ánh xạ số dòng đến một bộ đếm chương trình liên quan đến sự bắt đầu của hàm. Cuối cùng nó gọi nền tảng để thiết lập một điểm ngắt trên bộ đếm chương trình.

Quay lại khi bạn kích hoạt bảng điều khiển Tập lệnh, Firebug đăng ký gọi lại với nền tảng. Một trong số đó, onBreak, xử lý các điểm ngắt. Khi nền tảng chạy mã JS, nó kiểm tra các cấu trúc bên trong của nó để xem liệu bộ đếm chương trình hiện tại có một bộ breakpoint hay không. Nếu vậy, nó dừng JS thực hiện và gọi lại cho firebug.

Firebug sau đó xem điểm ngắt để quyết định xem đây có phải là điểm dừng có điều kiện hay không, nếu nó có dữ liệu chính xác để hỗ trợ giao diện người dùng trình gỡ lỗi tại điểm ngắt này, v.v. Nếu điều kiện là ok, nó sẽ cho nền tảng để tạm dừng gỡ lỗi, thực thi Javascript cho trang web và các sự kiện nền tảng cho trang web. Sau đó, nó hiển thị tệp nguồn cho điểm ngắt và làm nổi bật dòng. Nếu điều kiện không tốt, nó chỉ tiếp tục.

Các bộ phận phức tạp xuất hiện khi nền tảng không hỗ trợ số dòng chính xác để ánh xạ bộ đếm chương trình. Ví dụ, Firebug có rất nhiều mã để xử lý với eval() và trình xử lý sự kiện được tạo bởi trình duyệt.

Các câu hỏi như thế này tốt hơn trên nhóm tin Firebug theo ý kiến ​​của tôi.

+2

Cảm ơn câu trả lời chi tiết. Tôi nghĩ rằng SO là một nơi tuyệt vời cho các câu hỏi như thế này, mặc dù. Rất nhiều công nghệ có các nhóm tin và các diễn đàn và các diễn đàn email của riêng họ, nhưng tôi có thể dễ dàng tìm thấy thông tin ở đây. Nếu tôi bắt đầu một dự án mới, tôi sẽ biến SO thành trang Hỏi & Đáp chính thức. –

2

Firebug đang sử dụng jsdIDebuggerService là dịch vụ Trình gỡ lỗi.

Trang này chứa thông tin về firebug internals cũng như liên kết đến mã nguồn. Nó không chỉ định tất cả các chi tiết chính xác nhưng nó sẽ phục vụ như là một điểm khởi đầu.

Các vấn đề liên quan