tldraw_0/__tests__/__snapshots__/project.test.ts.snap

// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`project loads file from json: data after mount from file 1`] = `
Object {
  "code": Object {
    "file0": Object {
      "code": "
const draw = new Draw({
  points: [
    ...Utils.getPointsBetween([0, 0], [20, 50]),
    ...Utils.getPointsBetween([20, 50], [100, 20], 3),
    ...Utils.getPointsBetween([100, 20], [100, 100], 10),
    [100, 100],
  ],
})

const rectangle = new Rectangle({
  point: [200, 0],
  style: {
    color: ColorStyle.Blue,
  },
})

const ellipse = new Ellipse({
  point: [400, 0],
})

const arrow = new Arrow({
  start: [600, 0],
  end: [700, 100],
})

const radius = 1000
const count = 100
const center = [350, 50]

for (let i = 0; i < count; i++) {
  const point = Vec.rotWith(
    Vec.add(center, [radius, 0]),
    center,
    (Math.PI * 2 * i) / count
  )

  const dot = new Dot({
    point,
  })
}
        ",
      "id": "file0",
      "name": "index.ts",
    },
  },
  "id": "TESTING",
  "name": "My Document",
  "pages": Object {
    "page1": Object {
      "childIndex": 0,
      "id": "page1",
      "name": "Page 1",
      "shapes": Object {
        "13448777-d8f5-46cd-8a70-a4259211902e": Object {
          "childIndex": 4,
          "id": "13448777-d8f5-46cd-8a70-a4259211902e",
          "name": "Rectangle",
          "parentId": "page1",
          "point": Array [
            500,
            400,
          ],
          "radius": 2,
          "rotation": 0,
          "size": Array [
            200,
            200,
          ],
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "rectangle",
        },
        "2d842ace-ebc5-4e83-acdf-de29352e5e62": Object {
          "bend": 0,
          "childIndex": 10,
          "decorations": Object {
            "end": "Arrow",
            "middle": null,
            "start": null,
          },
          "handles": Object {
            "bend": Object {
              "id": "bend",
              "index": 2,
              "point": Array [
                1.2250000000000227,
                92.60000000000002,
              ],
            },
            "end": Object {
              "id": "end",
              "index": 1,
              "point": Array [
                2.4500000000000455,
                185.20000000000005,
              ],
            },
            "start": Object {
              "id": "start",
              "index": 0,
              "point": Array [
                0,
                0,
              ],
            },
          },
          "id": "2d842ace-ebc5-4e83-acdf-de29352e5e62",
          "name": "Arrow",
          "parentId": "page1",
          "point": Array [
            616.9,
            1124.3,
          ],
          "rotation": 0,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "arrow",
        },
        "38e9e750-16c2-4476-93ab-21aeb5f8858f": Object {
          "childIndex": 12,
          "id": "38e9e750-16c2-4476-93ab-21aeb5f8858f",
          "name": "Text",
          "parentId": "page1",
          "point": Array [
            207.16,
            1422.4,
          ],
          "rotation": 0,
          "scale": 1,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "text": "Hello",
          "type": "text",
        },
        "3c688979-b190-4270-915b-7d8dd22a2bb7": Object {
          "childIndex": 14,
          "id": "3c688979-b190-4270-915b-7d8dd22a2bb7",
          "name": "Text",
          "parentId": "page1",
          "point": Array [
            564.06,
            1558.1,
          ],
          "rotation": 0,
          "scale": 1,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "text": "Hello",
          "type": "text",
        },
        "51641de1-9787-41b8-afcc-2c85fd1b24c7": Object {
          "childIndex": 7,
          "id": "51641de1-9787-41b8-afcc-2c85fd1b24c7",
          "name": "Ellipse",
          "parentId": "page1",
          "point": Array [
            517.18,
            783.54,
          ],
          "radiusX": 102.99999999999997,
          "radiusY": 102.99999999999994,
          "rotation": 0,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "ellipse",
        },
        "5ba998df-c036-447a-9b88-d96c71394f52": Object {
          "childIndex": 13,
          "id": "5ba998df-c036-447a-9b88-d96c71394f52",
          "name": "Text",
          "parentId": "page1",
          "point": Array [
            389.57,
            1496.5,
          ],
          "rotation": 0,
          "scale": 1,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "text": "Hello",
          "type": "text",
        },
        "75010635-8dfb-48ea-9250-719e50e58f02": Object {
          "childIndex": 5,
          "id": "75010635-8dfb-48ea-9250-719e50e58f02",
          "name": "Rectangle",
          "parentId": "page1",
          "point": Array [
            384.09,
            378.45,
          ],
          "radius": 2,
          "rotation": 0,
          "size": Array [
            95.20999999999992,
            91.1799999999999,
          ],
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "rectangle",
        },
        "b8e4e2c5-c662-4587-bf80-b9820ad8ad7f": Object {
          "bend": 0,
          "childIndex": 11,
          "decorations": Object {
            "end": "Arrow",
            "middle": null,
            "start": null,
          },
          "handles": Object {
            "bend": Object {
              "id": "bend",
              "index": 2,
              "point": Array [
                0.9250000000000114,
                47.85000000000002,
              ],
            },
            "end": Object {
              "id": "end",
              "index": 1,
              "point": Array [
                1.8500000000000227,
                95.70000000000005,
              ],
            },
            "start": Object {
              "id": "start",
              "index": 0,
              "point": Array [
                0,
                0,
              ],
            },
          },
          "id": "b8e4e2c5-c662-4587-bf80-b9820ad8ad7f",
          "name": "Arrow",
          "parentId": "page1",
          "point": Array [
            425.18,
            1143.2,
          ],
          "rotation": 0,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "arrow",
        },
        "c892d665-3311-4e25-a0bf-c4632d777f7e": Object {
          "childIndex": 6,
          "id": "c892d665-3311-4e25-a0bf-c4632d777f7e",
          "name": "Ellipse",
          "parentId": "page1",
          "point": Array [
            162.45,
            679.23,
          ],
          "radiusX": 102.99999999999997,
          "radiusY": 102.99999999999994,
          "rotation": 0,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "ellipse",
        },
        "e08c415e-3db3-4d3b-878e-28ce693ec1b0": Object {
          "childIndex": 8,
          "id": "e08c415e-3db3-4d3b-878e-28ce693ec1b0",
          "name": "Ellipse",
          "parentId": "page1",
          "point": Array [
            398.99,
            810.79,
          ],
          "radiusX": 45.484999999999985,
          "radiusY": 45.48499999999996,
          "rotation": 0,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "ellipse",
        },
        "e43559cb-6f41-4ae4-9c49-158ed1ad2f72": Object {
          "childIndex": 3,
          "id": "e43559cb-6f41-4ae4-9c49-158ed1ad2f72",
          "name": "Rectangle",
          "parentId": "page1",
          "point": Array [
            100,
            100,
          ],
          "radius": 2,
          "rotation": 0,
          "size": Array [
            100,
            100,
          ],
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "rectangle",
        },
        "fee77127-e779-4576-882b-b1bf7c7e132f": Object {
          "bend": 0,
          "childIndex": 9,
          "decorations": Object {
            "end": "Arrow",
            "middle": null,
            "start": null,
          },
          "handles": Object {
            "bend": Object {
              "id": "bend",
              "index": 2,
              "point": Array [
                0.045000000000001705,
                104,
              ],
            },
            "end": Object {
              "id": "end",
              "index": 1,
              "point": Array [
                0.09000000000000341,
                208,
              ],
            },
            "start": Object {
              "id": "start",
              "index": 0,
              "point": Array [
                0,
                0,
              ],
            },
          },
          "id": "fee77127-e779-4576-882b-b1bf7c7e132f",
          "name": "Arrow",
          "parentId": "page1",
          "point": Array [
            252.85,
            1057.5,
          ],
          "rotation": 0,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "arrow",
        },
      },
      "type": "page",
    },
  },
}
`;

exports[`restoring project remounts the state after mutating the current state: data after re-mount from file 1`] = `
Object {
  "code": Object {
    "file0": Object {
      "code": "
const draw = new Draw({
  points: [
    ...Utils.getPointsBetween([0, 0], [20, 50]),
    ...Utils.getPointsBetween([20, 50], [100, 20], 3),
    ...Utils.getPointsBetween([100, 20], [100, 100], 10),
    [100, 100],
  ],
})

const rectangle = new Rectangle({
  point: [200, 0],
  style: {
    color: ColorStyle.Blue,
  },
})

const ellipse = new Ellipse({
  point: [400, 0],
})

const arrow = new Arrow({
  start: [600, 0],
  end: [700, 100],
})

const radius = 1000
const count = 100
const center = [350, 50]

for (let i = 0; i < count; i++) {
  const point = Vec.rotWith(
    Vec.add(center, [radius, 0]),
    center,
    (Math.PI * 2 * i) / count
  )

  const dot = new Dot({
    point,
  })
}
        ",
      "id": "file0",
      "name": "index.ts",
    },
  },
  "id": "TESTING",
  "name": "My Document",
  "pages": Object {
    "page1": Object {
      "childIndex": 0,
      "id": "page1",
      "name": "Page 1",
      "shapes": Object {
        "13448777-d8f5-46cd-8a70-a4259211902e": Object {
          "childIndex": 4,
          "id": "13448777-d8f5-46cd-8a70-a4259211902e",
          "name": "Rectangle",
          "parentId": "page1",
          "point": Array [
            500,
            400,
          ],
          "radius": 2,
          "rotation": 0,
          "size": Array [
            200,
            200,
          ],
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "rectangle",
        },
        "2d842ace-ebc5-4e83-acdf-de29352e5e62": Object {
          "bend": 0,
          "childIndex": 10,
          "decorations": Object {
            "end": "Arrow",
            "middle": null,
            "start": null,
          },
          "handles": Object {
            "bend": Object {
              "id": "bend",
              "index": 2,
              "point": Array [
                1.2250000000000227,
                92.60000000000002,
              ],
            },
            "end": Object {
              "id": "end",
              "index": 1,
              "point": Array [
                2.4500000000000455,
                185.20000000000005,
              ],
            },
            "start": Object {
              "id": "start",
              "index": 0,
              "point": Array [
                0,
                0,
              ],
            },
          },
          "id": "2d842ace-ebc5-4e83-acdf-de29352e5e62",
          "name": "Arrow",
          "parentId": "page1",
          "point": Array [
            616.9,
            1124.3,
          ],
          "rotation": 0,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "arrow",
        },
        "38e9e750-16c2-4476-93ab-21aeb5f8858f": Object {
          "childIndex": 12,
          "id": "38e9e750-16c2-4476-93ab-21aeb5f8858f",
          "name": "Text",
          "parentId": "page1",
          "point": Array [
            207.16,
            1422.4,
          ],
          "rotation": 0,
          "scale": 1,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "text": "Hello",
          "type": "text",
        },
        "3c688979-b190-4270-915b-7d8dd22a2bb7": Object {
          "childIndex": 14,
          "id": "3c688979-b190-4270-915b-7d8dd22a2bb7",
          "name": "Text",
          "parentId": "page1",
          "point": Array [
            564.06,
            1558.1,
          ],
          "rotation": 0,
          "scale": 1,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "text": "Hello",
          "type": "text",
        },
        "51641de1-9787-41b8-afcc-2c85fd1b24c7": Object {
          "childIndex": 7,
          "id": "51641de1-9787-41b8-afcc-2c85fd1b24c7",
          "name": "Ellipse",
          "parentId": "page1",
          "point": Array [
            517.18,
            783.54,
          ],
          "radiusX": 102.99999999999997,
          "radiusY": 102.99999999999994,
          "rotation": 0,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "ellipse",
        },
        "5ba998df-c036-447a-9b88-d96c71394f52": Object {
          "childIndex": 13,
          "id": "5ba998df-c036-447a-9b88-d96c71394f52",
          "name": "Text",
          "parentId": "page1",
          "point": Array [
            389.57,
            1496.5,
          ],
          "rotation": 0,
          "scale": 1,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "text": "Hello",
          "type": "text",
        },
        "75010635-8dfb-48ea-9250-719e50e58f02": Object {
          "childIndex": 5,
          "id": "75010635-8dfb-48ea-9250-719e50e58f02",
          "name": "Rectangle",
          "parentId": "page1",
          "point": Array [
            384.09,
            378.45,
          ],
          "radius": 2,
          "rotation": 0,
          "size": Array [
            95.20999999999992,
            91.1799999999999,
          ],
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "rectangle",
        },
        "b8e4e2c5-c662-4587-bf80-b9820ad8ad7f": Object {
          "bend": 0,
          "childIndex": 11,
          "decorations": Object {
            "end": "Arrow",
            "middle": null,
            "start": null,
          },
          "handles": Object {
            "bend": Object {
              "id": "bend",
              "index": 2,
              "point": Array [
                0.9250000000000114,
                47.85000000000002,
              ],
            },
            "end": Object {
              "id": "end",
              "index": 1,
              "point": Array [
                1.8500000000000227,
                95.70000000000005,
              ],
            },
            "start": Object {
              "id": "start",
              "index": 0,
              "point": Array [
                0,
                0,
              ],
            },
          },
          "id": "b8e4e2c5-c662-4587-bf80-b9820ad8ad7f",
          "name": "Arrow",
          "parentId": "page1",
          "point": Array [
            425.18,
            1143.2,
          ],
          "rotation": 0,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "arrow",
        },
        "c892d665-3311-4e25-a0bf-c4632d777f7e": Object {
          "childIndex": 6,
          "id": "c892d665-3311-4e25-a0bf-c4632d777f7e",
          "name": "Ellipse",
          "parentId": "page1",
          "point": Array [
            162.45,
            679.23,
          ],
          "radiusX": 102.99999999999997,
          "radiusY": 102.99999999999994,
          "rotation": 0,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "ellipse",
        },
        "e08c415e-3db3-4d3b-878e-28ce693ec1b0": Object {
          "childIndex": 8,
          "id": "e08c415e-3db3-4d3b-878e-28ce693ec1b0",
          "name": "Ellipse",
          "parentId": "page1",
          "point": Array [
            398.99,
            810.79,
          ],
          "radiusX": 45.484999999999985,
          "radiusY": 45.48499999999996,
          "rotation": 0,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "ellipse",
        },
        "e43559cb-6f41-4ae4-9c49-158ed1ad2f72": Object {
          "childIndex": 3,
          "id": "e43559cb-6f41-4ae4-9c49-158ed1ad2f72",
          "name": "Rectangle",
          "parentId": "page1",
          "point": Array [
            100,
            100,
          ],
          "radius": 2,
          "rotation": 0,
          "size": Array [
            100,
            100,
          ],
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "rectangle",
        },
        "fee77127-e779-4576-882b-b1bf7c7e132f": Object {
          "bend": 0,
          "childIndex": 9,
          "decorations": Object {
            "end": "Arrow",
            "middle": null,
            "start": null,
          },
          "handles": Object {
            "bend": Object {
              "id": "bend",
              "index": 2,
              "point": Array [
                0.045000000000001705,
                104,
              ],
            },
            "end": Object {
              "id": "end",
              "index": 1,
              "point": Array [
                0.09000000000000341,
                208,
              ],
            },
            "start": Object {
              "id": "start",
              "index": 0,
              "point": Array [
                0,
                0,
              ],
            },
          },
          "id": "fee77127-e779-4576-882b-b1bf7c7e132f",
          "name": "Arrow",
          "parentId": "page1",
          "point": Array [
            252.85,
            1057.5,
          ],
          "rotation": 0,
          "style": Object {
            "color": "Black",
            "dash": "Draw",
            "isFilled": false,
            "size": "Medium",
          },
          "type": "arrow",
        },
      },
      "type": "page",
    },
  },
}
`;