Get error : The provided Elm instance does not match what we expected

[dowdiness]

Hello Parasrah!

First of all, thanks for making this library. This project looks useful for me!

I use this library within Redwood project, almost same setup as your example project.
But I get The provided Elm instance does not match what we expected error.

I'm not sure this is because of my failure or this library, but I can't solve this error by myself.

This is my project's Github repository and you can see all elm related file changes here.
You can see Live example WebSite as well.

[Parasrah]

Thank you so much for taking the time to let me know, I'll try to find some time tonight to fix this

[Parasrah]

Hi @dowdiness

I dug into this a bit tonight and I think it has something to do with your webpack configuration somehow. I tried for the life of my to figure out what kind of object webpack is importing for you using the hosted instance you posted, but I can't get local overrides to work for it in chromiums devtools. I also pulled your project locally and subverted the normal build process (because I don't have yarn) with parcel and it worked.

Would it be possible for you to just toss a console.log like so:

import wrap from '@elm-react/component'

import Counter from 'src/Elm/Counter/Counter.elm'

console.log(Counter)

export default wrap(Counter)

and letting me know what Counter actually is? I'm thinking it might be undefined or something. At any rate I should probably add more information to the error so you don't have to go digging for this info next time

[dowdiness]

Thank you for your quick response.

I added console.log(Counter) and get this message

/static/media/Counter.6c090d9d.elm

so this elm component is not undefined but just the path to the file. Is this what @elm-react expects to get as an ElmInstance?

I updated example site.
https://5eae0852b7c7290006ff335d--hello-redwood.netlify.app/counter

[dowdiness]

My webpack config is based on this redwood webpack config guide https://redwoodjs.com/guides/webpack-config

This is their config files.
https://github.com/redwoodjs/redwood/tree/master/packages/core

I think if something wrong with my webpack configuration then I should open an issue on redwood repository as well.

[Parasrah]

Interesting, that's actually what I saw when I managed to hit a breakpoint in that file but I assumed it was just an issue with source maps. It seems to me like the file isn't being processed by elm-webpack-loader. I'll take a closer look at your config and let you know if I see any obvious issues

[Parasrah]

I don't see anything that's clearly wrong with your config, but I have a few suggestions as to how I'd go about debugging it:

1. try getting rid of elm-hot-webpack-loader, reducing any unnecessary complexity to get the simple use-case working
2. If the Elm file is being processed correctly (and my memory is correct), the import should be an object that looks something like this:

{
  Elm: {
    Counter: {
      init() {...},
      ...
    }
  }
}

If none of that works I can take a look at the redwood docs you provided and make sure what you have is following their documentation. After all I know sometimes a second set of eyes can really help

[Parasrah]

Going to close this issue since it is not a bug with this library, but happy to continue helping out