--- a/devtools/client/shared/components/reps/grip.js
+++ b/devtools/client/shared/components/reps/grip.js
@@ -65,18 +65,21 @@ define(function (require, exports, modul
return (
type == "boolean" ||
type == "number" ||
(type == "string" && value.length != 0)
);
});
let ownProperties = object.preview ? object.preview.ownProperties : {};
+ let propertiesLength = object.preview && object.preview.ownPropertiesLength
+ ? object.preview.ownPropertiesLength
+ : object.ownPropertyLength;
let indexes = this.getPropIndexes(ownProperties, max, isInterestingProp);
- if (indexes.length < max && indexes.length < object.ownPropertyLength) {
+ if (indexes.length < max && indexes.length < propertiesLength) {
// There are not enough props yet. Then add uninteresting props to display them.
indexes = indexes.concat(
this.getPropIndexes(ownProperties, max - indexes.length, (t, value, name) => {
return !isInterestingProp(t, value, name);
})
);
}
--- a/devtools/client/shared/components/test/mochitest/test_reps_grip.html
+++ b/devtools/client/shared/components/test/mochitest/test_reps_grip.html
@@ -20,16 +20,17 @@ window.onload = Task.async(function* ()
const componentUnderTest = Grip;
try {
yield testBasic();
yield testBooleanObject();
yield testNumberObject();
yield testStringObject();
+ yield testProxy();
// Test property iterator
yield testMaxProps();
yield testMoreThanMaxProps();
yield testUninterestingProps();
yield testNonEnumerableProps();
// Test that properties are rendered as expected by PropRep
@@ -175,16 +176,50 @@ window.onload = Task.async(function* ()
mode: "long",
expectedOutput: defaultOutput,
}
];
testRepRenderModes(modeTests, testName, componentUnderTest, getGripStub(testName));
}
+ function testProxy() {
+ // Test object: `new Proxy({a:1},[1,2,3])`
+ const testName = "testProxy";
+
+ // Test that correct rep is chosen
+ const gripStub = getGripStub(testName);
+ const renderedRep = shallowRenderComponent(Rep, { object: gripStub });
+ is(renderedRep.type, Grip.rep, `Rep correctly selects ${Grip.rep.displayName}`);
+
+ // Test rendering
+ const defaultOutput = `Proxy { <target>: Object, <handler>: [3] }`;
+
+ const modeTests = [
+ {
+ mode: undefined,
+ expectedOutput: defaultOutput,
+ },
+ {
+ mode: "tiny",
+ expectedOutput: `Proxy`,
+ },
+ {
+ mode: "short",
+ expectedOutput: defaultOutput,
+ },
+ {
+ mode: "long",
+ expectedOutput: defaultOutput,
+ }
+ ];
+
+ testRepRenderModes(modeTests, testName, componentUnderTest, getGripStub(testName));
+ }
+
function testMaxProps() {
// Test object: `{a: "a", b: "b", c: "c"}`;
const testName = "testMaxProps";
const defaultOutput = `Object { a: "a", b: "b", c: "c" }`;
const modeTests = [
{
@@ -672,15 +707,63 @@ window.onload = Task.async(function* ()
"preview": {
"kind": "Object",
"ownProperties": {},
"ownPropertiesLength": 4,
"safeGetterValues": {},
"wrappedValue": "foo"
}
};
+ case "testProxy":
+ return {
+ "type": "object",
+ "actor": "server1.conn1.child1/obj47",
+ "class": "Proxy",
+ "proxyTarget": {
+ "type": "object",
+ "actor": "server1.conn1.child1/obj48",
+ "class": "Object",
+ "ownPropertyLength": 1
+ },
+ "proxyHandler": {
+ "type": "object",
+ "actor": "server1.conn1.child1/obj49",
+ "class": "Array",
+ "ownPropertyLength": 4,
+ "preview": {
+ "kind": "ArrayLike",
+ "length": 3
+ }
+ },
+ "preview": {
+ "kind": "Object",
+ "ownProperties": {
+ "<target>": {
+ "value": {
+ "type": "object",
+ "actor": "server1.conn1.child1/obj48",
+ "class": "Object",
+ "ownPropertyLength": 1
+ }
+ },
+ "<handler>": {
+ "value": {
+ "type": "object",
+ "actor": "server1.conn1.child1/obj49",
+ "class": "Array",
+ "ownPropertyLength": 4,
+ "preview": {
+ "kind": "ArrayLike",
+ "length": 3
+ }
+ }
+ }
+ },
+ "ownPropertiesLength": 2
+ }
+ };
}
}
});
</script>
</pre>
</body>
</html>