1# DevTools Reps
2
3![](http://g.recordit.co/IxhfRP8pNf.gif)
4
5Reps is Firefox DevTools' remote object formatter. It stands for _representation_.
6
7## Example
8
9```js
10const React = require("react");
11let {
12  Rep,
13  Grip,
14  MODE,
15  ObjectInspector,
16  ObjectInspectorUtils
17} = require("devtools-reps");
18
19function renderRep({ object, mode }) {
20  return Rep({ object, defaultRep: Grip, mode });
21}
22
23ReactDOM.render(
24  Rep({ object, defaultRep: Grip, mode }),
25  document.createElement("div")
26);
27```
28
29## What is what?
30
31### `Rep`
32
33`Rep` is the top-level component that is capable of formatting any type.
34
35Supported types:
36
37> RegExp, StyleSheet, Event, DateTime, TextNode, Attribute, Func, ArrayRep, Document, Window, ObjectWithText, ObjectWithURL, GripArray, GripMap, Grip, Undefined, Null, StringRep, Number, SymbolRep,
38
39### `Grip`
40
41`Grip` is a client representation of a remote JS object and is used as an input object for this rep component.
42
43## Running the tests
44
45Reps tests are written with jest, and you can run them locally by executing `yarn test`.
46
47## History
48
49The Reps project was ported to Github January 18th, 2017. You can view the history of a file after that date on [github][history] or by running this query:
50
51```bash
52git log --before "2017-1-17" devtools/client/shared/components/reps
53```
54
55They were first moved to the [devtools-reps][gh-devtools-reps] repository, then to the [devtools-core][gh-devtools-core] one, before being migrated to this repository.
56
57[history]: https://github.com/mozilla/gecko-dev/commits/master/devtools/client/shared/components/reps
58[gh-devtools-reps]:
59https://github.com/firefox-devtools/reps/commits/master
60[gh-devtools-core]:
61https://github.com/firefox-devtools/devtools-core/commits/5ba3d6f6a44def9978a983edd6f2f89747dca2c7/packages/devtools-reps
62
63## License
64
65[MPL 2](./LICENSE)
66