diff --git a/.changeset/add-nested-namespaces.md b/.changeset/add-nested-namespaces.md new file mode 100644 index 0000000000..39097c49bf --- /dev/null +++ b/.changeset/add-nested-namespaces.md @@ -0,0 +1,17 @@ +--- +'@mermaid': patch +--- + +Fixed an issue when the mermaid classdiagram crashes when adding a . to the namespace. +Forexample + +```mermaid + +classDiagram + namespace Company.Project.Module { + class GenericClass~T~ { + +addItem(item: T) + +getItem() T + } + } +``` diff --git a/cypress/integration/rendering/classDiagram-v2.spec.js b/cypress/integration/rendering/classDiagram-v2.spec.js index 258f8529f6..0c5dbc04b0 100644 --- a/cypress/integration/rendering/classDiagram-v2.spec.js +++ b/cypress/integration/rendering/classDiagram-v2.spec.js @@ -581,4 +581,63 @@ class C13["With Città foreign language"] { logLevel: 1, flowchart: { htmlLabels: false } } ); }); + + it('renders a class diagram with a generic class in a namespace', () => { + const diagramDefinition = ` + classDiagram-v2 + namespace Company.Project.Module { + class GenericClass~T~ { + +addItem(item: T) + +getItem() T + } + } + `; + + imgSnapshotTest(diagramDefinition); + }); + + it('renders a class diagram with nested namespaces and relationships', () => { + const diagramDefinition = ` + classDiagram-v2 + namespace Company.Project.Module.SubModule { + class Report { + +generatePDF(data: List) + +generateCSV(data: List) + } + } + namespace Company.Project.Module { + class Admin { + +generateReport() + } + } + Admin --> Report : generates + `; + + imgSnapshotTest(diagramDefinition); + }); + + it('renders a class diagram with multiple classes and relationships in a namespace', () => { + const diagramDefinition = ` + classDiagram-v2 + namespace Company.Project.Module { + class User { + +login(username: String, password: String) + +logout() + } + class Admin { + +addUser(user: User) + +removeUser(user: User) + +generateReport() + } + class Report { + +generatePDF(reportData: List) + +generateCSV(reportData: List) + } + } + Admin --> User : manages + Admin --> Report : generates + `; + + imgSnapshotTest(diagramDefinition); + }); }); diff --git a/demos/classchart.html b/demos/classchart.html index f04fa5b5f9..980ea5098d 100644 --- a/demos/classchart.html +++ b/demos/classchart.html @@ -159,30 +159,87 @@
classDiagram - A1 --> B1 - namespace A { - class A1 { - +foo : string + namespace Company.Project.Module { + class GenericClass~T~ { + +addItem(item: T) + +getItem() T + } + } ++
+ classDiagram + namespace Company.Project.Module.SubModule { + class Report { + +generatePDF(data: List) + +generateCSV(data: List) } - class A2 { - +bar : int + } + namespace Company.Project.Module { + class Admin { + +generateReport() } } - namespace B { - class B1 { - +foo : bool + Admin --> Report : generates ++
+ classDiagram + namespace Company.Project.Module { + class User { + +login(username: String, password: String) + +logout() + } + class Admin { + +addUser(user: User) + +removeUser(user: User) + +generateReport() } - class B2 { - +bar : float + class Report { + +generatePDF(reportData: List) + +generateCSV(reportData: List) } } - A2 --> B2 + Admin --> User : manages + Admin --> Report : generates
+ classDiagram + namespace Shapes { + class Shape { + +calculateArea() double + } + class Circle { + +double radius + } + class Square { + +double side + } + } + + Shape <|-- Circle + Shape <|-- Square + + namespace Vehicles { + class Vehicle { + +String brand + } + class Car { + +int horsepower + } + class Bike { + +boolean hasGears + } + } + + Vehicle <|-- Car + Vehicle <|-- Bike + Car --> Circle : "Logo Shape" + Bike --> Square : "Logo Shape" + +