使用 GoJS 机器人使用 Cypress 测试 GoJS 图

Question

我正在尝试使用 GoJS 机器人与 Cypress 测试环境中的 GoJS 图进行交互。我设法获得了图表实例，但我似乎无法让机器人在图表上执行任何功能。有人有什么想法吗？

Answer 1

// An example Cypress test script for testing the unmodified Minimal sample,
// which is available at https://gojs.net/latest/samples/minimal.html.
// Copyright 1998-2021 by Northwoods Software Corporation

describe("minimal", () => {
  let myDiagram = null
  let myRobot = null

  beforeEach(() => {
    // more likely you would be running the sample locally,
    // say at http://localhost:5500/samples/minimal.html
    cy.visit("https://gojs.net/latest/samples/minimal.html")

    // make sure the HTMLDivElement exists holding the Diagram
    cy.get("#myDiagramDiv")

    // load extensions/Robot.js dynamically
    cy.window().then(win => {
      const scr = win.document.createElement("script");
      scr.src = "https://unpkg.com/gojs/extensions/Robot.js";
      win.document.body.appendChild(scr);
    })

    // make sure it's loaded
    cy.window().should("have.property", "Robot")

    // save these references for each test, which simplifies each test code
    cy.window().then(win => {
      myDiagram = win.go.Diagram.fromDiv(win.document.getElementById("myDiagramDiv"));
      myRobot = new win.Robot(myDiagram);
    })

    // wait for the Diagram to finish initializing; is there a better way?
    cy.wait(1)
  })

  // A minimal test to make sure the Diagram got set up OK.
  it("has nodes and links", () => {
    cy.window().then(win => {
      expect(myDiagram.nodes.count).to.equal(4)
      expect(myDiagram.links.count).to.equal(5)
      const delta = myDiagram.findNodeForKey("Delta");
      expect(delta).to.not.equal(null)
      expect(delta.elt(0).fill).to.equal("pink")
    })
  })

  // A test that uses Robot to simulate input by producing InputEvents.
  it("copies a node with Robot", () => {
    cy.window().then(win => {
      // Find the center of the Delta node in document coordinates.
      const delta = myDiagram.findNodeForKey("Delta");
      const loc = delta.actualBounds.center;

      // Simulate a mouse drag to move the Delta node:
      const options = { control: true, alt: true };
      myRobot.mouseDown(loc.x, loc.y, 0, options);
      myRobot.mouseMove(loc.x + 80, loc.y + 50, 50, options);
      myRobot.mouseMove(loc.x + 20, loc.y + 100, 100, options);
      myRobot.mouseUp(loc.x + 20, loc.y + 100, 150, options);
      // If successful, this will have made a copy of the "Delta" node below it.

      // Check that the new node is at the drop point,
      // and that it is a copy, different from the original node.
      const newloc = new win.go.Point(loc.x + 20, loc.y + 100);
      const newnode = myDiagram.findPartAt(newloc);
      expect(newnode).to.not.equal(delta)
      expect(newnode.key).to.equal("Delta2")
      expect(newnode.isSelected).to.equal(true)
    })
  })

})

使用 GoJS 机器人使用 Cypress 测试 GoJS 图

Testing GoJS Diagram with Cypress using GoJS Robot

gojs