https://github.com/bbc/videocontext-devtools
Chrome DevTools extension for easy VideoContext debugging.
https://github.com/bbc/videocontext-devtools
Last synced: 6 months ago
JSON representation
Chrome DevTools extension for easy VideoContext debugging.
- Host: GitHub
- URL: https://github.com/bbc/videocontext-devtools
- Owner: bbc
- License: bsd-3-clause
- Created: 2017-04-28T12:17:51.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2024-11-27T15:15:09.000Z (about 1 year ago)
- Last Synced: 2025-03-22T06:51:17.825Z (10 months ago)
- Language: JavaScript
- Homepage: https://bbc.github.io/videocontext-devtools/
- Size: 4.21 MB
- Stars: 23
- Watchers: 23
- Forks: 2
- Open Issues: 6
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# VideoContext Dev Tools
A handy addition to your Chrome Dev Tools for VideoContext. **Requires VideoContext v0.50+**.
To install it, follow the instructions at . Once the extension is installed, open an app with a running instance of VideoContext (you can find a ready-made one [here](http://bbc.github.io/VideoContext/examples/transitions.html)), open your Chrome DevTools and navigate to the VideoContext DevTools tab.
## Identifying running instances
VideoContext automatically registers instances with the Dev Tools and identifies it with an amusing randomly generated name. If you want to manually specify the name that appears in the Dev Tools, then set the VideoContext ID:
```js
const ctx = new VideoContext(canvas)
ctx.id = "my chosen id"
```
## Developing
This extension is formed of two parts - the frontend (the user-facing UI), and the backend (underlying machinery to allow the dev tools extension to pull data from the DOM about running VideoContext instances).
To develop the frontend, run `yarn start`. This starts a webpack dev server which lets you tweak the frontend (which is backed by a mock data source).