microsoft / BotFramework-WebChat

A highly-customizable web-based client for Azure Bot Services.
https://www.botframework.com/
MIT License
1.59k stars 1.54k forks source link

CommonJS 4.17.0 Issue - EJS botframework-webchat-api #5238

Open shah-vtx opened 3 months ago

shah-vtx commented 3 months ago

Is it an issue related to Adaptive Cards?

No

Is this an accessibility issue?

No

What version of Web Chat are you using?

Latest production

Which distribution are you using Web Chat from?

NPM

Which hosting environment does this issue primarily affect?

Web apps

Which browsers and platforms do the issue happened?

Others or unrelated

Which area does this issue affect?

Others or unrelated

Which theme pack does this issue affect?

I did not test it on other theme packs

What is the public URL for the website?

No response

Please describe the bug

image

I'm using a TS project with webpack. It is using commonjs. 4.16.0 works perfectly fine but as soon as I switch to the latest 4.17.0, I get runtime errors in the console in the browser because it is trying to use .mjs files. I also saw this PR and thought it would fix it so I tried the latest main version: 4.17.1-main.20240708.c9247bf.

Do you see any errors in console log?

botframework-webchat-api.mjs:1 Uncaught (in promise) TypeError: i is not a function
    at botframework-webchat-api.mjs:1:23790
    at chunk-4ZIUY4G5.mjs:1:182
    at ./node_modules/botframework-webchat-api/dist/botframework-webchat-api.mjs (botframework-webchat-api.mjs:139:43590)
    at __webpack_require__ (bootstrap:24:1)
    at fn (hot module replacement:62:1)
    at ./node_modules/botframework-webchat-component/dist/botframework-webchat-component.mjs (botframework-webchat-component.internal.mjs:3:1)
    at __webpack_require__ (bootstrap:24:1)
    at fn (hot module replacement:62:1)
    at ./node_modules/botframework-webchat/dist/chunk-EZUR2UAI.mjs (botframework-webchat.mjs:3:1)
    at __webpack_require__ (bootstrap:24:1)

How to reproduce the issue?

As as you load it in the browser.

What do you expect?

For the page to load and crash to not occur.

What actually happened?

Crashes with console error

Do you have any screenshots or recordings to repro the issue?

N/A

Adaptive Card JSON

No response

Additional context

No response

OEvgeny commented 3 months ago

We had some fixes related to Webpack, please try 4.18.*

shah-vtx commented 3 months ago

I just tried 4.18.0 and still seeing the same issue.

OEvgeny commented 3 months ago

Looks like another regression with globalize.

The i refers to Globalize._numberRound where the Globalize is imported from globalize/dist/globalize-runtime as CJS module: image

The runtime module does not contain the function: image

Instead, it is added in globalize/dist/globalize-runtime/number, defined in the module: image

We seem to bundle-in everything needed for it to work, and respect the execution order of modules.

cc @compulim

OEvgeny commented 3 months ago

@shah-vtx could you share your webpack configuration and exact versions of webopack and plugins used?

OEvgeny commented 3 months ago

There is a known issue with Webpack v5 mentioned in changelog:

[4.17.0] - 2024-05-06

Known issues

  • Web Chat is not loading with error Uncaught TypeError: Super constructor null of anonymous class is not a constructor

Please make sure you're using the right version.

shah-vtx commented 3 months ago

I did an override in my package.json to webpack 5.90.0 and still the same runtime console error.

image
OEvgeny commented 3 months ago

Can't assist without further details on webpack configuration and used plugins versions.

@shah-vtx could you share your webpack configuration and exact versions of webopack and plugins used?