GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → pilagod → Js Tracker

pilagod / Js Tracker

Licence: mit
A chrome extension tracks front-end JavaScript that uses DOM / jQuery APIs to manipulate html dom elements (e.g., change style, attach event listener) at runtime.

Programming Languages

javascript
184084 projects - #8 most used programming language
typescript
32286 projects

Labels

chrome-extensionjquerydomtracking

Projects that are alternatives of or similar to Js Tracker

Arrive
Watch for DOM elements creation and removal
Stars: ✭ 703 (+81.65%)
Mutual labels:  jquery, dom
Domquery
PHP library for easy 'jQuery like' DOM traversing and manipulation.
Stars: ✭ 84 (-78.29%)
Mutual labels:  jquery, dom
Domtastic
Small, fast, and modular DOM and event library for modern browsers.
Stars: ✭ 763 (+97.16%)
Mutual labels:  jquery, dom
Shoestring
A lightweight, simple DOM utility made to run on a tight budget.
Stars: ✭ 447 (+15.5%)
Mutual labels:  jquery, dom
Phantomas
Headless Chromium-based web performance metrics collector and monitoring tool
Stars: ✭ 2,191 (+466.15%)
Mutual labels:  jquery, dom
Cash
An absurdly small jQuery alternative for modern browsers.
Stars: ✭ 5,714 (+1376.49%)
Mutual labels:  jquery, dom
Nito
A jQuery library for building user interfaces
Stars: ✭ 56 (-85.53%)
Mutual labels:  jquery, dom
Cheerio
Fast, flexible, and lean implementation of core jQuery designed specifically for the server.
Stars: ✭ 24,616 (+6260.72%)
Mutual labels:  jquery, dom
Jquery Xpath
jQuery XPath plugin (with full XPath 2.0 language support)
Stars: ✭ 173 (-55.3%)
Mutual labels:  jquery, dom
Femtojs
femtoJS - Really small JavaScript (ES6) library for DOM manipulation.
Stars: ✭ 122 (-68.48%)
Mutual labels:  jquery, dom
Vent
jQuery inspired DOM events library
Stars: ✭ 30 (-92.25%)
Mutual labels:  jquery, dom
Dfpm
DFPM is a browser extension for detecting browser fingerprinting.
Stars: ✭ 81 (-79.07%)
Mutual labels:  tracking, chrome-extension
Dna.js
🧬 An uncomplicated user interface library for building data-driven semantic templates
Stars: ✭ 114 (-70.54%)
Mutual labels:  jquery, dom
Testing Playground
🐸 Simple and complete DOM testing playground that encourage good testing practices.
Stars: ✭ 511 (+32.04%)
Mutual labels:  chrome-extension, dom
Privacybadger
Privacy Badger is a browser extension that automatically learns to block invisible trackers.
Stars: ✭ 2,346 (+506.2%)
Mutual labels:  tracking, chrome-extension
Fn Fx
A Functional API around JavaFX / OpenJFX.
Stars: ✭ 373 (-3.62%)
Mutual labels:  dom
Awesome Json Viewer
🔥 A Chrome extension to visualise JSON response and introduce awesome JSON prettifying experiences.
Stars: ✭ 380 (-1.81%)
Mutual labels:  chrome-extension
Ply
CSS inspection aided by visual regression pruning
Stars: ✭ 370 (-4.39%)
Mutual labels:  dom
Gitlab Time Tracker
🦊🕘 A command line interface for GitLab's time tracking feature.
Stars: ✭ 371 (-4.13%)
Mutual labels:  tracking
Eslint Plugin Testing Library
ESLint plugin to follow best practices and anticipate common mistakes when writing tests with Testing Library
Stars: ✭ 384 (-0.78%)
Mutual labels:  dom
View All Similar Projects ➔

Logo JavaScript Tracker Build Status Coverage Status

A chrome extension tracks front-end JavaScript that uses DOM or jQuery APIs to manipulate html dom elements (e.g., change style, attach event listener) on web page at runtime.

Features

  • Live Tracking, what changes you see on page is what code you get.
  • Code by Elements, only listing the code that affects selected element.
  • Brief Overview, getting rough code information at a glance.
  • Easy Filtering, grouping manipulations into 5 types.
  • Link to Source, one click to see all details.
  • Performance Improvement, better performance than previous version by taking advantage of browser JavaScript engine

Demo Video

JavaScript Tracker Demo

Installation

Add JavaScript Tracker to your Google Chrome from Chrome Web Store

Usage (see Demo Video for visual guide)

  1. Go to the page you want to track (you can use example page to give it a try).

  2. Click JavaScript Tracker icon on Chrome browser extension bar.

  3. Interact with the page opened by JavaScript Tracker.

  4. Open Elements panel in Developer Tools and select the element you are interested in.

  5. Go to the "JS-Tracker" sidebar to see what JavaScript code affects the selected element.

There are also some websites selected by me that you can try JavaScript Tracker as much as you like. 😄

Limitations

Those elements wrapped in <iframe> can not be tracked, since <iframe> creates an independent executive environment of its parent.

Future Works

  • Support Firefox
  • Track jQuery-UI
  • Optimize resouce usage

Contribution

Suggestions and discussions are highly welcome. Feel free to open issues or email me for any bug, question, idea or feature wish. 😃

Special Thanks

Special thanks to Fiti, a fantastic UI/UX designer, for the design of logo, banner, music, and materials in sidebar. Without her I will never give birth to this project. 🙂️

License

MIT

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].