Colocation does not work with anonymous classes and class decorators

[boris-petrov]

Moved from https://github.com/typed-ember/ember-cli-typescript/issues/1166 . There is a reproduction repo there.

cc @chriskrycho

Quote from Chris in Discord:

I think it'll just need to tweak the transform so that if it's not a named class (BUT NAME YOUR CLASSES PEOPLE) it'll compile to

import Component, { setComponentTemplate } from '@ember/component';
import template from './component.hbs';

export default setComponentTemplate(template, class extends Component {});

[rwjblue]

Transferred to ember-cli/ember-cli-htmlbars.

[rwjblue]

In general, I would think this already works properly. We have an explicit test in the babel plugin for this input:

https://github.com/ember-cli/ember-cli-htmlbars/blob/91554d99c5321ce84ebec877a46fff02659f06f4/node-tests/colocated-babel-plugin-test.js#L113-L131

If you could add another test to the broccoli plugin side (maybe there is an issue there and not in the babel plugin) like this:

https://github.com/ember-cli/ember-cli-htmlbars/blob/91554d99c5321ce84ebec877a46fff02659f06f4/node-tests/colocated-broccoli-plugin-test.js#L80-L138

That uses export default class extends Component {} (anonymous class), then we could confirm if that is an issue or not.

[rwjblue]

@boris-petrov - A small reproduction would also be helpful here...

[boris-petrov]

@rwjblue - sorry, I mentioned that there is a reproduction repo in the original issue I opened, I guess you've missed it. Here is the repo. Note that according to the other issue, ember-cli-typescript has nothing to do with the problem and it appears even when you remove ember-cli-typescript.

[rwjblue]

Ya, I was not really thinking it was an ember-cli-typescript issue, but I do think it is related to a combination of something else. For example, in that repro it looks like your input is leveraging a class decorator and we have https://github.com/ember-cli/ember-cli-htmlbars/issues/442 reporting issues in that scenario. We'd need to dig in and see if this is actually a duplicate of that issue...

[chriskrycho]

Yeah, when @dfreeman poked at it, it looked like it was specifically to do with its being a decorated anonymous class—he could reproduce without ember-cli-typescript—but @boris-petrov's finding that it only showed up in his case when ember-cli-typescript was involved suggested to me that it is likely a matter of the ordering of the Babel plugins, since (until very soon now when we ship e-c-ts 4.0) e-c-ts impacts ordering of plugins.

Our ecosystem-level changes for ember-cli-babel and ember-cli-typescript should eliminate that as a cause of these kinds of things going forward, but that's likely (at least part of) the root issue there.

[rwjblue]

Is this the same as #442?

[boris-petrov]

Well, in your previous comment you said that it could be... so it still could be. :smile:

[rwjblue]

🤦‍♂️ - totally missed that while triaging issues 😭

But the good news is, old me and current me happen to agree on something...