devtools/client/shared/components/test/mochitest/test_reps_array.html
author Michael Ratcliffe <mratcliffe@mozilla.com>
Thu, 21 Jul 2016 14:39:58 +0100
changeset 346682 b1fce35d1cc8e057d4540dd64d7433394993f9ef
parent 345915 24530e316b12694eebf9f853d6f7800f7656b579
child 346800 951aa830b05185b7a7c98bf734dbab355b31a915
permissions -rw-r--r--
Bug 1286186 - Reps: Test that array indexes are sorted as numbers; r=honza


<!DOCTYPE HTML>
<html>
<!--
Test ArrayRep rep
-->
<head>
  <meta charset="utf-8">
  <title>Rep test - ArrayRep</title>
  <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
  <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
</head>
<body>
<pre id="test">
<script src="head.js" type="application/javascript;version=1.8"></script>
<script type="application/javascript;version=1.8">
"use strict";
/* import-globals-from head.js */

window.onload = Task.async(function* () {
  let { Rep } = browserRequire("devtools/client/shared/components/reps/rep");
  let { ArrayRep } = browserRequire("devtools/client/shared/components/reps/array");

  let componentUnderTest = ArrayRep;
  const maxLength = {
    short: 3,
    long: 300
  };

  try {
    yield testBasic();

    // Test property iterator
    yield testMaxProps();
    yield testMoreThanShortMaxProps();
    yield testMoreThanLongMaxProps();
    yield testRecursiveArray();

    // Test that properties are rendered as expected by ItemRep
    yield testNested();

    yield testArray();
  } catch (e) {
    ok(false, "Got an error: " + DevToolsUtils.safeErrorString(e));
  } finally {
    SimpleTest.finish();
  }

  function testBasic() {
    // Test that correct rep is chosen
    const stub = [];
    const renderedRep = shallowRenderComponent(Rep, { object: stub });
    is(renderedRep.type, ArrayRep.rep,
       `Rep correctly selects ${ArrayRep.rep.displayName}`);


    // Test rendering
    const defaultOutput = `[]`;

    const modeTests = [
      {
        mode: undefined,
        expectedOutput: defaultOutput,
      },
      {
        mode: "tiny",
        expectedOutput: `[]`,
      },
      {
        mode: "short",
        expectedOutput: defaultOutput,
      },
      {
        mode: "long",
        expectedOutput: defaultOutput,
      }
    ];

    testRepRenderModes(modeTests, "testBasic", componentUnderTest, stub);
  }

  function testMaxProps() {
    const stub = [1, "foo", {}];
    const defaultOutput = `[1, "foo", Object]`;

    const modeTests = [
      {
        mode: undefined,
        expectedOutput: defaultOutput,
      },
      {
        mode: "tiny",
        expectedOutput: `[3]`,
      },
      {
        mode: "short",
        expectedOutput: defaultOutput,
      },
      {
        mode: "long",
        expectedOutput: defaultOutput,
      }
    ];

    testRepRenderModes(modeTests, "testMaxProps", componentUnderTest, stub);
  }

  function testMoreThanShortMaxProps() {
    const stub = Array(maxLength.short + 1).fill("foo");
    const defaultShortOutput = `[${Array(maxLength.short).fill("\"foo\"").join(", ")}, more…]`;

    const modeTests = [
      {
        mode: undefined,
        expectedOutput: defaultShortOutput,
      },
      {
        mode: "tiny",
        expectedOutput: `[${maxLength.short + 1}]`,
      },
      {
        mode: "short",
        expectedOutput: defaultShortOutput,
      },
      {
        mode: "long",
        expectedOutput: `[${Array(maxLength.short + 1).fill("\"foo\"").join(", ")}]`,
      }
    ];

    testRepRenderModes(modeTests, "testMoreThanMaxProps", componentUnderTest, stub);
  }

  function testMoreThanLongMaxProps() {
    const stub = Array(maxLength.long + 1).fill("foo");
    const defaultShortOutput = `[${Array(maxLength.short).fill("\"foo\"").join(", ")}, more…]`;
    const defaultLongOutput = `[${Array(maxLength.long).fill("\"foo\"").join(", ")}, more…]`;

    const modeTests = [
      {
        mode: undefined,
        expectedOutput: defaultShortOutput,
      },
      {
        mode: "tiny",
        expectedOutput: `[${maxLength.long + 1}]`,
      },
      {
        mode: "short",
        expectedOutput: defaultShortOutput,
      },
      {
        mode: "long",
        expectedOutput: defaultLongOutput,
      }
    ];

    testRepRenderModes(modeTests, "testMoreThanMaxProps", componentUnderTest, stub);
  }

  function testRecursiveArray() {
    let stub = [1];
    stub.push(stub);
    const defaultOutput = `[1, […]]`;

    const modeTests = [
      {
        mode: undefined,
        expectedOutput: defaultOutput,
      },
      {
        mode: "tiny",
        expectedOutput: `[2]`,
      },
      {
        mode: "short",
        expectedOutput: defaultOutput,
      },
      {
        mode: "long",
        expectedOutput: defaultOutput,
      }
    ];

    testRepRenderModes(modeTests, "testRecursiveArray", componentUnderTest, stub);
  }

  function testNested() {
    let stub = [
      {
        p1: "s1",
        p2: ["a1", "a2", "a3"],
        p3: "s3",
        p4: "s4"
      }
    ];
    const defaultOutput = `[Object{p1: "s1", p3: "s3", p4: "s4", more…}]`;

    const modeTests = [
      {
        mode: undefined,
        expectedOutput: defaultOutput,
      },
      {
        mode: "tiny",
        expectedOutput: `[1]`,
      },
      {
        mode: "short",
        expectedOutput: defaultOutput,
      },
      {
        mode: "long",
        expectedOutput: defaultOutput,
      }
    ];

    testRepRenderModes(modeTests, "testNested", componentUnderTest, stub);
  }

  function testArray() {
    let stub = [
      "a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m",
      "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "x", "y", "z"
    ];

    const defaultOutput = `["a", "b", "c", "d", "e", "f", "g", "h", "i", "j",` +
                          ` "k", "l", "m", "n", "o", "p", "q", "r", "s", "t",` +
                          ` "u", "v", "w", "x", "y", "z"]`;
    const shortOutput = `["a", "b", "c", more…]`;

    const modeTests = [
      {
        mode: undefined,
        expectedOutput: shortOutput,
      },
      {
        mode: "tiny",
        expectedOutput: `[26]`,
      },
      {
        mode: "short",
        expectedOutput: shortOutput,
      },
      {
        mode: "long",
        expectedOutput: defaultOutput,
      }
    ];

    testRepRenderModes(modeTests, "testNested", componentUnderTest, stub);
  }
});
</script>
</pre>
</body>
</html>