Merge pull request #220 from mermaid-js/refactor/introduce-anchor-goo…

…d-path Refactor/introduce anchor good path
mermaid-js · Nov 21, 2024 · 55f65af · 55f65af
2 parents 69bdf56 + 18b91e4
commit 55f65af
Show file tree

Hide file tree

Showing 24 changed files with 406 additions and 345 deletions.
diff --git a/src/assets/tailwind.css b/src/assets/tailwind.css
@@ -373,6 +373,7 @@
   .theme-nab {
     --color-bg-base: 242, 244, 246;
     --color-bg-canvas: 242, 244, 246;
+    --color-text-base: #ffffff;
 
     /* Participant */
     --color-bg-participant: 195, 0, 0;

diff --git a/src/components/DiagramFrame/SeqDiagram/LifeLineLayer/LifeLine.vue b/src/components/DiagramFrame/SeqDiagram/LifeLineLayer/LifeLine.vue
@@ -90,7 +90,7 @@ export default {
       const isVisible = firstMessage?.offsetParent != null;
       if (
         firstMessage &&
-        firstMessage.attributes["data-type"].value === "creation" &&
+        firstMessage.attributes["data-type"]?.value === "creation" &&
         isVisible
       ) {
         logger.debug(`First message to ${this.entity.name} is creation`);

diff --git a/src/components/DiagramFrame/SeqDiagram/LifeLineLayer/Participant.vue b/src/components/DiagramFrame/SeqDiagram/LifeLineLayer/Participant.vue
@@ -11,7 +11,7 @@
   >
     <div
       v-html="icon"
-      class="text-skin-base bg-skin-participant px-1 absolute rounded left-1/2 transform -translate-x-1/2 h-8 [&>svg]:w-full [&>svg]:h-full"
+      class="text-skin-base bg-skin-base px-1 absolute rounded left-1/2 transform -translate-x-1/2 h-8 [&>svg]:w-full [&>svg]:h-full"
       :aria-description="`icon for ${entity.name}`"
     ></div>
   </div>
@@ -30,7 +30,7 @@
       <div
         v-if="!!icon"
         v-html="icon"
-        class="text-skin-base bg-skin-participant px-1 absolute rounded left-1/2 transform -translate-x-1/2 -translate-y-full h-8 [&>svg]:w-full [&>svg]:h-full"
+        class="text-skin-base bg-skin-base px-1 absolute rounded left-1/2 transform -translate-x-1/2 -translate-y-full h-8 [&>svg]:w-full [&>svg]:h-full"
         :aria-description="`icon for ${entity.name}`"
       ></div>
       <!-- Put in a div to give it a fixed height, because stereotype is dynamic. -->

diff --git a/src/components/DiagramFrame/SeqDiagram/MessageLayer/Block/Block.vue b/src/components/DiagramFrame/SeqDiagram/MessageLayer/Block/Block.vue
@@ -11,7 +11,6 @@
         :inheritFromOccurrence="inheritFromOccurrence"
         :context="stat"
         :collapsed="collapsed"
-        :selfCallIndent="selfCallIndent"
         :number="getNumber(index)"
       />
     </div>
@@ -26,7 +25,6 @@ import { increaseNumber } from "@/utils/Numbering";
 const props = defineProps<{
   origin?: string;
   context?: any;
-  selfCallIndent?: number;
   number?: string;
   incremental?: boolean;
   collapsed?: boolean;

diff --git a/src/components/DiagramFrame/SeqDiagram/MessageLayer/Block/Statement/ArrowMixin.spec.ts b/src/components/DiagramFrame/SeqDiagram/MessageLayer/Block/Statement/ArrowMixin.spec.ts
@@ -3,6 +3,10 @@ import { createStore } from "vuex";
 import { VueSequence } from "@/index";
 // @ts-ignore
 import Interaction from "./Interaction/Interaction.vue";
+// @ts-ignore
+import Return from "./Return/Return.vue";
+// @ts-ignore
+import InteractionAsync from "./InteractionAsync/Interaction-async.vue";
 import { Fixture } from "../../../../../../../test/unit/parser/fixture/Fixture";
 import { configureCompat } from "vue";
 import { _STARTER_ } from "@/parser/OrderedParticipants";
@@ -27,63 +31,145 @@ function mountInteractionWithCode(
 
   return shallowMount(Interaction, { global: { plugins: [store] }, props });
 }
+
+function mountInteractionAsyncWithCode(
+  code: string,
+  contextLocator: (code: string) => any,
+  origin = "",
+) {
+  const storeConfig = VueSequence.Store();
+  // @ts-ignore
+  storeConfig.state.code = code;
+  const store = createStore(storeConfig);
+
+  const context = contextLocator(code);
+  const props = {
+    context,
+    origin,
+    fragmentOffset: 100,
+  };
+
+  return shallowMount(InteractionAsync, {
+    global: { plugins: [store] },
+    props,
+  });
+}
+
+function mountReturnWithCode(
+  code: string,
+  contextLocator: (code: string) => any,
+  origin = "",
+) {
+  const storeConfig = VueSequence.Store();
+  // @ts-ignore
+  storeConfig.state.code = code;
+  const store = createStore(storeConfig);
+
+  const context = contextLocator(code);
+  const props = {
+    context,
+    origin,
+    fragmentOffset: 100,
+  };
+
+  return shallowMount(Return, { global: { plugins: [store] }, props });
+}
+
 beforeEach(() => {
   configureCompat({
     RENDER_FUNCTION: false,
   });
 });
 describe("ArrowMixin", () => {
-  it("findContextForReceiver", async () => {
+  describe("targetOffset", () => {
+    it("sync message", async () => {
+      const creationWrapper = mountInteractionWithCode(
+        "A.method() { B.method() }",
+        Fixture.firstChild,
+        "A",
+      );
+
+      const vm = creationWrapper.vm as any;
+      expect(vm.target).toBe("B");
+      expect(vm.originOffset).toBe(0);
+      expect(vm.sourceOffset).toBe(0);
+      expect(vm.targetOffset).toBe(0);
+    });
+
+    it("async message", async () => {
+      const creationWrapper = mountInteractionAsyncWithCode(
+        "A.method() { B.method() { B->A: async } }",
+        Fixture.firstGrandChild,
+        "A",
+      );
+
+      const vm = creationWrapper.vm as any;
+      expect(vm.target).toBe("A");
+      expect(vm.originOffset).toBe(0);
+      expect(vm.sourceOffset).toBe(0);
+      expect(vm.targetOffset).toBe(0);
+    });
+
+    it("return message", async () => {
+      const creationWrapper = mountReturnWithCode(
+        "A.method() { B.method() { return r } }",
+        Fixture.firstGrandChild,
+        "B",
+      );
+
+      const vm = creationWrapper.vm as any;
+      expect(vm.context.getFormattedText()).toBe("return r");
+      expect(vm.context.ret().ReturnTo()).toBe("A");
+      expect(vm.target).toBe("A");
+      expect(vm.originOffset).toBe(0);
+      expect(vm.sourceOffset).toBe(0);
+      expect(vm.targetOffset).toBe(0);
+    });
+  });
+
+  it("isJointOccurrence", async () => {
     const creationWrapper = mountInteractionWithCode(
       "A.method() { B.method() }",
       Fixture.firstChild,
       _STARTER_,
     );
 
     const vm = creationWrapper.vm as any;
-    expect(vm.findContextForReceiver("C")).toBe(null);
-    expect(vm.findContextForReceiver("B").getFormattedText()).toBe(
-      "B.method()",
-    );
-    expect(vm.findContextForReceiver("A").getFormattedText()).toBe(
-      "A.method() { B.method() }",
-    );
+    expect(vm.isJointOccurrence("A")).toBe(true);
   });
 
-  // findContextForReceiver search for Ancestors only for self messages
-  // and does not include the current context
-  it("findContextForReceiver self message 1", async () => {
+  it("self message 1", async () => {
     const interaction = mountInteractionWithCode(
       "self()",
       Fixture.firstStatement,
       _STARTER_,
     );
 
     const vm = interaction.vm as any;
-    expect(vm.findContextForReceiver(_STARTER_).getFormattedText()).toBe(
-      "self()",
-    );
+    expect(vm.isJointOccurrence(_STARTER_)).toBeFalsy();
   });
 
-  it("findContextForReceiver sync message 1", async () => {
+  it("sync message 1", async () => {
     const interaction = mountInteractionWithCode(
       "A.m()",
       Fixture.firstStatement,
       _STARTER_,
     );
 
     const vm = interaction.vm as any;
-    expect(vm.findContextForReceiver("A").getFormattedText()).toBe("A.m()");
+    expect(vm.isJointOccurrence(_STARTER_)).toBeFalsy();
+    expect(vm.isJointOccurrence("A")).toBeTruthy();
   });
 
-  it("findContextForReceiver creation message 1", async () => {
+  it("creation message 1", async () => {
     const interaction = mountInteractionWithCode(
       "A.m() { new B }",
       Fixture.firstChild,
       _STARTER_,
     );
 
     const vm = interaction.vm as any;
-    expect(vm.findContextForReceiver("B").getFormattedText()).toBe("new B");
+    expect(vm.isJointOccurrence("A")).toBeTruthy();
+    expect(vm.isJointOccurrence("B")).toBeTruthy();
   });
 });