kieler/klayjs

Help with debugging; exception after adding a node

idea-launch-lab opened this issue · 7 comments

Hello, I am getting an exception in klayjs.js and am unable to debug due to the cryptic code. I am building a graph visualization dynamically and the exception (below) occurs when I add a node to an existing graph.
I'd like to be able to see values of variables/params being passed, but unable to do so due to the cryptic/compressed JavaScript code.

I am using klay.js version 0.4.1 build 201604131004

The error reported by klayjs:

Error: {"type":"com.google.gwt.core.client.JavaScriptException","text":"(TypeError) : Cannot read property 'f' of null","stacktrace":"Unknown.x9(http://localhost:63342/web_apps/js/klayjs/klay.js)\nUnknown.A9(http://localhost:63342/web_apps/js/klayjs/klay.js)\nUnknown._Q(http://localhost:63342/web_apps/js/klayjs/klay.js)\nUnknown.aR(http://localhost:63342/web_apps/js/klayjs/klay.js)\nUnknown.aR(http://localhost:63342/web_apps/js/klayjs/klay.js)\nUnknown.YQ(http://localhost:63342/las/web_apps/js/klayjs/klay.js)\nUnknown.AQ(http://localhost:63342/web_apps/js/klayjs/klay.js)\nUnknown.IP(http://localhost:63342/web_apps/js/klayjs/klay.js)\nUnknown.layout(http://localhost:63342/web_apps/js/klayjs/klay.js)\nUnknown.d3klay.kgraph(http://localhost:63342/web_apps/js/klayjs-d3/klayjs-d3.js)"}
    function x9 (a, b)
    {
        var c, d, e, f, g, h, i, j, k, l, m;
        switch (a.g.e)
        {
            case 1:
                d = Wv (rJ (a, (Rib (), uib)), 12);
                c = Wv (rJ (d, vib), 44);
                !c ? (c = new jJ) : Ckb (Ixb (Xv (rJ (d, Iib)))) && (c = lJ (c));
                j = Wv (rJ (a, qib), 7);
                k = MI (Bv (tv (qz, 1), Fzb, 10, 0, [j.f.i, j.i, j.a]));
                if (b <= k.a)
                {
                    return k.b
                }
                TI (c, k, c.a, c.a.a);
          *      l = Wv (rJ (a, rib), 7); // var 'l' is being returned as null
                m = MI (Bv (tv (qz, 1), Fzb, 10, 0, [l.f.i, l.i, l.a]));
                if (m.a <= b)
                {
                    return m.b
                }
                TI (c, m, c.c.b, c.c);
...

Btw, is there un-compressed code Klayjs.js code available?
Thanks!

I added what GWT calls a pretty version of the file. It should match the version you are using.

The code is still generated but maybe you/I can make sense of the stacktrace that way.

Great, thank you @uruuru I'll take a look at the pretty version

EDIT: The issue seems to be with link and probably has nothing to do with the action of adding a new node.
I integrated the pretty version of the code and here is a little more information on the exception:
I am getting the exception specifically when I have a long link (shown in orange in the image). If I remove that link and add a new node then there is no exception. The position in klay.pretty.js where the exception occurs is shown in code block below. Thanks.

screen shot 2017-07-31 at 4 20 06 pm

function $getPos(node, horizPos){
  var bendpoints, edge, originNode, originPort, point1, point2, pointIter, source, sourcePoint, target, targetPoint;
  switch (node.type_0.ordinal) {
    case 1:
      edge = castTo($getProperty(node, ($clinit_InternalProperties() , ORIGIN)), 12);
      bendpoints = castTo($getProperty(edge, ORIGINAL_BENDPOINTS), 44);
      !bendpoints?(bendpoints = new KVectorChain):unsafeCast(checkNotNull_1(castToBoolean($getProperty(edge, REVERSED)))) && (bendpoints = reverse_1(bendpoints));
      source = castTo($getProperty(node, LONG_EDGE_SOURCE), 7);
      sourcePoint = sum_0(stampJavaTypeInfo(getClassLiteralForArray(Lde_cau_cs_kieler_core_math_KVector_2_classLit, 1), $intern_48, 10, 0, [source.owner.pos, source.pos, source.anchor]));
      if (horizPos <= sourcePoint.x_0) {
        return sourcePoint.y_0;
      }

      $addNode_0(bendpoints, sourcePoint, bendpoints.header, bendpoints.header.next_0);
      * target = castTo($getProperty(node, LONG_EDGE_TARGET), 7); // target is NULL
      targetPoint = sum_0(stampJavaTypeInfo(getClassLiteralForArray(Lde_cau_cs_kieler_core_math_KVector_2_classLit, 1), $intern_48, 10, 0, [target.owner.pos, target.pos, target.anchor]));

The variable defaultValue gets a value of null in this code block

function $getProperty(this$static, property){
  var defaultValue, value_0;
  if (this$static.propertyMap) {
    value_0 = $get_9(this$static.propertyMap, property);
    if (value_0 != null) {
      return value_0;
    }
  }
  * defaultValue = $getDefault(property);
  instanceOf(defaultValue, 5) && $setProperty(this$static, property, defaultValue);
  return defaultValue;
}

Stack trace details

Error: {"type":"com.google.gwt.core.client.JavaScriptException","text":"(TypeError) : Cannot read property 'owner' of null","stacktrace":"Unknown.$getPos(http://localhost:63342/web_apps/js/klayjs/klay.pretty.js)\nUnknown.process_51(http://localhost:63342/web_apps/js/klayjs/klay.pretty.js)\nUnknown.$layout_0(http://localhost:63342/web_apps/js/klayjs/klay.pretty.js)\nUnknown.$recursiveLayout(http://localhost:63342/web_apps/js/klayjs/klay.pretty.js)\nUnknown.$recursiveLayout(http://localhost:63342/web_apps/js/klayjs/klay.pretty.js)\nUnknown.$doCompoundLayout(http://localhost:63342/web_apps/js/klayjs/klay.pretty.js)\nUnknown.$layout(http://localhost:63342/web_apps/js/klayjs/klay.pretty.js)\nUnknown.layout(http://localhost:63342/web_apps/js/klayjs/klay.pretty.js)\nUnknown.layout(http://localhost:63342/web_apps/js/klayjs/klay.pretty.js)\nUnknown.d3klay.kgraph(http://localhost:63342/web_apps/js/klayjs-d3/klayjs-d3.js)"}

Algorithm options used while drawing graph:

order : {
            algorithm : "de.cau.cs.kieler.klay.layered",
            spacing : workflowVis.visOptions.component_spacing,
            layoutHierarchy : true,
            intCoordinates : true,
            direction : "RIGHT",
            edgeRouting : "ORTHOGONAL",
            crossMin : "INTERACTIVE",
        }

Can you try to unset crossMin, or set it to LAYER_SWEEP?

@le-cds do you know if there was a time, when long edges weren't supported during interactive crossing minimization? The klayjs version is from 2016.

Okay, setting crossMin to LAYER_SWEEP removed the error I was getting. Thanks a lot for the help!

It's probably the option you want to use anyway. @le-cds we should check whether the error is expected nevertheless.