Link selection in the diagram

When we set the myDiagram.isReadOnly property true then it will not select the edge.Below is the JIF image

I don’t see that behavior. The State Chart sample also uses link labels, but when I set Diagram.isReadOnly, I can still select links.

What is your link template?

My link template is mentioned below :-

myDiagram.linkTemplate =
$(go.Link,
{
corner: 5,
curve: go.Link.JumpOver,
routing: go.Link.AvoidsNodes,
fromPortId: “out”, toPortId: “in”,
adjusting: go.Link.Stretch,
relinkableFrom: true,
relinkableTo: true,
reshapable: true,
resegmentable: true,
fromLinkable: true,
fromLinkableSelfNode: true,
fromLinkableDuplicates: true,
toLinkable: true,
toLinkableSelfNode: true,
toLinkableDuplicates: true,
layoutConditions: go.Part.LayoutAdded | go.Part.LayoutRemoved,
selectionAdorned: false,
mouseEnter: function (e, link) {

                },
                mouseLeave: function (e, link) {
                   
                },
                mouseDrop: CheckLockBeforeDragDropOnLink,
                toShortLength: 2,

            },
            new go.Binding("points").makeTwoWay(),
            new go.Binding("routing", "routing"),
            new go.Binding("curviness"),
            $(go.Shape, { stroke: "gray", strokeWidth: 1.5, name: "HIGHLIGHT" }),

            
            $(go.Shape, { fromArrow: "Circle", fill: "gray", strokeWidth: 2, stroke: "gray" }),
            $(go.Shape, { toArrow: 'Triangle', fill: "gray", strokeWidth: 2, stroke: "gray" }),

                $(go.Panel, "Auto",
             { _isLinkLabel: true, cursor: "move" },  // marks this Panel as being a draggable label

           $(go.Shape, { fill: "white", stroke: "orange", strokeWidth: 2 },
                 new go.Binding("stroke", "stroke").makeTwoWay()
            ),
          $(go.Shape, "StopSign",
          {
              alignment: go.Spot.TopLeft, margin: 3,
              width: 8, height: 8, fill: "red", visible: visible, stroke: null
          },
         new go.Binding("visible", "visible").makeTwoWay()),
         new go.Binding('visible', 'text', function (t) { return t.trim() !== '' }),

         
        $(go.TextBlock, "Label", {
            margin: 3, editable: true,
            isMultiline: true,  // don't allow embedded newlines
            textValidation: validateText,
            segmentIndex: 0, segmentFraction: 0.5,
            textEdited: function (textBlock, previousText, currentText) {
              
            }
        },
            new go.Binding('visible', 'text', function (t) {
                return t.trim() !== ''
            }),
                new go.Binding("text", "text", function (e) {
                        return  e;
                }).makeTwoWay(),
         {
             toolTip:
                    $("ToolTip",
                      new go.Binding("visible", "text", function (t) {
                         
                          return !!t;
                      }).ofObject("TB"),
                      $(go.TextBlock,
                        { name: "TB", margin: 4, font: "bold 12px Verdana,serif", stroke: "black" },
                        new go.Binding("text", "", diagramNodeInfo))
                    )
         }
               ),
                { contextMenu: $(go.Adornment) },
             new go.Binding("segmentIndex").makeTwoWay(),
             new go.Binding("segmentFraction").makeTwoWay()
           )
         );

You have set selectionAdorned: false.