Skip to content

Conversation

@kumilingus
Copy link
Contributor

@kumilingus kumilingus commented Oct 17, 2025

Description

This PR introduces a new syncCells method to the dia.Graph class that synchronizes graph cells with a provided array of cells (or cell JSONs). The method can add new cells, update existing ones, replace cells when their type changes, and optionally remove cells that are missing from the sync array.

Usage

You can either edit the JSON directly or generate it from another source of truth, then apply it to the graph model.
The method ensures that new cells are added, modified cells are updated, and missing cells are removed automatically.

const updatedJSON = await fetch('/diagram/1');
// Sync the current graph with the updated JSON
graph.syncCells(updatedJSON.cells, { remove: true });

You also now have a simple way to change an element’s type:

const [rectangle] = graph.getElements();
const circle = new Circle({ id: rectangle.id });
graph.syncCells([circle]);

Key changes

  • Implementation of syncCells method with support for adding, updating, and replacing cells
  • Modified dia.Paper to ensure connected links are updated when cells are replaced
  • Add tests for all synchronization scenarios

@kumilingus kumilingus requested a review from Copilot October 17, 2025 17:28
Copy link

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull Request Overview

This PR introduces a new syncCells method to the dia.Graph class that synchronizes graph cells with a provided array of cells. The method can add new cells, update existing ones, replace cells when their type changes, and optionally remove cells that are missing from the sync array.

Key changes:

  • Implementation of syncCells method with support for adding, updating, and replacing cells
  • New _replaceCell and _syncCell helper methods to support the synchronization logic
  • Modified Paper.mjs to ensure connected links are updated when cells are replaced
  • Comprehensive test coverage for all synchronization scenarios

Reviewed Changes

Copilot reviewed 4 out of 5 changed files in this pull request and generated 1 comment.

File Description
packages/joint-core/src/dia/Graph.mjs Implements the core syncCells, _syncCell, and _replaceCell methods
packages/joint-core/src/dia/Paper.mjs Updates connected link handling to support cell replacement operations
packages/joint-core/test/jointjs/graph.js Adds comprehensive test suite for syncCells functionality
packages/joint-core/test/jointjs/dia/Paper.js Adds test for view updates during cell replacement

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant