Webpack error while compiling in webpack (nuxt js)

[ahoulgrave]

Describe the bug When trying to integrate into a nuxtjs project, a Cannot read property 'accept' of undefined error is breaking webpack HMR. Also when building the project statically it does not work. It errors Uncaught (in promise) RangeError: Maximum call stack size exceeded

Not sure what's going on. I think there may be some kind of conflict with webpack, or something. When running the webpack dev server, the style-loader complains but not sure what's the problem.

I created a quick project from scratch so you can reproduce.

To Reproduce Steps to reproduce the behavior:

1. Clone https://github.com/ahoulgrave/demo-nuxt-conversejs
2. Run yarn dev
3. Go to http://localhost:3000
4. Open the console to see the error

Expected behavior Chat widget appears.

Environment (please complete the following information):

• Desktop and Mobile
• All Browsers
• Converse.js version [7.0.5]

Additional context

I just created an empty nuxt project very simple, no SSR, no typescript.

Edited this file to add conversejs script and stylesheet: https://github.com/ahoulgrave/demo-nuxt-conversejs/blob/main/nuxt.config.js#L21-L24

This is the component that initialises conversejs: https://github.com/ahoulgrave/demo-nuxt-conversejs/blob/main/components/Chat.vue

And this is where the component is called: https://github.com/ahoulgrave/demo-nuxt-conversejs/blob/main/pages/index.vue#L27-L36

This is my log of the error when you build the project statically: localhost-1621456458618.log

This is the log of the error when you run webpack dev server: localhost-1621456817272.log

Than you very much in advance.

---

Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

[jcbrand]

Thanks for a well written bug report. I don't have any experience with Nuxt.js but I'll check out your demo project to see if I can find the issue.

[ahoulgrave]

@jcbrand thanks a lot! i don't know a lot of javascript, but let me know if i can help in any way. tried to track the errors with the browser debugger but couldn't get anywhere. maybe it's a conflict of global variable names? idk, if i had to guess i'd say there's some kind of webpack conflict

[jcbrand]

I got your email @ahoulgrave, but haven't had time yet to look into it.

[ahoulgrave]

hello @jcbrand :wave: i was wondering if you could point me in the right direction on where to start debugging this, see if i could help checking this issue.

thank you in advance!

[jcbrand]

I'm sorry @ahoulgrave, I don't have experience with either Vue or Nuxt and I don't see anything in your logs that indicate to me that this is a problem with Converse or that there is something to fix in Converse in order to make it work with Nuxt.