fix: handles cases where the NetworkDevice.getForwardingData return undefined (#259)

Co-authored-by: Pedro Gallino <[email protected]>

Author: Manuel-Pol

src/graphics/renderables/program_info.ts

@@ -15,18 +15,12 @@ export class ProgramInfo implements Renderable {
     this.name = name;
   }
 
-  withDestinationDropdown(
-    viewgraph: ViewGraph,
-    srcId: DeviceId,
-    layer?: Layer,
-  ) {
+  withDestinationDropdown(viewgraph: ViewGraph, srcId: DeviceId, layer: Layer) {
     let devices = otherDevices(viewgraph, srcId);
-    if (layer) {
-      devices = devices.filter((device) => {
-        const deviceLayer = viewgraph.getDevice(device.id)?.getLayer();
-        return layerIncluded(deviceLayer, layer);
-      });
-    }
+    devices = devices.filter((device) => {
+      const deviceLayer = viewgraph.getDevice(device.id)?.getLayer();
+      return layerIncluded(deviceLayer, layer);
+    });
     this.withDropdown(TOOLTIP_KEYS.DESTINATION, devices);
   }
 

src/programs/echo_sender.ts

@@ -5,10 +5,11 @@ import { ProgramBase } from "./program_base";
 import { ViewGraph } from "../types/graphs/viewgraph";
 import { ProgramInfo } from "../graphics/renderables/device_info";
 import { EchoRequest } from "../packets/icmp";
-import { IPv4Packet } from "../packets/ip";
+import { IpAddress, IPv4Packet } from "../packets/ip";
 import { ViewNetworkDevice } from "../types/view-devices/vNetworkDevice";
-import { EthernetFrame } from "../packets/ethernet";
+import { EthernetFrame, MacAddress } from "../packets/ethernet";
 import { TOOLTIP_KEYS } from "../utils/constants/tooltips_constants";
+import { Layer } from "../types/layer";
 
 export class SingleEcho extends ProgramBase {
   static readonly PROGRAM_NAME = TOOLTIP_KEYS.SEND_ICMP_ECHO;
@@ -50,19 +51,39 @@ export class SingleEcho extends ProgramBase {
       );
       return;
     }
-    const { src, dst, sendingIface } = ViewNetworkDevice.getForwardingData(
+
+    const forwardingData = ViewNetworkDevice.getForwardingData(
       this.srcId,
       this.dstId,
       this.viewgraph,
     );
+    let src: { ip: IpAddress; mac: MacAddress },
+      dst: { ip: IpAddress; mac: MacAddress },
+      sendingIface: number;
+    if (!forwardingData) {
+      console.warn(
+        `Device ${this.srcId} could not send ping to device ${this.dstId}`,
+      );
+      src = {
+        mac: srcDevice.interfaces[0].mac,
+        ip: srcDevice.interfaces[0].ip,
+      };
+      dst = {
+        mac: dstDevice.interfaces[0].mac,
+        ip: dstDevice.interfaces[0].ip,
+      };
+      sendingIface = 0;
+    } else {
+      ({ src, dst, sendingIface } = forwardingData);
+    }
     const echoRequest = new EchoRequest(0);
     // Wrap in IP datagram
     const ipPacket = new IPv4Packet(src.ip, dst.ip, echoRequest);
 
     // Resolve destination MAC address
     const dstMac = srcDevice.resolveAddress(dst.ip);
     if (!dstMac) {
-      console.warn(
+      console.debug(
         `Device ${this.srcId} couldn't resolve MAC address for device with IP ${dst.ip.toString()}. Program cancelled`,
       );
       return;
@@ -75,7 +96,7 @@ export class SingleEcho extends ProgramBase {
 
   static getProgramInfo(viewgraph: ViewGraph, srcId: DeviceId): ProgramInfo {
     const programInfo = new ProgramInfo(this.PROGRAM_NAME);
-    programInfo.withDestinationDropdown(viewgraph, srcId);
+    programInfo.withDestinationDropdown(viewgraph, srcId, Layer.Network);
     return programInfo;
   }
 }
@@ -135,7 +156,7 @@ export class EchoServer extends ProgramBase {
     ];
 
     const programInfo = new ProgramInfo(this.PROGRAM_NAME);
-    programInfo.withDestinationDropdown(viewgraph, srcId);
+    programInfo.withDestinationDropdown(viewgraph, srcId, Layer.Network);
     programInfo.withDropdown("Time between pings", delayOptions);
     return programInfo;
   }

src/types/edge.ts

@@ -288,15 +288,35 @@ export class Edge extends Graphics {
     this.on("mouseover", () => {
       const group = this.viewgraph.findConnectedEdges(this);
       group.forEach((edge) => {
-        edge.setupConnectedDevicesTooltips();
+        edge.handleConnectedDevicesTooltips(
+          (device: ViewDevice, iface: number) => {
+            if (!device) {
+              console.error(
+                `Device ${device.id} not found in viewgraph, cannot set device tooltip`,
+              );
+              return;
+            }
+            if (device.isVisible()) {
+              device.setupToolTip(iface);
+            }
+          },
+        );
         edge.showTooltips();
         edge.fixTooltipPositions();
       });
     });
     this.on("mouseout", () => {
       const group = this.viewgraph.findConnectedEdges(this);
       group.forEach((edge) => {
-        edge.hideConnectedDevicesTooltips();
+        edge.handleConnectedDevicesTooltips((device: ViewDevice) => {
+          if (!device) {
+            console.error(
+              `Device ${device.id} not found in viewgraph, cannot set device tooltip`,
+            );
+            return;
+          }
+          device.hideToolTip();
+        });
         edge.hideTooltips();
       });
     });
@@ -326,46 +346,28 @@ export class Edge extends Graphics {
     );
   }
 
-  private setupConnectedDevicesTooltips() {
+  handleConnectedDevicesTooltips(
+    handleTooltip: (device: ViewDevice, iface?: number) => void,
+  ) {
     const [startId, startIface] = [this.data.from.id, this.data.from.iface];
     const [endId, endIface] = [this.data.to.id, this.data.to.iface];
     const startDevice = this.viewgraph.getDevice(startId);
     const endDevice = this.viewgraph.getDevice(endId);
 
-    const setTooltip = (device: ViewDevice, iface: number) => {
+    const deviceFound = (device: ViewDevice, id: DeviceId) => {
       if (!device) {
         console.error(
-          `Device ${device.id} not found in viewgraph, cannot set device tooltip`,
+          `Device ${id} not found in viewgraph, cannot set device tooltip`,
         );
-        return;
-      }
-      if (device.isVisible()) {
-        device.setupTooltip(iface);
+        return false;
       }
+      return true;
     };
 
-    setTooltip(startDevice, startIface);
-    setTooltip(endDevice, endIface);
-  }
+    if (deviceFound(startDevice, startId))
+      handleTooltip(startDevice, startIface);
 
-  private hideConnectedDevicesTooltips() {
-    const startId = this.data.from.id;
-    const endId = this.data.to.id;
-    const startDevice = this.viewgraph.getDevice(startId);
-    const endDevice = this.viewgraph.getDevice(endId);
-
-    const hideTooltip = (device: ViewDevice) => {
-      if (!device) {
-        console.error(
-          `Device ${device.id} not found in viewgraph, cannot set device tooltip`,
-        );
-        return;
-      }
-      device.hideToolTip();
-    };
-
-    hideTooltip(startDevice);
-    hideTooltip(endDevice);
+    if (deviceFound(endDevice, endId)) handleTooltip(endDevice, endIface);
   }
 
   private fixTooltipPositions() {
@@ -411,6 +413,9 @@ export class Edge extends Graphics {
   }
 
   private removeTooltips() {
+    this.handleConnectedDevicesTooltips((device: ViewDevice) =>
+      device.hideToolTip(),
+    );
     this.startTooltip = removeTooltip(this, this.startTooltip);
     this.endTooltip = removeTooltip(this, this.endTooltip);
   }

src/types/graphs/datagraph.ts

@@ -532,8 +532,7 @@ export class DataGraph {
     parents.forEach((currentId, childId) => {
       const dstId = childId;
       if (dstId === id) return;
-      // Get edge connection both devices
-      console.debug(`currentId: ${currentId}, childId: ${childId}`);
+      // Get edge connecting both devices
       const edge = this.getConnection(currentId, childId);
       // Get childId interface involved in connection
       const receivingIfaceNum =

src/types/graphs/viewgraph.ts

@@ -366,10 +366,10 @@ export class ViewGraph {
       console.warn(`Edge ${n1Id},${n2Id} is not in the datagraph`);
       return null;
     }
+    this._removeEdge(n1Id, n2Id);
+
     // Remove connection in DataGraph
     this.datagraph.removeConnection(n1Id, n2Id);
-
-    this._removeEdge(n1Id, n2Id);
     return datagraphEdge;
   }
 

src/types/network-modules/tcp/tcpState.ts

@@ -53,6 +53,10 @@ function sendIpPacket(
     dst.id,
     viewgraph,
   );
+  if (!forwardingData) {
+    console.warn(`Device ${dst.id} is not reachable from device ${src.id}`);
+    return false;
+  }
   const [srcData, dstData, sendingIface] = [
     forwardingData.src,
     forwardingData.dst,

src/types/view-devices/vDevice.ts

@@ -150,7 +150,7 @@ export abstract class ViewDevice extends Container {
     // Do nothing
   }
 
-  setupTooltip(iface: number) {
+  setupToolTip(iface: number) {
     const currentLayer = this.ctx.getCurrentLayer();
     const tooltipMessage = this.getTooltipDetails(currentLayer, iface);
     this.tooltip = showTooltip(
@@ -166,6 +166,10 @@ export abstract class ViewDevice extends Container {
     hideTooltip(this.tooltip);
   }
 
+  removeToolTip() {
+    removeTooltip(this, this.tooltip);
+  }
+
   setCircleColor(color: number) {
     if (!this.isDragCircle) return;
     if (this.circleGraphic) {

src/types/view-devices/vNetworkDevice.ts

@@ -11,7 +11,11 @@ import { ViewGraph } from "../graphs/viewgraph";
 import { Position } from "../common";
 import { EthernetFrame, MacAddress } from "../../packets/ethernet";
 import { sendViewPacket, dropPacket } from "../packet";
-import { EchoReply, EchoRequest } from "../../packets/icmp";
+import {
+  EchoReply,
+  EchoRequest,
+  ICMP_REQUEST_TYPE_NUMBER,
+} from "../../packets/icmp";
 import { GlobalContext } from "../../context";
 import {
   ARP_REPLY_CODE,
@@ -82,11 +86,7 @@ export abstract class ViewNetworkDevice extends ViewDevice {
     // Get dstMac
     let dstMac: MacAddress = dstIface.mac;
     for (const idx of path.slice(1).keys()) {
-      console.debug(`Iterando en indice: ${idx}`);
       const [sendingId, receivingId] = [path[idx], path[idx + 1]];
-      console.debug(
-        `Se obtienen los devices con ids ${sendingId} y ${receivingId}`,
-      );
       const receivingDevice = viewgraph.getDevice(receivingId);
       if (receivingDevice instanceof ViewNetworkDevice) {
         const edge = viewgraph.getEdge(sendingId, receivingId);
@@ -169,12 +169,15 @@ export abstract class ViewNetworkDevice extends ViewDevice {
     console.debug("Packet has reach its destination!");
     const dstDevice = this.viewgraph.getDeviceByIP(datagram.sourceAddress);
     if (!(dstDevice instanceof ViewNetworkDevice)) {
+      console.warn(
+        `Device with IP ${datagram.sourceAddress.toString} was not found or was not a Network Device`,
+      );
       return;
     }
     switch (datagram.payload.protocol()) {
       case ICMP_PROTOCOL_NUMBER: {
         const request: EchoRequest = datagram.payload as EchoRequest;
-        if (dstDevice && request.type) {
+        if (dstDevice && request.type === ICMP_REQUEST_TYPE_NUMBER) {
           const { src, dst } = ViewNetworkDevice.getForwardingData(
             this.id,
             dstDevice.id,

src/types/view-devices/vRouter.ts

@@ -200,14 +200,17 @@ export class ViewRouter extends ViewNetworkDevice {
 
     const dstDevice = this.viewgraph.getDeviceByIP(datagram.destinationAddress);
     // TODO: use arp table here?
-    const { src, dst } = ViewNetworkDevice.getForwardingData(
+    const forwardingData = ViewNetworkDevice.getForwardingData(
       this.id,
-      dstDevice.id,
+      dstDevice?.id,
       this.viewgraph,
     );
+    if (forwardingData && forwardingData.sendingIface === iface) {
+      const { src, dst } = forwardingData;
 
-    const newFrame = new EthernetFrame(src.mac, dst.mac, datagram);
-    sendViewPacket(this.viewgraph, this.id, newFrame, iface);
+      const newFrame = new EthernetFrame(src.mac, dst.mac, datagram);
+      sendViewPacket(this.viewgraph, this.id, newFrame, iface);
+    } else console.debug(`Router ${this.id} could not forward packet.`);
 
     if (this.packetQueue.isEmpty()) {
       this.stopPacketProcessor();