Stencil: getAllTypeReferences breaks on imported files

[pixelbucket-dev]

Stencil version:

 @stencil/[email protected]

I'm submitting a:

[x ] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://stencil-worldwide.herokuapp.com/ or https://forum.ionicframework.com/

Current behavior:
I have types coming from an external library (protobuf compiled to TypScript defintionions with grpc-web-client). Those files can be read in VSCode. Once I compile with Stencil (npm start or npm run build) it breaks.

TypeError: Cannot read property 'toString' of undefined at

getAllTypeReferences() ->

referencedTypes.push(typeName.escapedText.toString());

escapedText is clearly undefined.

The object/type being parsed is as follows:

NodeObject {
  pos: 456,
  end: 496,
  flags: 0,
  modifierFlagsCache: 0,
  transformFlags: 536870912,
  parent: NodeObject {
    pos: 456,
    end: 496,
    flags: 0,
    modifierFlagsCache: 0,
    transformFlags: 536870913,
    parent: NodeObject {
      pos: 449,
      end: 497,
      flags: 0,
      modifierFlagsCache: 0,
      transformFlags: 536870913,
      parent: [NodeObject],
      kind: 165,
      typeName: [IdentifierObject],
      typeArguments: [Array],
      id: 290
    },
    kind: 165,
    typeName: [Circular],
    id: 291
  },
  kind: 149,
  left: NodeObject {
    pos: 456,
    end: 487,
    flags: 0,
    modifierFlagsCache: 0,
    transformFlags: 536870912,
    parent: [Circular],
    kind: 149,
    left: IdentifierObject {
      pos: 456,
      end: 473,
      flags: 0,
      modifierFlagsCache: 0,
      transformFlags: 536870912,
      parent: [Circular],
      escapedText: 'ListFilesResponse',
      flowNode: [Object]
    },
    right: IdentifierObject {
      pos: 474,
      end: 487,
      flags: 0,
      modifierFlagsCache: 0,
      transformFlags: 536870912,
      parent: [Circular],
      escapedText: 'DirectoryInfo',
      flowNode: [Object]
    }
  },
  right: IdentifierObject {
    pos: 488,
    end: 496,
    flags: 0,
    modifierFlagsCache: 0,
    transformFlags: 536870912,
    parent: [Circular],
    escapedText: 'AsObject',
    flowNode: { flags: 2 }
  }
}

So clearly escapedText is undefined at the dop level of the tupe object. I got no influence over how these types get generated and hope you could add a sanity check and get the name in another way.

[mmakrzem]

I'm using stencil v1.8.2 and I'm seeing the same error when I try to get stencil to compile my code. I'm using a third party library called plotly.js (https://github.com/plotly/plotly.js)

I have gone into @stencil\core\dist\compiler\index.js and modified the getAllTypeReferences function so that it catches when .escapedText === undefined:

const getAllTypeReferences = (node) => {
    const referencedTypes = [];
    const visit = (node) => {
        if (ts$1__default.isTypeReferenceNode(node)) {
            referencedTypes.push(getEntityName(node.typeName));
            if (node.typeArguments) {
                node.typeArguments
                    .filter(ta => ts$1__default.isTypeReferenceNode(ta))
                    .forEach((tr) => {
                    const typeName = tr.typeName;
                    if( typeName.escapedText !== undefined ) {
                        referencedTypes.push(typeName.escapedText.toString());
                    } else {
                        console.log( typeName );
                    }
                });
            }
        }
        return ts$1__default.forEachChild(node, visit);
    };
    visit(node);
    return referencedTypes;
};

The output I'm seeing is this:

NodeObject {
  pos: 6479,
  end: 6494,
  flags: 0,
  modifierFlagsCache: 0,
  transformFlags: 536870912,
  parent: NodeObject {
    pos: 6479,
    end: 6494,
    flags: 0,
    modifierFlagsCache: 0,
    transformFlags: 536870913,
    parent: NodeObject {
      pos: 6470,
      end: 6495,
      flags: 0,
      modifierFlagsCache: 0,
      transformFlags: 536870913,
      parent: [NodeObject],
      kind: 168,
      typeName: [IdentifierObject],
      typeArguments: [Array],
      id: 10664
    },
    kind: 168,
    typeName: [Circular],
    id: 10663
  },
  kind: 152,
  left: IdentifierObject {
    pos: 6479,
    end: 6487,
    flags: 0,
    modifierFlagsCache: 0,
    transformFlags: 536870912,
    parent: [Circular],
    kind: 75,
    escapedText: 'Plotly',
    flowNode: { flags: 1040, antecedent: [Object], node: [NodeObject] }
  },
  right: IdentifierObject {
    pos: 6488,
    end: 6494,
    flags: 0,
    modifierFlagsCache: 0,
    transformFlags: 536870912,
    parent: [Circular],
    kind: 75,
    escapedText: 'Layout',
    flowNode: { flags: 1040, antecedent: [Object], node: [NodeObject] }
  }
}

[mmakrzem]

Also noticed that test code fails too (for the same reason mentioned above). I had to also edit the getAllTypeReferences function found in @stencil/core/dist/testing/index.js

[halilibrahim]

v1.14.0
Issue still exists...

[halilibrahim]

Fixed with commit fdc271c47b8d0e540469077ff495b35c0633e7e0
Issue can be closed now.

[pixelbucket-dev]

Well, I have not had this issue for a long time now. I think something in either TS or rollup fixed it. Can be closed.

[pixelbucket-dev]

I appreciate the improvement though 😄 .

[mmakrzem]

I'm looking forward to this fix, I've been having to manually patch the stencil code every time I update since I still see this bug.