696cf3b52a
- Converted the ObjectClient into an protocoljs Front - Converted the SymbolIteratorClient into a protocoljs Front and moved it to devtools/shared/fronts - Converted the PropertyIteratorClient into a protocoljs Front and moved it to devtools/shared/fronts - Converted the EnvironmentClient into a protocoljs Front and moved it to devtools/shared/fronts - Modified calls to `DebuggerClient.release()` so that it tries to call the ObjectFront's release method first, and falls back on `DebuggerClient.release()` if there's no object front - Changed reps so that it instantiates only one ObjectClient per grip - Changed tests so that they expect what the Front's request method resolves to where applicable (i.e. ObjectFront.allocationStack resolves to allocationStack, not a packet object with an allocationStack property) - Changed callbacks provided to ObjectClient methods to be chained to the ObjectFront methods (e.g. ObjectClient.getScope(callback) changed to ObjectFront.getScope().callback()) - Changed tests to use async/await (test_framebindings-x.js, test_functiongrips-x.js, test_objectgrips-x.js) - Changed tests to expect protocoljs to throw an error string instead of an error object (test_objectgrips-fn-apply-03.js, test_threadlifetime-02.js, test_pauselifetime-03.js) Differential Revision: https://phabricator.services.mozilla.com/D48182 --HG-- rename : devtools/shared/client/environment-client.js => devtools/shared/fronts/environment.js rename : devtools/shared/client/property-iterator-client.js => devtools/shared/fronts/property-iterator.js rename : devtools/shared/client/symbol-iterator-client.js => devtools/shared/fronts/symbol-iterator.js extra : moz-landing-system : lando |
||
|---|---|---|
| .. | ||
| assets | ||
| bin | ||
| src | ||
| config.js | ||
| jest.config.js | ||
| LICENSE | ||
| moz.build | ||
| package.json | ||
| postcss.config.js | ||
| README.md | ||
| webpack.config.js | ||
DevTools Reps
Reps is Firefox DevTools' remote object formatter. It stands for representation.
Example
const React = require("react");
let {
Rep,
Grip,
MODE,
ObjectInspector,
ObjectInspectorUtils
} = require("devtools-reps");
function renderRep({ object, mode }) {
return Rep({ object, defaultRep: Grip, mode });
}
ReactDOM.render(
Rep({ object, defaultRep: Grip, mode }),
document.createElement("div")
);
What is what?
Rep
Rep is the top-level component that is capable of formatting any type.
Supported types:
RegExp, StyleSheet, Event, DateTime, TextNode, Attribute, Func, ArrayRep, Document, Window, ObjectWithText, ObjectWithURL, GripArray, GripMap, Grip, Undefined, Null, StringRep, Number, SymbolRep,
Grip
Grip is a client representation of a remote JS object and is used as an input object for this rep component.
Getting started
You need to clone the debugger.html repository, then install dependencies, for which you'll need the Yarn tool:
git clone https://github.com/firefox-devtools/debugger.git
cd debugger.html
yarn install
Once everything is installed, you can start the development server with:
cd packages/devtools-reps/
yarn start
and navigate to http://localhost:8000 to access the dashboard.
Running the demo app
Navigating to the above address will have landed you on an empty launchpad UI:
Click on the Launch Firefox button. This should launch Firefox with a dedicated profile, listening for connections on port 6080.
The UI should update automatically and show you at least one tab for the new Firefox instance. If it doesn't, reload the dashboard.
Click on any of the tabs. This should open the demo app:
Then you can type any expression in the input field. They will be evaluated against the target tab selected in the previous steps (so if there specific objects on window on this webpage, you can check how they are represented with reps etc, ...).
Running the tests
Reps tests are written with jest.
They are run on every pull request with Circle CI, and you can run them locally by executing yarn test from /packages/devtools-reps.
History
The Reps project was ported to Github January 18th, 2017. You can view the history of a file after that date on github or by running this query:
git log --before "2017-1-17" devtools/client/shared/components/reps
They were first moved to the devtools-reps repository, then to the devtools-core one, before being migrated to this repository.