Error importing component classes (TypeScript)

[esbanarango]

🐞 Bug description

Importing a component class ends up being a different object than the class itself. Preventing extending it or interacting with it.

This works fine without using TypeScript

👨‍🔬 Example

Trying to stub some properties or methods of a Component class.

// This is no longer a valid/normal Class as Embroider has converted into a different (owner) object.
import TestComponent from 'owner-embroider-issue/components/test-component';

module('Integration | Component | test-component', function (hooks) {
  setupRenderingTest(hooks);

  test('...', async function (assert) {
    this.owner.register(
      'component:test-component',
      class extends TestComponent {
        // Propertier and methods I want to override
      }
    );

    await render(hbs`<TestComponent />`);
  });
});

When doing: import TestComponent from 'owner-embroider-issue/components/test-component';, TestComponent is no longer a Class, but a different "object", so we can not "extend" it anymore.

😕 Actual Behavior

🤔 Expected Behavior

This is the output without using Typescript

🌍 Environment

"@embroider/compat": "^2.0.2",
"@embroider/core": "^2.0.2",
"@embroider/webpack": "^2.0.2",
"ember-source": "~4.10.0",
"ember-cli": "~4.10.0",
"ember-cli-typescript": "^5.2.1",
"typescript": "^4.9.4",
"webpack": "^5.75.0"

🔀 App to reproduce the issue

https://github.com/esbanarango/owner-embroider-issue/tree/typescript

[dmuneras]

Got the same issue :(

[ef4]

I think this and #1336 are probably the same bug.

[ef4]

Fixed in #1342 and I confirmed that it fixes your reproduction.