Skip to content

Typescript: Bug during parsing components inside components #79

@izelnakri

Description

@izelnakri
// on a typescript component:
import Component, { hbs, tracked } from '@glimmerx/component';
import Another from './Another';

export default class App extends Component {
  @tracked dynamicObject;

  constructor() {
    // console.log(Another);
    window.setInterval(() => {
      this.dynamicObject = {
        dynamicDate: new Date().toString(),
      };
    }, 200);
  }

  static template = hbs`
    <div id="intro">
      <h3>Cool</h3>
      <Another @text="hello" @dynamicObject={{this.dynamicObject}}/>
    </div>
  `;
}

The component above only works if I uncomment the console log above, the resolver cannot find/parse components imports correctly by just ts import Component from ./component or using it inside the hbs template, it needs the code to be referenced inside the Component js, even a useless console.log(Component) make that component render correctly.

Currently in the code above, without the console.log, render fails/app breaks with not a very helpful error:

setComponentManager.js:18 Uncaught (in promise) TypeError: Cannot convert undefined or null to object
    at Function.getPrototypeOf (<anonymous>)
    at getComponentManager (setComponentManager.js:18)
    at createComponentDefinition (definitions.js:33)
    at definitionForComponent (definitions.js:15)
    at CompileTimeResolver.lookupComponent (CompileTimeResolver.js:43)
    at DefaultCompileTimeResolverDelegate.lookupComponent (delegate.js:68)
    at resolveLayoutForTag (resolver.js:11)
    at ifResolvedComponent (push-compile.js:150)
    at compileOp (push-compile.js:64)
    at pushCompileOp (push-compile.js:26)

When I turn the files into JS from TS everything works correctly, as expected.

  • Component parsing needs to be fixed in TS.
  • We should improve error messages such as this one.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions