Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Getting error trying to render a react component inside an .hbs #4

Open
rstudner opened this issue Apr 22, 2022 · 4 comments
Open

Getting error trying to render a react component inside an .hbs #4

rstudner opened this issue Apr 22, 2022 · 4 comments

Comments

@rstudner
Copy link

rstudner commented Apr 22, 2022

I did:
npm i -D ember-cli-react-fork
ember generate ember-cli-react

then I cut an pasted your say-hi.jsx into app/components

went to an .hbs and added:
{{say-hi name="Alex"}}

this is what I get in the console:
Uncaught (in promise) Error: Assertion Failed: Failed to create an instance of 'component:say-hi'. Most likely an improperly defined class or an invalid module export.
at assert (vendor.js:41802:15)
at FactoryManager.create (vendor.js:7211:82)
at Proxy.create (vendor.js:6932:20)
at CurlyComponentManager.create (vendor.js:13142:31)
at Object.evaluate (vendor.js:56115:25)
at AppendOpcodes.evaluate (vendor.js:54420:19)
at LowLevelVM.evaluateSyscall (vendor.js:57921:22)
at LowLevelVM.evaluateInner (vendor.js:57877:14)
at LowLevelVM.evaluateOuter (vendor.js:57869:14)
at VM.next (vendor.js:58994:24)
at VM._execute (vendor.js:58978:23)
at VM.execute (vendor.js:58949:28)
at TryOpcode.handleException (vendor.js:58058:23)
at UpdatingVMFrame.handleException (vendor.js:58294:31)
at UpdatingVM.throw (vendor.js:57989:18)
at Assert.evaluate (vendor.js:55566:17)
at UpdatingVM._execute (vendor.js:57972:16)
at vendor.js:57943:63
at runInTrackingTransaction (vendor.js:60670:21)
at UpdatingVM.execute (vendor.js:57943:51)
at RenderResultImpl.rerender (vendor.js:58322:10)
at vendor.js:17044:57
at RootState.render (vendor.js:17010:11)
at vendor.js:17336:18
at inTransaction (vendor.js:57754:9)
at InteractiveRenderer._renderRoots (vendor.js:17316:37)
at InteractiveRenderer._renderRootsTransaction (vendor.js:17368:14)
at InteractiveRenderer._revalidate (vendor.js:17410:12)
at invoke (vendor.js:62370:16)
at Queue.flush (vendor.js:62261:13)
at DeferredActionQueues.flush (vendor.js:62458:21)
at Backburner._end (vendor.js:62992:34)
at Backburner._boundAutorunEnd (vendor.js:62661:14)

@rstudner rstudner reopened this Apr 22, 2022
@rstudner
Copy link
Author

rstudner commented Apr 22, 2022

So I have your resolve.js in my repo.. but my app.js still references the ember-resolver.

If I change my app.js to also have the ember-cli-react-resolver (per reading the issue discussion you were having with Nate) I get this (without even having a single .jsx file/attempt in the codebase).

Uncaught TypeError: Class constructor HeadLayout cannot be invoked without 'new'
at renderWithHooks (vendor.js:435546:157)
at mountIndeterminateComponent (vendor.js:435885:872)
at beginWork (vendor.js:436129:93)
at HTMLUnknownElement.callCallback (vendor.js:433681:119)
at HTMLUnknownElement.sentryWrapped (vendor.js:260716:17)
at Object.invokeGuardedCallbackDev (vendor.js:433701:45)
at invokeGuardedCallback (vendor.js:433720:126)
at beginWork$1 (vendor.js:437060:1)
at performUnitOfWork (vendor.js:436849:270)
at workLoopSync (vendor.js:436842:30)
at renderRootSync (vendor.js:436839:195)
at performSyncWorkOnRoot (vendor.js:436769:121)
at scheduleUpdateOnFiber (vendor.js:436650:1)
at updateContainer (vendor.js:437249:313)
at vendor.js:437292:29
at unbatchedUpdates (vendor.js:436794:209)
at legacyRenderSubtreeIntoContainer (vendor.js:437292:1)
at Object.render (vendor.js:437294:519)
at Class.renderReactComponent (vendor.js:176288:25)
at Class.didRender (vendor.js:176242:12)
at Class.trigger (vendor.js:39119:23)
at Class.superWrapper [as trigger] (vendor.js:36515:22)
at CurlyComponentManager.didCreate (vendor.js:13275:19)
at TransactionImpl.commit (vendor.js:57602:19)
at EnvironmentImpl.commit (vendor.js:57731:19)
at inTransaction (vendor.js:57756:13)
at InteractiveRenderer._renderRoots (vendor.js:17316:37)
at InteractiveRenderer._renderRootsTransaction (vendor.js:17368:14)
at InteractiveRenderer._renderRoot (vendor.js:17303:12)
at InteractiveRenderer._appendDefinition (vendor.js:17218:12)
at InteractiveRenderer.appendOutletView (vendor.js:17204:12)
at invoke (vendor.js:62372:16)
at Queue.flush (vendor.js:62261:13)
at DeferredActionQueues.flush (vendor.js:62458:21)
at Backburner._end (vendor.js:62992:34)
at Backburner._boundAutorunEnd (vendor.js:62661:14)

(that is from ember-cli-head, but if I take it out, the same error just shows up for the next thing in application.hbs)

@rstudner
Copy link
Author

rstudner commented May 5, 2022

Another comment

Tried creating a 100% blank/new ember-cli 3.28.4 app.

npm i -D ember-cli-react-fork
ember generate ember-cli-react

Did the standard say-hi component example... fails to render - I see this in the console:

Screen Shot 2022-05-05 at 11 35 34 AM

@pswai
Copy link
Owner

pswai commented May 9, 2022

Hey @rstudner, sorry for the late reply. I was out of town as it was a long holiday here 😄

Let me try to reproduce this. Or do you have a minimal reproducible repo for me to look into?

@pswai
Copy link
Owner

pswai commented May 9, 2022

Another comment

Tried creating a 100% blank/new ember-cli 3.28.4 app.

npm i -D ember-cli-react-fork ember generate ember-cli-react

Did the standard say-hi component example... fails to render - I see this in the console:

Screen Shot 2022-05-05 at 11 35 34 AM

@rstudner I have reproduced this one. The blueprint seems to have missed updating app.js. For a fresh new repository, updating your app.js with the following will work:

- import Resolver from 'ember-resolver';
+ import Resolver from 'ember-cli-react/resolver';

I'll update the readme for this one.

As for your other comments, is it possible to have a minimal reproducible repo?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants